PoC: use raw jsi::Value prop w/ fabric views#386
Conversation
Includes changes from: facebook/react-native#48047
0.76.2 fixed this error: facebook/react-native#46208
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| "lint-ci": "eslint \"**/*.{js,ts,tsx}\" -f @jamesacarr/github-actions", | ||
| "bundle-install": "bundle install", | ||
| "pods": "cd ios && bundle exec pod install && rm -rf .xcode.env.local", | ||
| "pods": "cd ios && bundle exec pod install", |
There was a problem hiding this comment.
btw: without this change i can't run the example app. I am pretty sure that deleting the .xcode.env.local is wrong.
Will remove this change in a moment though
|
Okay, i am still missing one piece, seems like the props parser currently removes our prop:
fixing … |
convert to kotlin still missing
prop updates are broken yet
Moved code to set props to state to adopt() as thats always called for creation & updates
…c/views-with-nativestate-props
|
@mrousavy android is good as well now. In the same phase in which the new props are updated we get the update on the java side, so I think there is no weird back and forth. We have to use the state wrapper on android as this is the only thing thats shared between c++ and java for the view manager (props are always eagerly converted to folly::dynamic). |
|
Updated 👍 |
jsi::Value prop w/ fabric viewsjsi::Value prop w/ fabric views
| } | ||
|
|
||
| export const CustomView: HostComponent<NativeProps> = | ||
| NativeComponentRegistry.get<NativeProps>('CustomView', () => viewConfig) |
There was a problem hiding this comment.
it might, we'd have to test this
| // There is some code path in RawPropsParser.cpp where we expect to collect all possible keys (prop names) upfront | ||
| // during the init phase. Calling this .at() method while the rawProps is empty, will cause this prop value to be indexed … | ||
| // Otherwise we'd get a crash when trying to access it later. | ||
| // We should really also try to merge the PR i have for providing alternative RawProps parser !! | ||
| rawProps.at("nativeProp", nullptr, nullptr); |
There was a problem hiding this comment.
Not sure if I fully understand - is this still needed? Do I need to do this for every prop?
There was a problem hiding this comment.
I think just calling rawProps.at() and check if it is null or not should be enough. It should never be null, except for when the internally the ui manager creates those once without the values from JS (thats when 'isEmpty() will return true)
There was a problem hiding this comment.
but yeah, it has to be called at this point once, as the .at() method will insert the props key into a map. If later on the prop name is not in this key map it will always return null. Super weird I know.
my main idea is that we are able to write our own prop parser to work around this
| # From node_modules/react-native/ReactAndroid/cmake-utils/folly-flags.cmake | ||
| # Used in node_modules/react-native/ReactAndroid/cmake-utils/ReactNative-application.cmake | ||
| target_compile_definitions( | ||
| NitroImage | ||
| PRIVATE | ||
| -DFOLLY_NO_CONFIG=1 | ||
| -DFOLLY_HAVE_CLOCK_GETTIME=1 | ||
| -DFOLLY_USE_LIBCPP=1 | ||
| -DFOLLY_CFG_NO_COROUTINES=1 | ||
| -DFOLLY_MOBILE=1 | ||
| -DFOLLY_HAVE_RECVMMSG=1 | ||
| -DFOLLY_HAVE_PTHREAD=1 | ||
| # Once we target android-23 above, we can comment | ||
| # the following line. NDK uses GNU style stderror_r() after API 23. | ||
| -DFOLLY_HAVE_XSI_STRERROR_R=1 | ||
| ) |
| class ComponentShadowNode : public ConcreteViewShadowNode<CustomViewComponentName, CustomViewProps, | ||
| ViewEventEmitter, // default one | ||
| CustomStateData> { | ||
|
|
||
| public: | ||
| ComponentShadowNode(const ShadowNodeFragment& fragment, const ShadowNodeFamily::Shared& family, ShadowNodeTraits traits) | ||
| : ConcreteViewShadowNode(fragment, family, traits) {} | ||
|
|
||
| ComponentShadowNode(const ShadowNode& sourceShadowNode, const ShadowNodeFragment& fragment) | ||
| : ConcreteViewShadowNode(sourceShadowNode, fragment) {} | ||
| }; |
There was a problem hiding this comment.
Do I need this for android, or will the iOS code from above (using ... = ...) work instead of subclassing it here?
|
Now implemented in #512 🫡 |
How to setup:
(I had to update to RN >= 0.76.2 to fix a build issue where some yoga header could not be found)
git clean -dfXbun inpx patch-packagebun run buildPRs in react-native to get it work:
RawPropsParseradduseRawPropsJsiValueparameter facebook/react-native#48231RawPropsParseras optional parameter to Concrete-/ComponentDescriptor facebook/react-native#48232RawValuedirectly fromjsi::Valuefacebook/react-native#48047getStateforStateWrapperImplfacebook/react-native#48255