@momo-kits/foundation 0.103.1-beta.1 → 0.103.1-beta.2

package/Application/Components.tsx

@@ -26,6 +26,7 @@ import {
   HeaderBackgroundProps,
   HeaderBackProps,
   NavigationButtonProps,
+  RouteParams,
   TitleCustomProps,
 } from './types';
 import {scaleSize, Text} from '../Text';
@@ -153,7 +154,9 @@ const HeaderLeft: React.FC<HeaderBackProps> = ({
       const params = {
         appId: context.appId,
         code: context.code,
-        screen_name: currentRoute?.params?.screen?.name ?? currentRoute?.name,
+        screen_name:
+          (currentRoute?.params as RouteParams)?.screen?.name ??
+          currentRoute?.name,
         trigger_id: '111154000000000000',
         icon_name: 'back',
       };

package/Application/Navigator.ts

@@ -1,95 +1,170 @@
-import {CommonActions, StackActions} from '@react-navigation/native';
+import {
+  CommonActions,
+  NavigationContainerRef,
+  StackActions,
+} from '@react-navigation/native';
 import {
   BottomSheetParams,
   HeaderToolkitProps,
   ModalParams,
+  NavigatorCallbackParamsType,
   ScreenParams,
 } from './types';
+import React from 'react';
+import {
+  NavigationActionCallbackErrorEnum,
+  NavigationActionCallbackStatusEnum,
+} from './constants';
 
 class Navigator {
-  ref?: any;
-  isReady?: any;
+  ref: React.RefObject<NavigationContainerRef>;
+  isReady: React.MutableRefObject<boolean>;
   toolkitConfig?: HeaderToolkitProps;
   maxApi?: any;
-  dismissData?: any;
+  dismissData?: unknown;
   toolkitCallback?: (key: string) => void;
 
-  constructor(navigation: any, isReady: any) {
+  constructor(
+    navigation: React.RefObject<NavigationContainerRef>,
+    isReady: React.MutableRefObject<boolean>
+  ) {
     this.ref = navigation;
     this.isReady = isReady;
   }
 
+  private validateRefAndRunAction = (params: {
+    action: (navigationRef: NavigationContainerRef) => void;
+    callback?: (params: NavigatorCallbackParamsType) => void;
+  }) => {
+    try {
+      if (this.isReady.current && this.ref.current) {
+        params.action(this.ref.current);
+        params.callback?.({status: NavigationActionCallbackStatusEnum.Success});
+      } else {
+        params.callback?.({
+          status: NavigationActionCallbackStatusEnum.Failed,
+          type: NavigationActionCallbackErrorEnum.NotReady,
+        });
+      }
+    } catch (error) {
+      params.callback?.({
+        status: NavigationActionCallbackStatusEnum.Failed,
+        type: NavigationActionCallbackErrorEnum.Error,
+      });
+    }
+  };
+
   /**
    * push new stack screen
    * @param params
    */
-  push = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.push('Stack', params));
-    }
+  push = (
+    params: ScreenParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.push('Stack', params));
+      },
+      callback,
+    });
   };
 
   /**
    * replace current screen with new screen
    * @param params
    */
-  replace = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.replace('Stack', params));
-    }
+  replace = (
+    params: ScreenParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.replace('Stack', params));
+      },
+      callback,
+    });
   };
   /**
    * pop to dismiss a screen
    * @param count
    */
-  pop = (count?: number) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.pop(count ?? 1));
-    }
+  pop = (
+    count?: number,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.pop(count ?? 1));
+      },
+      callback,
+    });
   };
 
   /**
    * present a new screen, show from bottom iOS
    * @param params
    */
-  present = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.push('Dialog', params));
-    }
+  present = (
+    params: ScreenParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.push('Dialog', params));
+      },
+      callback,
+    });
   };
 
   /**
    * show a modal popup
    * @param params
    */
-  showModal = (params: ModalParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.push('Modal', params));
-    }
+  showModal = (
+    params: ModalParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.push('Modal', params));
+      },
+      callback,
+    });
   };
 
   /**
    * show a bottom sheet
    * @param params
+   * @param callback
    */
-  showBottomSheet = (params: BottomSheetParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(
-        StackActions.push('Modal', {
-          ...params,
-          isBottomSheet: true,
-        })
-      );
-    }
+  showBottomSheet = (
+    params: BottomSheetParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(
+          StackActions.push('Modal', {
+            ...params,
+            isBottomSheet: true,
+          })
+        );
+      },
+      callback,
+    });
   };
 
   /**
    * pop all screen route
    */
-  popToTop = () => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.popToTop());
-    }
+  popToTop = (callback?: (params: NavigatorCallbackParamsType) => void) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(StackActions.popToTop());
+      },
+      callback,
+    });
   };
 
   /**
@@ -97,43 +172,56 @@ class Navigator {
    * @param name
    * @param params
    */
