Skip to content

Add Fabric support #410

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Aug 8, 2022
Merged

Add Fabric support #410

merged 2 commits into from
Aug 8, 2022

Conversation

okwasniewski
Copy link
Member

Summary:

Introduce Fabric support for iOS and Android. #380

iOS Changes:

  • Setup codegen spec in flow
  • Move requireNativeComponent to separate file
  • Update podspec file
  • Add codegenConfig in package.json
  • Ensure backwards compatibility
  • iOS Implementation

Android Changes:

  • Configure gradle files
  • Implement / extend the generated native interfaces
  • Ensure backwards compatibility by splitting implementations into two folders.

Related PRs:

Test Plan:

Currently updating example app to RN 0.70 is blocked, tracked here: #408

Test plan for RN <0.70:

Android
  1. Set newArchEnabled to true inside example/android/gradle.properties
  2. Add this line in example/android/app/src/main/jni/Android.mk file.
+ include $(NODE_MODULES_DIR)/@react-native-community/slider/android/build/generated/source/codegen/jni/Android.mk
include $(CLEAR_VARS)

In the same file above, go to the LOCAL_SHARED_LIBRARIES setting and add the following line:

    libreact_codegen_rncore \
+   libreact_codegen_ReactSlider \
    libreact_debug \
  1. Update example/android/app/src/main/jni/MainComponentsRegistry.cpp
#include <react/renderer/components/rncore/ComponentDescriptors.h>
+ #include <react/renderer/components/ReactSlider/ComponentDescriptors.h>

...

MainComponentsRegistry::sharedProviderRegistry() {
  auto providerRegistry = CoreComponentsRegistry::sharedProviderRegistry();

  // Custom Fabric Components go here. You can register custom
  // components coming from your App or from 3rd party libraries here.
  //
  // providerRegistry->add(concreteComponentDescriptorProvider<
  //        AocViewerComponentDescriptor>());
+ providerRegistry->add(concreteComponentDescriptorProvider<RNCSliderComponentDescriptor>());

  return providerRegistry;
}

Then, to launch the project run:

npm run install && npm run example-android
iOS

Install pods using a flag

RCT_NEW_ARCH_ENABLED=1 pod install

Run the app

npm run example-ios

okwasniewski and others added 2 commits August 2, 2022 20:10
* Update podspec file for fabric

* Define codegen spec & move import to separate file

* Add codegenConfig in package.json

* Update podspec to detect .mm files

* Change spec types to floats

* Implement fabric component with props updating

* Re-order functions, add accessibilityIncrements prop

* Clean up imports, remove comment

* Sort out props updating, remove unused functions

* Add event handling

* Add tapToSeek implementation

* Fix tapToSeek

* Handle images using bridge

* Add missing typedef

* Verify the build for new arch with GH Actions

* Save new-arch Pods under new-arch cache key

* Use Podfile.lock with old arch and regenerate for new one

* Correct path for new arch Podfile.lock creation

* Disable flipper in Podfile

* Install pods with new arch flag

* Fix tapToSeek on iOS

* Allow value property to be controlled

* Generate project.pbxproj for new arch

* Separate npm & pods step in CI

* Change step names, fix cache keys

* Remove pods cache

* Run npm install if cache was not found

* Run build using xcodebuild

* Fix: Pods-related error after using Pods from cache (#407)

* Bring back Pods to cache

* Use new-arch string in key for new arch cache

* Try to reinstall pods instead of creating new

* Separate deps installation between two caches

* Rename Pods reinstall step

* Remove explicit folly version, default to old arch

* Add clean scripts in example for codegen cleanup

* Change CI step names

* Remove isFabricEnabled

This check is no longer needed.

Co-authored-by: BartoszKlonowski <Bartosz.Klonowski@callstack.com>
* Configure build.gradle

* Update libraryName on android

* Create ReactSlider shared implementation

* Split implementations into oldarch and newarch

* Dispatch events

* Cleanup eventDispatcher

* Make oldarch implementation use shared code

* Add defaults to js spec

* Clean up newarch ReactSliderManager

* Reorder props to fix disabled state

* Handle TestID setter

* Move ReactSliderShadowNode to shared implementation

* Share getExportedCustomDirectEventTypeConstants

* Remove comments, add empty line
Copy link
Member

@thymikee thymikee left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

:shipit:

Copy link
Collaborator

@michalchudziak michalchudziak left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good job!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants