nx-react-native-cli 2.7.1 → 3.0.1

package/templates/shared/apps/mobile/src/stores/user.slice.ts

@@ -9,14 +9,18 @@ export type User = {
 };
 
 export type UserSlice = {
+  pushNotificationsEnabled: boolean;
   setUser: (user: User | null) => void;
+  setPushNotificationsEnabled: (value: boolean) => void;
   signOut: () => void;
   user: User | null;
   clear: () => void;
 };
 
 export const createUserSlice: StateCreator<UserSlice> = (set) => ({
-  clear: () => set({ user: null }),
+  clear: () => set({ pushNotificationsEnabled: true, user: null }),
+  pushNotificationsEnabled: true,
+  setPushNotificationsEnabled: (value: boolean) => set({ pushNotificationsEnabled: value }),
   setUser: (user: User | null) => set({ user }),
   signOut: () => set({ user: null }),
   user: null,

package/templates/shared/apps/mobile/src/tailwind/index.ts

@@ -60,13 +60,13 @@ export const errorContainerStyle = (err: boolean) => err && tw`border-red-600`;
 
 export const disabledInputStyle = (isDisabled: boolean) => isDisabled && tw`opacity-50`;
 
-export const focusedInputStyle = (isFocused: boolean) => isFocused && tw``;
+export const focusedInputStyle = (isFocused: boolean) => isFocused && tw`border-primary-400`;
 
 export const errorTextStyle = (err: boolean) => err && tw`text-red-600`;
 
-export const defaultInputContainerStyle = tw`ios:px-4 ios:py-3.5 android:py-1 android:px-3 android:min-h-[50px] flex-row rounded-xl border border-[#3a4556] bg-[#2a3544]`;
+export const defaultInputContainerStyle = tw`ios:px-4 ios:py-3.5 android:py-1 android:px-3 android:min-h-[50px] flex-row rounded-xl border border-gray-300 bg-white`;
 export const defaultInputTextStyle = [
-  tw`flex-1 font-normal text-[#f8f9fa]`,
+  tw`flex-1 font-normal text-gray-900`,
   CONFIG.IS_ANDROID ? { textAlignVertical: 'center' } : null,
 ];
 

package/templates/shared/apps/mobile/tailwind.config.js

@@ -39,6 +39,20 @@ module.exports = {
         2: '2 2 0%',
       },
       colors: {
+        white: '#ffffff',
+        background: '#0f1419',
+        disabled: '#6b7280',
+        divider: '#3a4556',
+        error: '#ef4444',
+        foreground: '#f8f9fa',
+        muted: '#e1e4e8',
+        overlay: '#1e2d3d',
+        placeholder: '#8b92a0',
+        sheet: '#1a2332',
+        subtitle: '#8b92a0',
+        success: '#22c55e',
+        surface: '#2a3544',
+        underlay: '#131a26',
         // https://uicolors.app/create
         gray: {
           50: '#f7f8f8',

package/templates/shared/patches/react-native-animatable+1.4.0.patch

@@ -0,0 +1,71 @@
+diff --git a/node_modules/react-native-animatable/createAnimatableComponent.js b/node_modules/react-native-animatable/createAnimatableComponent.js
+index 7be96ea..e8fd51a 100644
+--- a/node_modules/react-native-animatable/createAnimatableComponent.js
++++ b/node_modules/react-native-animatable/createAnimatableComponent.js
+@@ -31,6 +31,9 @@ const INTERPOLATION_STYLE_PROPERTIES = [
+   'textDecorationColor',
+   // Image styles
+   'tintColor',
++  // 'width', 'height'
++  'width',
++  'height'
+ ];
+ 
+ const ZERO_CLAMPED_STYLE_PROPERTIES = ['width', 'height'];
+@@ -241,10 +244,7 @@ export default function createAnimatableComponent(WrappedComponent) {
+       );
+       Object.keys(currentTransitionValues).forEach((key) => {
+         const value = currentTransitionValues[key];
+-        if (
+-          INTERPOLATION_STYLE_PROPERTIES.indexOf(key) !== -1 ||
+-          typeof value !== 'number'
+-        ) {
++        if (INTERPOLATION_STYLE_PROPERTIES.indexOf(key) !== -1) {
+           transitionValues[key] = new Animated.Value(0);
+           styleValues[key] = value;
+         } else {
+@@ -454,30 +454,18 @@ export default function createAnimatableComponent(WrappedComponent) {
+         if (!transitionValue) {
+           transitionValue = new Animated.Value(0);
+         }
+-        const needsInterpolation =
+-          INTERPOLATION_STYLE_PROPERTIES.indexOf(property) !== -1 ||
+-          typeof value !== 'number';
+-        const needsZeroClamping =
+-          ZERO_CLAMPED_STYLE_PROPERTIES.indexOf(property) !== -1;
++        const needsInterpolation = INTERPOLATION_STYLE_PROPERTIES.indexOf(property) !== -1;
++        const needsZeroClamping = ZERO_CLAMPED_STYLE_PROPERTIES.indexOf(property) !== -1;
+         if (needsInterpolation) {
+           transitionValue.setValue(0);
+           transitionStyle[property] = transitionValue.interpolate({
+             inputRange: [0, 1],
+             outputRange: [fromValue, toValue],
++            extrapolateLeft: needsZeroClamping ? 'clamp' : 'extend'
+           });
+           currentTransitionValues[property] = toValue;
+           toValuesFlat[property] = 1;
+         } else {
+-          if (needsZeroClamping) {
+-            transitionStyle[property] = transitionValue.interpolate({
+-              inputRange: [0, 1],
+-              outputRange: [0, 1],
+-              extrapolateLeft: 'clamp',
+-            });
+-            currentTransitionValues[property] = toValue;
+-          } else {
+-            transitionStyle[property] = transitionValue;
+-          }
+           transitionValue.setValue(fromValue);
+         }
+       });
+@@ -504,9 +492,7 @@ export default function createAnimatableComponent(WrappedComponent) {
+ 
+       Object.keys(toValuesFlat).forEach((property) => {
+         const toValue = toValuesFlat[property];
+-        const needsInterpolation =
+-          INTERPOLATION_STYLE_PROPERTIES.indexOf(property) !== -1 ||
+-          typeof value !== 'number';
++        const needsInterpolation = INTERPOLATION_STYLE_PROPERTIES.indexOf(property) !== -1;
+         const needsZeroClamping =
+           ZERO_CLAMPED_STYLE_PROPERTIES.indexOf(property) !== -1;
+         const transitionStyle = this.state.transitionStyle[property];