From 62d04c6578a3c8cd97ae790836ab94e29c7c2815 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Burak=20Gu=CC=88ner?= <burak.guner@callstack.com> Date: Tue, 21 Mar 2023 18:10:19 +0300 Subject: [PATCH 1/4] feat(legacy view template): extract view to a separate file --- .../native-view-legacy/src/index.tsx | 28 ++----------------- .../{%- project.name %}ViewNativeComponent.ts | 25 +++++++++++++++++ 2 files changed, 27 insertions(+), 26 deletions(-) create mode 100644 packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts diff --git a/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx b/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx index 74ff7a780..7a2bfbdc2 100644 --- a/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx +++ b/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx @@ -1,26 +1,2 @@ -import { - requireNativeComponent, - UIManager, - Platform, - ViewStyle, -} from 'react-native'; - -const LINKING_ERROR = - `The package '<%- project.slug -%>' doesn't seem to be linked. Make sure: \n\n` + - Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) + - '- You rebuilt the app after installing the package\n' + - '- You are not using Expo Go\n'; - -type <%- project.name -%>Props = { - color: string; - style: ViewStyle; -}; - -const ComponentName = '<%- project.name -%>View'; - -export const <%- project.name -%>View = - UIManager.getViewManagerConfig(ComponentName) != null - ? requireNativeComponent<<%- project.name -%>Props>(ComponentName) - : () => { - throw new Error(LINKING_ERROR); - }; +export { default as <%- project.name -%>View } from './<%- project.name -%>ViewNativeComponent'; +export * from './<%- project.name -%>ViewNativeComponent'; diff --git a/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts new file mode 100644 index 000000000..6d56802b5 --- /dev/null +++ b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts @@ -0,0 +1,25 @@ +import { + requireNativeComponent, + UIManager, + Platform, + ViewStyle, +} from 'react-native'; + +const LINKING_ERROR = + `The package '<%- project.slug -%>' doesn't seem to be linked. Make sure: \n\n` + + Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) + + '- You rebuilt the app after installing the package\n' + + '- You are not using Expo Go\n'; + +type <%- project.name -%>Props = { + color: string; + style: ViewStyle; +}; + +const ComponentName = '<%- project.name -%>View'; + +export default UIManager.getViewManagerConfig(ComponentName) != null + ? requireNativeComponent<<%- project.name -%>Props>(ComponentName) + : () => { + throw new Error(LINKING_ERROR); + }; From 485c23a07d94bec792de0b5646798c747951c2f8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Burak=20Gu=CC=88ner?= <burak.guner@callstack.com> Date: Fri, 27 Oct 2023 21:14:00 +0300 Subject: [PATCH 2/4] refactor: dont export as default and rename to view --- .../templates/native-view-legacy/src/index.tsx | 3 +-- ...ame %}ViewNativeComponent.ts => {%- project.name %}View.ts} | 2 +- 2 files changed, 2 insertions(+), 3 deletions(-) rename packages/create-react-native-library/templates/native-view-legacy/src/{{%- project.name %}ViewNativeComponent.ts => {%- project.name %}View.ts} (90%) diff --git a/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx b/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx index 7a2bfbdc2..2a1507921 100644 --- a/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx +++ b/packages/create-react-native-library/templates/native-view-legacy/src/index.tsx @@ -1,2 +1 @@ -export { default as <%- project.name -%>View } from './<%- project.name -%>ViewNativeComponent'; -export * from './<%- project.name -%>ViewNativeComponent'; +export * from './<%- project.name -%>View'; diff --git a/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts similarity index 90% rename from packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts rename to packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts index 6d56802b5..4dde7db4e 100644 --- a/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}ViewNativeComponent.ts +++ b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts @@ -18,7 +18,7 @@ type <%- project.name -%>Props = { const ComponentName = '<%- project.name -%>View'; -export default UIManager.getViewManagerConfig(ComponentName) != null +export UIManager.getViewManagerConfig(ComponentName) != null ? requireNativeComponent<<%- project.name -%>Props>(ComponentName) : () => { throw new Error(LINKING_ERROR); From a3d8ea0bdf4697f4c77e0ee133d813bfd74d6b12 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Burak=20Gu=CC=88ner?= <burak.guner@callstack.com> Date: Fri, 27 Oct 2023 21:21:07 +0300 Subject: [PATCH 3/4] feat: extract Native legacy module as well --- .../src/Native{%- project.name %}.ts | 22 +++++++++++++++++++ .../native-library-legacy/src/index.tsx | 22 +------------------ 2 files changed, 23 insertions(+), 21 deletions(-) create mode 100644 packages/create-react-native-library/templates/native-library-legacy/src/Native{%- project.name %}.ts diff --git a/packages/create-react-native-library/templates/native-library-legacy/src/Native{%- project.name %}.ts b/packages/create-react-native-library/templates/native-library-legacy/src/Native{%- project.name %}.ts new file mode 100644 index 000000000..651971c33 --- /dev/null +++ b/packages/create-react-native-library/templates/native-library-legacy/src/Native{%- project.name %}.ts @@ -0,0 +1,22 @@ +import { NativeModules, Platform } from 'react-native'; + +const LINKING_ERROR = + `The package '<%- project.slug -%>' doesn't seem to be linked. Make sure: \n\n` + + Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) + + '- You rebuilt the app after installing the package\n' + + '- You are not using Expo Go\n'; + +const <%- project.name -%> = NativeModules.<%- project.name %> + ? NativeModules.<%- project.name %> + : new Proxy( + {}, + { + get() { + throw new Error(LINKING_ERROR); + }, + } + ); + +export function multiply(a: number, b: number): Promise<number> { + return <%- project.name -%>.multiply(a, b); +} diff --git a/packages/create-react-native-library/templates/native-library-legacy/src/index.tsx b/packages/create-react-native-library/templates/native-library-legacy/src/index.tsx index 651971c33..da37908fe 100644 --- a/packages/create-react-native-library/templates/native-library-legacy/src/index.tsx +++ b/packages/create-react-native-library/templates/native-library-legacy/src/index.tsx @@ -1,22 +1,2 @@ -import { NativeModules, Platform } from 'react-native'; +export * from './Native<%- project.name -%>'; -const LINKING_ERROR = - `The package '<%- project.slug -%>' doesn't seem to be linked. Make sure: \n\n` + - Platform.select({ ios: "- You have run 'pod install'\n", default: '' }) + - '- You rebuilt the app after installing the package\n' + - '- You are not using Expo Go\n'; - -const <%- project.name -%> = NativeModules.<%- project.name %> - ? NativeModules.<%- project.name %> - : new Proxy( - {}, - { - get() { - throw new Error(LINKING_ERROR); - }, - } - ); - -export function multiply(a: number, b: number): Promise<number> { - return <%- project.name -%>.multiply(a, b); -} From 8656a9b09f524d4e89e4f4f5c1cd8efb7b63e22b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Burak=20Gu=CC=88ner?= <burak.guner@callstack.com> Date: Fri, 27 Oct 2023 21:22:44 +0300 Subject: [PATCH 4/4] fix: export -> export const --- .../templates/native-view-legacy/src/{%- project.name %}View.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts index 4dde7db4e..ffeb5a901 100644 --- a/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts +++ b/packages/create-react-native-library/templates/native-view-legacy/src/{%- project.name %}View.ts @@ -18,7 +18,7 @@ type <%- project.name -%>Props = { const ComponentName = '<%- project.name -%>View'; -export UIManager.getViewManagerConfig(ComponentName) != null +export const <%- project.name -%>View = UIManager.getViewManagerConfig(ComponentName) != null ? requireNativeComponent<<%- project.name -%>Props>(ComponentName) : () => { throw new Error(LINKING_ERROR);