From ae47850fc526af4edaa03e27a7ba9479643a9130 Mon Sep 17 00:00:00 2001 From: Riccardo Date: Sun, 16 Oct 2022 16:45:12 +0100 Subject: [PATCH] fix: improve TM explanation (#3364) --- .../backward-compatibility-turbomodules.md | 26 +++++++++++++++++-- .../pillars-turbomodule.md | 14 ++++------ .../backward-compatibility-turbomodules.md | 26 +++++++++++++++++-- .../pillars-turbomodule.md | 17 +++++------- 4 files changed, 59 insertions(+), 24 deletions(-) diff --git a/docs/the-new-architecture/backward-compatibility-turbomodules.md b/docs/the-new-architecture/backward-compatibility-turbomodules.md index 0ded326ca9b..c0c0784efb8 100644 --- a/docs/the-new-architecture/backward-compatibility-turbomodules.md +++ b/docs/the-new-architecture/backward-compatibility-turbomodules.md @@ -178,7 +178,9 @@ This changes do three main things: The second step is to instruct Xcode to avoid compiling all the lines using the New Architecture types and files when we are building an app with the Old Architecture. -The file to change is the module implementation file, which is usually a `.mm` file. That file is structured as follows: +There are two files to change. The module implementation file, which is usually a `.mm` file, and the module header, which is usually a `.h` file. + +That implementation file is structured as follows: - Some `#import` statements, among which there is a `.h` file. - The module implementation, using the various `RCT_EXPORT_xxx` and `RCT_REMAP_xxx` macros. @@ -205,7 +207,27 @@ The **goal** is to make sure that the `Turbo Native Module` still builds with th @end ``` -This snippet uses the same `RCT_NEW_ARCH_ENABLED` flag used in the previous [section](#dependencies-ios). When this flag is not set, Xcode skips the lines within the `#ifdef` during compilation and it does not include them into the compiled binary. +A similar thing needs to be done for the header file. Add the following lines at the bottom of your module header. You need to first import the header and then, if the New Architecture is enabled, make it conform to the Spec protocol. + +```diff +#import ++ #ifdef RCT_NEW_ARCH_ENABLED ++ #import ++ #endif + +@interface YourModule: NSObject + +@end + ++ #ifdef RCT_NEW_ARCH_ENABLED ++ @interface YourModule () + ++ @end ++ #endif + +``` + +This snippets uses the same `RCT_NEW_ARCH_ENABLED` flag used in the previous [section](#dependencies-ios). When this flag is not set, Xcode skips the lines within the `#ifdef` during compilation and it does not include them into the compiled binary. ### Android diff --git a/docs/the-new-architecture/pillars-turbomodule.md b/docs/the-new-architecture/pillars-turbomodule.md index ea022d62367..43688891768 100644 --- a/docs/the-new-architecture/pillars-turbomodule.md +++ b/docs/the-new-architecture/pillars-turbomodule.md @@ -427,11 +427,11 @@ Now add the Native code for your Turbo Native Module. Create two files in the `R ##### RTNCalculator.h ```objc title="RTNCalculator.h" -#import +#import NS_ASSUME_NONNULL_BEGIN -@interface RTNCalculator : NSObject +@interface RTNCalculator : NSObject @end @@ -448,13 +448,9 @@ This file defines the interface for the `RTNCalculator` module. Here, we can add @implementation RTNCalculator -RCT_EXPORT_MODULE(RTNCalculator) +RCT_EXPORT_MODULE() -RCT_REMAP_METHOD(add, addA:(NSInteger)a - andB:(NSInteger)b - withResolver:(RCTPromiseResolveBlock) resolve - withRejecter:(RCTPromiseRejectBlock) reject) -{ +- (void)add:(double)a b:(double)b resolve:(RCTPromiseResolveBlock)resolve reject:(RCTPromiseRejectBlock)reject { NSNumber *result = [[NSNumber alloc] initWithInteger:a+b]; resolve(result); } @@ -470,7 +466,7 @@ RCT_REMAP_METHOD(add, addA:(NSInteger)a The most important call is to the `RCT_EXPORT_MODULE`, which is required to export the module so that React Native can load the Turbo Native Module. -Then the `RCT_REMAP_METHOD` macro is used to expose the `add` method. +Then the `add` method, whose signature must match the one specified by the Codegen in the `RTNCalculatorSpec.h`. Finally, the `getTurboModule` method gets an instance of the Turbo Native Module so that the JavaScript side can invoke its methods. The function is defined in (and requested by) the `RTNCalculatorSpec.h` file that was generated earlier by Codegen. diff --git a/website/versioned_docs/version-0.70/the-new-architecture/backward-compatibility-turbomodules.md b/website/versioned_docs/version-0.70/the-new-architecture/backward-compatibility-turbomodules.md index 9118621df8f..c533176e9d5 100644 --- a/website/versioned_docs/version-0.70/the-new-architecture/backward-compatibility-turbomodules.md +++ b/website/versioned_docs/version-0.70/the-new-architecture/backward-compatibility-turbomodules.md @@ -163,7 +163,9 @@ This changes do three main things: The second step is to instruct Xcode to avoid compiling all the lines using the New Architecture types and files when we are building an app with the Old Architecture. -The file to change is the module implementation file, which is usually a `.mm` file. That file is structured as follow: +There are two files to change. The module implementation file, which is usually a `.mm` file, and the module header, which is usually a `.h` file. + +That implementation file is structured as follows: - Some `#import` statements, among which there is a `.h` file. - The module implementation, using the various `RCT_EXPORT_xxx` and `RCT_REMAP_xxx` macros. @@ -190,7 +192,27 @@ The **goal** is to make sure that the `Turbo Native Module` still builds with th @end ``` -This snippet uses the same `RCT_NEW_ARCH_ENABLED` flag used in the previous [section](#dependencies-ios). When this flag is not set, Xcode skips the lines within the `#ifdef` during compilation and it does not include them into the compiled binary. +A similar thing needs to be done for the header file. Add the following lines at the bottom of your module header. You need to first import the header and then, if the New Architecture is enabled, make it conform to the Spec protocol. + +```diff +#import ++ #ifdef RCT_NEW_ARCH_ENABLED ++ #import ++ #endif + +@interface YourModule: NSObject + +@end + ++ #ifdef RCT_NEW_ARCH_ENABLED ++ @interface YourModule () + ++ @end ++ #endif + +``` + +This snippets uses the same `RCT_NEW_ARCH_ENABLED` flag used in the previous [section](#dependencies-ios). When this flag is not set, Xcode skips the lines within the `#ifdef` during compilation and it does not include them into the compiled binary. ### Android diff --git a/website/versioned_docs/version-0.70/the-new-architecture/pillars-turbomodule.md b/website/versioned_docs/version-0.70/the-new-architecture/pillars-turbomodule.md index 3be233a4736..4533a2f3b40 100644 --- a/website/versioned_docs/version-0.70/the-new-architecture/pillars-turbomodule.md +++ b/website/versioned_docs/version-0.70/the-new-architecture/pillars-turbomodule.md @@ -182,7 +182,6 @@ require "json" package = JSON.parse(File.read(File.join(__dir__, "package.json"))) -folly_version = '2021.07.22.00' folly_compiler_flags = '-DFOLLY_NO_CONFIG -DFOLLY_MOBILE=1 -DFOLLY_USE_LIBCPP=1 -Wno-comma -Wno-shorten-64-to-32' Pod::Spec.new do |s| @@ -208,7 +207,7 @@ Pod::Spec.new do |s| } s.dependency "React-Codegen" - s.dependency "RCT-Folly", folly_version + s.dependency "RCT-Folly" s.dependency "RCTRequired" s.dependency "RCTTypeSafety" s.dependency "ReactCommon/turbomodule/core" @@ -415,11 +414,11 @@ Now add the Native code for your Turbo Native Module. Create two files in the `R ##### RTNCalculator.h ```objc title="RTNCalculator.h" -#import +#import NS_ASSUME_NONNULL_BEGIN -@interface RTNCalculator : NSObject +@interface RTNCalculator : NSObject @end @@ -436,13 +435,9 @@ This file defines the interface for the `RTNCalculator` module. Here, we can add @implementation RTNCalculator -RCT_EXPORT_MODULE(RTNCalculator) +RCT_EXPORT_MODULE() -RCT_REMAP_METHOD(add, addA:(NSInteger)a - andB:(NSInteger)b - withResolver:(RCTPromiseResolveBlock) resolve - withRejecter:(RCTPromiseRejectBlock) reject) -{ +- (void)add:(double)a b:(double)b resolve:(RCTPromiseResolveBlock)resolve reject:(RCTPromiseRejectBlock)reject { NSNumber *result = [[NSNumber alloc] initWithInteger:a+b]; resolve(result); } @@ -458,7 +453,7 @@ RCT_REMAP_METHOD(add, addA:(NSInteger)a The most important call is to the `RCT_EXPORT_MODULE`, which is required to export the module so that React Native can load the Turbo Native Module. -Then the `RCT_REMAP_METHOD` macro is used to expose the `add` method. +Then the `add` method, whose signature must match the one specified by the Codegen in the `RTNCalculatorSpec.h`. Finally, the `getTurboModule` method gets an instance of the Turbo Native Module so that the JavaScript side can invoke its methods. The function is defined in (and requested by) the `RTNCalculatorSpec.h` file that was generated earlier by Codegen.