Skip to content

Commit 2f19a69

Browse files
SimekSimek
committed
backport changes from playbook branch
1 parent f6016fe commit 2f19a69

7 files changed

+59
-65
lines changed

‎docs/new-architecture-app-modules-android.md

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -133,8 +133,6 @@ public class MyApplicationTurboModuleManagerDelegate extends ReactPackageTurboMo
133133

134134
protected native HybridData initHybrid();
135135

136-
native boolean canCreateTurboModule(String moduleName);
137-
138136
public static class Builder extends ReactPackageTurboModuleManagerDelegate.Builder {
139137
protected MyApplicationTurboModuleManagerDelegate build(
140138
ReactApplicationContext context, List<ReactPackage> packages) {
@@ -289,12 +287,6 @@ public:
289287
std::shared_ptr<TurboModule> getTurboModule(const std::string name, const std::shared_ptr<CallInvoker> jsInvoker) override;
290288
std::shared_ptr<TurboModule> getTurboModule(const std::string name, const JavaTurboModule::InitParams &params) override;
291289

292-
/**
293-
* Test-only method. Allows user to verify whether a TurboModule can be created
294-
* by instances of this class.
295-
*/
296-
bool canCreateTurboModule(std::string name);
297-
298290
private:
299291
friend HybridBase;
300292
using HybridBase::HybridBase;
@@ -321,7 +313,6 @@ jni::local_ref<MyApplicationTurboModuleManagerDelegate::jhybriddata> MyApplicati
321313
void MyApplicationTurboModuleManagerDelegate::registerNatives() {
322314
registerHybrid({
323315
makeNativeMethod("initHybrid", MyApplicationTurboModuleManagerDelegate::initHybrid),
324-
makeNativeMethod("canCreateTurboModule", MyApplicationTurboModuleManagerDelegate::canCreateTurboModule),
325316
});
326317
}
327318

@@ -334,10 +325,6 @@ std::shared_ptr<TurboModule> MyApplicationTurboModuleManagerDelegate::getTurboMo
334325
return MyApplicationModuleProvider(name, params);
335326
}
336327

337-
bool MyApplicationTurboModuleManagerDelegate::canCreateTurboModule(std::string name) {
338-
return getTurboModule(name, nullptr) != nullptr || getTurboModule(name, {.moduleName = name}) != nullptr;
339-
}
340-
341328
} // namespace react
342329
} // namespace facebook
343330
```

‎docs/new-architecture-app-renderer-android.md

Lines changed: 29 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -233,27 +233,32 @@ As you can see, some methods are `native()` which we will implement in C++ in th
233233
```java
234234
package com.awesomeproject;
235235

236-
@DoNotStrip
237-
public class MyComponentsRegistry {
238-
static {
239-
SoLoader.loadLibrary("fabricjni");
240-
}
241-
242-
@DoNotStrip private final HybridData mHybridData;
243-
244-
@DoNotStrip
245-
private native HybridData initHybrid(ComponentFactory componentFactory);
246-
247-
@DoNotStrip
248-
private MyComponentsRegistry(ComponentFactory componentFactory) {
249-
mHybridData = initHybrid(componentFactory);
250-
}
251-
252-
@DoNotStrip
253-
public static MyComponentsRegistry register(ComponentFactory componentFactory) {
254-
return new MyComponentsRegistry(componentFactory);
255-
}
256-
}
236+
import com.facebook.jni.HybridData;
237+
import com.facebook.proguard.annotations.DoNotStrip;
238+
import com.facebook.react.fabric.ComponentFactory;
239+
import com.facebook.soloader.SoLoader;
240+
241+
@DoNotStrip
242+
public class MyComponentsRegistry {
243+
static {
244+
SoLoader.loadLibrary("fabricjni");
245+
}
246+
247+
@DoNotStrip private final HybridData mHybridData;
248+
249+
@DoNotStrip
250+
private native HybridData initHybrid(ComponentFactory componentFactory);
251+
252+
@DoNotStrip
253+
private MyComponentsRegistry(ComponentFactory componentFactory) {
254+
mHybridData = initHybrid(componentFactory);
255+
}
256+
257+
@DoNotStrip
258+
public static MyComponentsRegistry register(ComponentFactory componentFactory) {
259+
return new MyComponentsRegistry(componentFactory);
260+
}
261+
}
257262
```
258263

259264
4. **Register your custom Fabric Component Registry**
@@ -297,7 +302,7 @@ public class MyApplication extends Application implements ReactApplication {
297302

298303
It’s now time to provide an implementation for your `MyComponentsRegistry` in C++:
299304

300-
1. **Create an header file: `MyComponentsRegistry.h`**
305+
1. **Create a header file: `MyComponentsRegistry.h`**
301306

302307
The file should be placed inside the `src/main/jni` folder.
303308
Please note that the `kJavaDescriptor` should be adapted to follow the package name you picked for your project.
@@ -416,6 +421,8 @@ If you followed the TurboModule instructions, you should have a `OnLoad.cpp` fil
416421
```cpp title="OnLoad.cpp"
417422
#include <fbjni/fbjni.h>
418423
#include "MyApplicationTurboModuleManagerDelegate.h"
424+
// Add this import
425+
#include "MyComponentsRegistry.h"
419426

420427
JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) {
421428
return facebook::jni::initialize(vm, [] {

‎docs/new-architecture-app-renderer-ios.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,15 +20,15 @@ target 'Some App' do
2020
end
2121

2222
def pods()
23-
// Get config
23+
# Get config
2424
config = use_native_modules!
2525

26-
// Use env variables to turn it on/off.
26+
# Use env variables to turn it on/off.
2727
fabric_enabled = ENV['USE_FABRIC']
2828
use_codegen_discovery= ENV['USE_CODEGEN_DISCOVERY']
2929

30-
// Enabled codegen discovery. This will run the codegen at preinstall time.
31-
// Files are generated at {pod installation root}/build/generated/ios/
30+
# Enabled codegen discovery. This will run the codegen at preinstall time.
31+
# Files are generated at {pod installation root}/build/generated/ios/
3232
if use_codegen_discovery
3333
Pod::UI.puts "[Codegen] Building target with codegen library discovery enabled."
3434
pre_install do |installer|
@@ -41,7 +41,7 @@ if use_codegen_discovery
4141
end
4242
end
4343

44-
// Pass the flag to enable fabric to use_react_native!.
44+
# Pass the flag to enable fabric to use_react_native!.
4545
use_react_native!(
4646
...
4747
:fabric_enabled => fabric_enabled

‎docs/new-architecture-appendix.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,19 +7,19 @@ title: Appendix
77

88
You may use the following table as a reference for which types are supported and what they map to in each platform:
99

10-
| Flow Type | Nullable Support? | Android (Java) | iOS | Note |
11-
| ------------------------------------------------ | ----------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ |
12-
| `string` | `?string` | `String` | `NSString` | |
13-
| `boolean` | `?boolean` | `Boolean` | `NSNumber` | |
14-
| `number` | No | `double` | `NSNumber` | |
15-
| `{ foo: string, ... }` | `?{ foo: string, ... }` | | | Object literal. This is recommended over simply using Object, for type safety. |
16-
| `Object` | `?Object` | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). |
17-
| `Array<*>` | `?Array<*>` | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | |
18-
| `Function` | `?Function` | | | |
19-
| `Promise<*>` | `?Promise<*>` | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | |
20-
| Type aliases of the above | Yes | | | |
21-
| Type Unions <code>'SUCCESS' &#124; 'FAIL'</code> | Only as callbacks. | | | Type unions only supported as callbacks. |
22-
| Callbacks: `() =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. |
10+
| Flow Type | Nullable Support? | Android (Java) | iOS | Note |
11+
| ---------------------------------------------- | --------------------------------------------- | ------------------------------------ | -------------------------------------------------------------- | ------------------------------------------------------------------------------ |
12+
| `string` | `?string` | `String` | `NSString` | |
13+
| `boolean` | `?boolean` | `Boolean` | `NSNumber` | |
14+
| `number` | No | `double` | `NSNumber` | |
15+
| <code>{&#124; foo: string, ... &#124;}</code> | <code>?{&#124; foo: string, ...&#124;}</code> | | | Object literal. This is recommended over simply using Object, for type safety. |
16+
| `Object` | `?Object` | `ReadableMap` | `@{} (untyped dictionary)` | Recommended to use object literal (see above). |
17+
| `Array<*>` | `?Array<*>` | `ReadableArray` | `NSArray` (or `RCTConvertVecToArray` when used inside objects) | |
18+
| `Function` | `?Function` | | | |
19+
| `Promise<*>` | `?Promise<*>` | `com.facebook.react.bridge.Promise` | `RCTPromiseResolve` and `RCTPromiseRejectBlock` | |
20+
| Type aliases of the above | Yes | | | |
21+
| Type Unions <code>'SUCCESS'&#124;'FAIL'</code> | Only as callbacks. | | | Type unions only supported as callbacks. |
22+
| Callbacks: `( ) =>` | Yes | `com.facebook.react.bridge.Callback` | `RCTResponseSenderBlock` | Callback functions are not type checked, and are generalized as Objects. |
2323

2424
You may also find it useful to refer to the JavaScript specifications for the core modules in React Native. These are located inside the `Libraries/` directory in the React Native repository.
2525

‎docs/new-architecture-library-android.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ react {
2121

2222
_(Please note that this setup requires you to have the React Gradle Plugin configured in the prerequisite step)._
2323

24-
There are two arguments that are required:
24+
There are three arguments that are required:
2525

2626
- `reactRoot`: Reference to the `react-native` package root. Usually located inside `../node_modules/react-native`. For third-party NPM libraries that are installed in `node_modules`, this will be `../react-native`.
2727
- `jsRootDir`: Reference to the directory that contains the JavaScript specs for this library.
@@ -75,7 +75,7 @@ app/build/generated/source/codegen
7575
└── schema.json
7676
```
7777

78-
### Extends the abstract class provided by the generated
78+
### Extends the abstract class provided by the codegen
7979

8080
Update your native module or component to ensure it **extends the abstract class** that has been code-generated from your JavaScript specs (i.e. the `NativeAwesomeManagerSpec.java` file from the previous example).
8181

‎docs/new-architecture-library-intro.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -83,10 +83,10 @@ The new renderer also known as Fabric doesn’t use the UIManager so direct call
8383
8484
Fabric will be providing new type safe JS APIs that are much more ergonomic than some of the patterns we've seen in product code today. These APIs require references to the underlying component, no longer using the result of `findNodeHandle`. `findNodeHandle` is used to search the tree for a native component given a class instance. This was breaking the React abstraction model. `findNodeHandle` won’t be compatible with React concurrent mode once we are ready to roll that out. Deprecation of `findNodeHandle` in React Native is similar to the [deprecation of `findDOMNode` in React DOM](https://reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage).
8585
86-
While we know that all deprecations are a hassle, this guide is intended to help people update components as smoothly as possible. Here are the steps you need to take to get your JS codebase ready for Fabric
86+
While we know that all deprecations are a hassle, this guide is intended to help people update components as smoothly as possible. Here are the steps you need to take to get your JS codebase ready for Fabric:
8787
8888
1. Migrating findNodeHandle / getting a HostComponent
89-
2. Migrating `.measure*(`
89+
2. Migrating `.measure*()`
9090
3. Migrating off `setNativeProps`
9191
4. Move the call to `requireNativeComponent` to a separate file
9292
5. Migrating off `dispatchViewManagerCommand`
@@ -166,7 +166,7 @@ const MyJSComponent = React.forwardRef((props, forwardedRef) => {
166166
167167
### Using a getter, (note the addition of `getViewRef`)
168168
169-
```jsx
169+
```tsx
170170
class MyComponent extends React.Component<Props> {
171171
_ref: ?React.ElementRef<typeof MyJSComponent>;
172172

@@ -180,7 +180,7 @@ class MyComponent extends React.Component<Props> {
180180

181181
_onSubmit: () => {
182182
if (this._ref != null)
183-
this._ref.**getViewRef****()**.measure(() => {});
183+
this._ref.getViewRef().measure(() => {});
184184
}
185185
}
186186
}
@@ -206,7 +206,7 @@ class MyJSComponent extends React.Component<Props> {
206206
}
207207
```
208208
209-
### Migrating `.measure(`
209+
### Migrating `.measure*()`
210210

211211
Let’s take a look at an example calling `UIManager.measure`. This code might look something like this
212212

@@ -249,7 +249,7 @@ setNativeProps will not be supported in the post-Fabric world. To migrate, move
249249

250250
**Example**
251251

252-
```jsx
252+
```tsx
253253
class MyComponent extends React.Component<Props> {
254254
_viewRef: ?React.ElementRef<typeof View>;
255255
@@ -267,10 +267,10 @@ class MyComponent extends React.Component<Props> {
267267
}
268268
269269
_onSubmit: () => {
270-
this._viewRef.**setNativeProps****(**{
270+
this._viewRef.setNativeProps({
271271
style: styles.submittedView,
272272
accessibility: true
273-
**});**
273+
});
274274
// ...other logic for onSubmit
275275
}
276276
}
@@ -310,7 +310,7 @@ The fact that React Native stores some internal state of each component that isn
310310

311311
Taking those caveats into account, a proper migration would look like this:
312312

313-
```javascript
313+
```tsx
314314
class MyComponent extends React.Component<Props> {
315315
state = {
316316
hasSubmitted: false,
@@ -328,7 +328,7 @@ class MyComponent extends React.Component<Props> {
328328
}
329329

330330
_onSubmit: () => {
331-
this.setState(state => ({...state, hasSubmitted: true}));
331+
this.setState(state => ({ ...state, hasSubmitted: true }));
332332
// ...other logic for onSubmit
333333
}
334334
}

‎docs/new-architecture-playbook.md

Whitespace-only changes.

0 commit comments

Comments
 (0)