-  navigate = (name: string, params: any) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(
-        CommonActions.navigate({
-          name,
-          params,
-        })
-      );
-    }
+  navigate = (
+    name: string,
+    params: any,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(
+          CommonActions.navigate({
+            name,
+            params,
+          })
+        );
+      },
+      callback,
+    });
   };
 
   /**
    * reset a navigation flow with new screen
    * @param params
    */
-  reset = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(
-        CommonActions.reset({
-          index: 0,
-          routes: [
-            {
-              name: 'Stack',
-              key: `Stack_${new Date().getTime()}`,
-              params,
-            },
-          ],
-        })
-      );
-    }
+  reset = (
+    params: ScreenParams,
+    callback?: (params: NavigatorCallbackParamsType) => void
+  ) => {
+    this.validateRefAndRunAction({
+      action: navigationRef => {
+        navigationRef.dispatch(
+          CommonActions.reset({
+            index: 0,
+            routes: [
+              {
+                name: 'Stack',
+                key: `Stack_${new Date().getTime()}`,
+                params,
+              },
+            ],
+          })
+        );
+      },
+      callback,
+    });
   };
 
   /**
    * dismiss a feature data
    * @param data
    */
-  setDismissData = (data: any) => {
+  setDismissData = (data: unknown) => {
     this.dismissData = data;
   };
 

package/Application/constants.ts

@@ -0,0 +1,9 @@
+export enum NavigationActionCallbackStatusEnum {
+  Success = 'success',
+  Failed = 'failed',
+}
+
+export enum NavigationActionCallbackErrorEnum {
+  NotReady = 'not_ready',
+  Error = 'error',
+}

package/Application/types.ts

@@ -6,6 +6,10 @@ import {PopupNotifyProps} from '../Popup/types';
 import Localize from './Localize';
 import Navigation from './Navigation';
 import Navigator from './Navigator';
+import {
+  NavigationActionCallbackErrorEnum,
+  NavigationActionCallbackStatusEnum,
+} from './constants';
 
 type Screen = React.ComponentType<NavigationScreenProps>;
 
@@ -243,3 +247,21 @@ export type AnimatedHeader = {
   component?: (props?: any) => React.ReactElement;
   headerTitle?: (props?: any) => React.ReactElement;
 };
+
+export interface RouteParams {
+  screen?: {
+    name?: string;
+  };
+}
+type NavigatorActionSuccessCallbackType = {
+  status: NavigationActionCallbackStatusEnum.Success;
+};
+
+type NavigatorActionFailCallbackType = {
+  status: NavigationActionCallbackStatusEnum.Failed;
+  type: NavigationActionCallbackErrorEnum;
+};
+
+export type NavigatorCallbackParamsType =
+  | NavigatorActionSuccessCallbackType
+  | NavigatorActionFailCallbackType;

package/Popup/PopupNotify.tsx

@@ -7,6 +7,7 @@ import {Icon} from '../Icon';
 import {Image} from '../Image';
 import {scaleSize, Text} from '../Text';
 import {PopupNotifyProps} from './types';
+import {RouteParams} from '../Application/types';
 
 const PopupNotify: React.FC<PopupNotifyProps> = ({
   id,
@@ -35,9 +36,10 @@ const PopupNotify: React.FC<PopupNotifyProps> = ({
   useEffect(() => {
     const routes = navigator?.ref.current?.getRootState()?.routes || [];
     const routesLength = routes.length;
-    let screen_name = routes?.[0]?.params?.screen?.name;
+    let screen_name = (routes?.[0]?.params as RouteParams)?.screen?.name;
     if (routesLength > 1) {
-      screen_name = routes[routesLength - 2]?.params?.screen?.name;
+      screen_name = (routes[routesLength - 2]?.params as RouteParams)?.screen
+        ?.name;
     }
     const tracking = {
       appId: context.appId,

package/Popup/PopupPromotion.tsx

@@ -5,6 +5,7 @@ import {ApplicationContext, MiniAppContext} from '../Application';
 import {Image} from '../Image';
 import {Radius, Spacing} from '../Consts';
 import {Icon} from '../Icon';
+import {RouteParams} from '../Application/types';
 
 const PopupPromotion: React.FC<PopupPromotionProps> = ({
   id,
@@ -21,9 +22,10 @@ const PopupPromotion: React.FC<PopupPromotionProps> = ({
   useEffect(() => {
     const routes = navigator?.ref.current?.getRootState()?.routes || [];
     const routesLength = routes.length;
-    let screen_name = routes?.[0]?.params?.screen?.name;
+    let screen_name = (routes?.[0]?.params as RouteParams)?.screen?.name;
     if (routesLength > 1) {
-      screen_name = routes[routesLength - 2]?.params?.screen?.name;
+      screen_name = (routes[routesLength - 2]?.params as RouteParams)?.screen
+        ?.name;
     }
     const tracking = {
       appId: context.appId,

package/package.json

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