react-native-datetimepicker / datetimepicker

React Native date & time picker component for iOS, Android and Windows

MIT License

2.36k stars 385 forks source link

[Fabric] Fix Fabric component & TM specs for new architecture #877

Closed shwanton closed 1 month ago

shwanton commented 1 month ago

Summary

We use this library internally at Meta and have run into some build issues when upgrading & using it with the new architecture.

The Fabric component spec is required to have "NativeComponent" as a suffix, not prefix.

The file must be named NativeComponent, with a .js or .jsx extension when using Flow, or a .ts, or .tsx extension when using TypeScript. Codegen only looks for files matching this pattern.

fabric-native-components.md

Fabric component spec shouldn't create a ComponentDescriptor since one is added manually.

https://github.com/react-native-datetimepicker/datetimepicker/blob/master/ios/fabric/cpp/react/renderer/components/RNDateTimePicker/ComponentDescriptors.h

TM Codegen was including a typedef from a separate file, which is not supported.
Android Codegen does not support typed parameters to codegen'd methods.
"RCTFabricComponentsPlugins.h" is used internally and needs to be scoped to <React/RCTFabricComponentsPlugins.h>

Test Plan

Fabric - iOS

https://github.com/react-native-datetimepicker/datetimepicker/assets/96719/d0d0a975-aaf0-4ac3-9316-31e1be52e2db

Paper - iOS

https://github.com/react-native-datetimepicker/datetimepicker/assets/96719/2bd251dc-356c-438a-9b24-6d1ef706841f

What's required for testing (prerequisites)?

What are the steps to reproduce (after prerequisites)?

Build w/ new arch enabled: RCT_NEW_ARCH_ENABLED=1 pod install

Compatibility

OS	Implemented
iOS	✅
Android	✅

Checklist

[x] I have tested this on a device and a simulator
[ ] I added the documentation in README.md
[ ] I updated the typed files (TS and Flow)
[ ] I added a sample use of the API in the example project (example/App.js)
[ ] I have added automated tests, either in JS or e2e tests, as applicable

arushikesarwani94 commented 1 month ago

New Arch Disabled - Android

https://github.com/react-native-datetimepicker/datetimepicker/assets/76862293/b6eb02d9-fd3f-461a-88de-b4e81a29f57b

New Arch Enabled[Fabric + TurboModule] - Android

https://github.com/react-native-datetimepicker/datetimepicker/assets/76862293/c865e47e-02dd-4156-972c-fa5e0a880165

vonovak commented 1 month ago

:tada: This issue has been resolved in version 7.6.4 :tada:

If this package helps you, consider sponsoring us! :rocket: