@momo-kits/foundation 0.102.7-beta.0 → 0.102.7-optimize.0

package/Application/Localize.ts

@@ -0,0 +1,37 @@
+import {NativeModules} from 'react-native';
+import {LocalizationObject} from './types';
+import defaultLanguage from '../Assets/language.json';
+
+class Localize {
+  private assets: LocalizationObject;
+  private currentLanguage: 'en' | 'vi';
+
+  constructor(assets: LocalizationObject) {
+    this.assets = {
+      vi: {...assets?.vi, ...defaultLanguage.vi},
+      en: {...assets?.en, ...defaultLanguage.en},
+    };
+    this.currentLanguage = 'vi';
+    if (NativeModules?.RNResource?.language === 'en') {
+      this.currentLanguage = 'en';
+    }
+  }
+
+  translate(key: string) {
+    return this.assets[this.currentLanguage]?.[key] || key;
+  }
+
+  translateData(data: {vi: string; en: string}) {
+    return data[this.currentLanguage] || data.vi || JSON.stringify(data);
+  }
+
+  addTranslations(translations: LocalizationObject) {
+    this.assets = translations;
+  }
+
+  setLanguage(language: 'en' | 'vi') {
+    this.currentLanguage = language;
+  }
+}
+
+export default Localize;

package/Application/NavigationContainer.tsx

@@ -10,9 +10,9 @@ import StackScreen from './StackScreen';
 import ModalScreen from './ModalScreen';
 import Navigator from './Navigator';
 import {getDialogOptions, getModalOptions, getStackOptions} from './utils';
-import {LocalizationObject, NavigationContainerProps} from './types';
+import {NavigationContainerProps} from './types';
 import {ApplicationContext} from './index';
-import kitLocalization from '../Assets/language.json';
+import Localize from './Localize';
 
 const Stack = createStackNavigator();
 
@@ -21,15 +21,18 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
   theme,
   options,
   maxApi,
-  localization,
   initialParams,
+  localize = new Localize({vi: {}, en: {}}),
 }) => {
   const navigationRef = useRef<NavigationContainerRef>(null);
   const isReady = useRef(false);
   const navigator = useRef(new Navigator(navigationRef, isReady));
   const [showGrid, setShowGrid] = useState(false);
   const config = useRef<any>();
-
+  /**
+   * inject data for navigator
+   */
+  navigator.current.maxApi = maxApi;
   /**
    * handle mini language & listen change
    * engine only shake to enable grid view
@@ -39,7 +42,7 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
       'onChangeGrid',
       enable => {
         setShowGrid(!!enable);
-      },
+      }
     );
 
     return () => {
@@ -47,22 +50,8 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
     };
   }, []);
 
-  /**
-   * inject data for navigator
-   */
-  navigator.current.maxApi = maxApi;
-
-  /**
-   * translate
-   * @param key
-   */
   const translate = (key: string) => {
-    const language: 'vi' | 'en' = 'vi';
-    const mergedLocalization: LocalizationObject = {
-      vi: {...localization?.vi, ...kitLocalization.vi},
-      en: {...localization?.en, ...kitLocalization.en},
-    };
-    return mergedLocalization?.[language]?.[key] || key;
+    return localize?.translate(key);
   };
 
   return (
@@ -87,7 +76,7 @@ const NavigationContainer: React.FC<NavigationContainerProps> = ({
               notification: theme.colors.error.primary,
             },
           }}
-          ref={navigator.current?.ref}
+          ref={navigationRef}
           onReady={() => {
             isReady.current = true;
           }}

package/Application/Navigator.ts

@@ -25,7 +25,7 @@ class Navigator {
    */
   push = (params: ScreenParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.push('Stack', params));
+      this.ref.current?.dispatch?.(StackActions.push('Stack', params));
     }
   };
 
@@ -35,7 +35,7 @@ class Navigator {
    */
   replace = (params: ScreenParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.replace('Stack', params));
+      this.ref.current?.dispatch?.(StackActions.replace('Stack', params));
     }
   };
   /**
@@ -44,7 +44,7 @@ class Navigator {
    */
   pop = (count?: number) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.pop(count ?? 1));
+      this.ref.current?.dispatch?.(StackActions.pop(count ?? 1));
     }
   };
 
@@ -54,7 +54,7 @@ class Navigator {
    */
   present = (params: ScreenParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.push('Dialog', params));
+      this.ref.current?.dispatch?.(StackActions.push('Dialog', params));
     }
   };
 
@@ -64,7 +64,7 @@ class Navigator {
    */
   showModal = (params: ModalParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.push('Modal', params));
+      this.ref.current?.dispatch?.(StackActions.push('Modal', params));
     }
   };
 
@@ -74,7 +74,7 @@ class Navigator {
    */
   showBottomSheet = (params: BottomSheetParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(
+      this.ref.current?.dispatch?.(
         StackActions.push('Modal', {
           ...params,
           isBottomSheet: true,
@@ -88,7 +88,7 @@ class Navigator {
    */
   popToTop = () => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(StackActions.popToTop());
+      this.ref.current?.dispatch?.(StackActions.popToTop());
     }
   };
 
@@ -99,7 +99,7 @@ class Navigator {
    */
   navigate = (name: string, params: any) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(
+      this.ref.current?.dispatch?.(
         CommonActions.navigate({
           name,
           params,
@@ -114,7 +114,7 @@ class Navigator {
    */
   reset = (params: ScreenParams) => {
     if (this.isReady.current) {
-      this.ref.current.dispatch(
+      this.ref.current?.dispatch?.(
         CommonActions.reset({
           index: 0,
           routes: [

package/Application/index.ts

@@ -1,5 +1,7 @@
 import {Platform} from 'react-native';
+import {createContext} from 'react';
 import {NavigationContainer} from './NavigationContainer';
+import Localize from './Localize';
 import Screen from '../Layout/Screen';
 import {
   HeaderAnimated,
@@ -10,7 +12,6 @@ import {
   HeaderRightAction,
 } from './Components';
 import BottomTab from './BottomTab';
-import {createContext} from 'react';
 import {defaultContext} from '../Consts';
 
 const Context = createContext({});
@@ -26,6 +27,7 @@ export {
   ScreenContext,
   ComponentContext,
   NavigationContainer,
+  Localize,
   Screen,
   BottomTab,
   NavigationButton,

package/Application/types.ts

@@ -1,8 +1,9 @@
-import {StackNavigationOptions} from '@react-navigation/stack';
 import {EventArg} from '@react-navigation/core';
+import {StackNavigationOptions} from '@react-navigation/stack';
 import React from 'react';
 import {Animated, ViewProps} from 'react-native';
 import {PopupNotifyProps} from '../Popup/types';
+import Localize from './Localize';
 import Navigation from './Navigation';
 import Navigator from './Navigator';
 
@@ -85,8 +86,8 @@ export type NavigationContainerProps = {
   options?: NavigationOptions;
   theme: Theme;
   maxApi: any;
-  localization?: LocalizationObject;
   initialParams?: any;
+  localize: Localize;
 };
 
 export type NavigationScreenProps = {

package/Input/styles.ts

@@ -32,10 +32,9 @@ export default StyleSheet.create({
     alignItems: 'center',
   },
   floatingIcon: {marginLeft: Spacing.XS},
-  errorIcon: {marginRight: Spacing.XS},
+  errorIcon: {marginRight: Spacing.XS, marginTop: Spacing.XXS},
   errorView: {
     flexDirection: 'row',
-    alignItems: 'center',
     marginTop: Spacing.XS,
   },
   inputView: {

package/index.ts

@@ -49,7 +49,6 @@ export * from './Title';
 export * from './Title/types';
 export * from './Badge';
 export * from './Badge/types';
-export * from './Rating';
 
 /**
  * export trick for keep old mini app working

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/foundation",
-    "version": "0.102.7-beta.0",
+    "version": "0.102.7-optimize.0",
     "description": "React Native Component Kits",
     "main": "index.ts",
     "scripts": {},

package/publish.sh

@@ -9,8 +9,8 @@ elif [ "$1" == "latest" ]; then
   npm version prerelease --preid=rc
   npm publish --tag latest --access=public
 else
-  npm version $(npm view @momo-kits/foundation@beta version)
-  npm version prerelease --preid=beta
+#  npm version $(npm view @momo-kits/foundation@beta version)
+#  npm version prerelease --preid=beta
   npm publish --tag beta --access=public
 fi