@momo-kits/native-kits 0.157.1-com.1-debug → 0.157.1-com.1

package/src/foundations/Application/Navigator.ts

@@ -1,171 +0,0 @@
-import {CommonActions, StackActions} from '@react-navigation/native';
-import {BottomSheetParams, ModalParams, ScreenParams} from './types';
-
-class Navigator {
-  ref?: any;
-  isReady?: any;
-  isWidget?: any;
-  maxApi?: any;
-  dismissData?: any;
-
-  constructor(navigation: any, isReady: any, isWidget = false) {
-    this.ref = navigation;
-    this.isReady = isReady;
-    this.isWidget = isWidget;
-  }
-
-  /**
-   * push new stack screen
-   * @param params
-   */
-  push = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.push('Stack', params));
-    }
-  };
-
-  /**
-   * replace current screen with new screen
-   * @param params
-   */
-  replace = (params: ScreenParams) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.replace('Stack', params));
-    }
-  };
-
-  /**
-   * pop to dismiss a screen
-   * @param count
-   */
-  pop = (count?: number) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.pop(count ?? 1));
-    }
-  };
-
-  /**
-   * 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));
-    }
-  };
-
-  /**
-   * show a modal popup
-   * @param params
-   * @param onError
-   */
-  showModal = (params: ModalParams, onError?: (error: string) => void) => {
-    try {
-      if (this.isReady.current) {
-        this.ref.current?.dispatch?.(
-          StackActions.push('Modal', {
-            ...params,
-            useNativeModal: this.isWidget ? true : params?.useNativeModal,
-          })
-        );
-      } else {
-        onError?.('NavigationContainer not ready');
-      }
-    } catch (error) {
-      onError?.(`${error}`);
-    }
-  };
-
-  /**
-   * show a bottom sheet
-   * @param params
-   * @param onError
-   */
-  showBottomSheet = (
-    params: BottomSheetParams,
-    onError?: (error: string) => void
-  ) => {
-    try {
-      if (this.isReady.current) {
-        this.ref.current?.dispatch?.(
-          StackActions.push('Modal', {
-            ...params,
-            useNativeModal: this.isWidget ? true : params?.useNativeModal,
-            isBottomSheet: true,
-          })
-        );
-      } else {
-        onError?.('NavigationContainer not ready');
-      }
-    } catch (error) {
-      onError?.(`${error}`);
-    }
-  };
-
-  /**
-   * pop all screen route
-   */
-  popToTop = () => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(StackActions.popToTop());
-    }
-  };
-
-  /**
-   * navigate route name bottom tab only
-   * @param name
-   */
-  navigate = (name: string) => {
-    if (this.isReady.current) {
-      this.ref.current?.dispatch?.(
-        CommonActions.navigate({
-          name,
-        })
-      );
-    }
-  };
-
-  /**
-   * 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,
-            },
-          ],
-        })
-      );
-    }
-  };
-
-  /**
-   * dismiss a feature data
-   * @param data
-   */
-  setDismissData = (data: any) => {
-    this.dismissData = data;
-  };
-
-  /**
-   * set app context using for features of kit
-   * @param context
-   */
-  setCurrentContext = (context: {
-    code?: string;
-    name?: {vi: string; en: string};
-    description?: {vi: string; en: string};
-    icon?: string;
-  }) => {
-    console.log(context);
-  };
-}
-
-export default Navigator;

package/src/foundations/Application/ScaleSizeProvider.tsx

@@ -1,16 +0,0 @@
-import React, { FC } from 'react';
-import { ScaleSizeContext } from '../Context';
-import { ScaleSizeProviderProps } from './types';
-
-const ScaleSizeProvider: FC<ScaleSizeProviderProps> = ({
-  scaleSizeMaxRate,
-  children,
-}) => {
-  return (
-    <ScaleSizeContext.Provider value={{ scaleSizeMaxRate }}>
-      {children}
-    </ScaleSizeContext.Provider>
-  );
-};
-
-export default ScaleSizeProvider;

package/src/foundations/Application/StackScreen.tsx

@@ -1,420 +0,0 @@
-import React, { useContext, useEffect, useLayoutEffect, useRef } from 'react';
-import { Alert, InteractionManager } from 'react-native';
-import { useHeaderHeight } from '@react-navigation/elements';
-import { ScreenTrackingParams } from './types';
-import Navigation from './Navigation';
-import { ApplicationContext, MiniAppContext, ScreenContext } from '../Context';
-import { GridSystem } from '../Layout';
-import { version } from '../package.json';
-import { useAppState } from './utils';
-import { TooltipPortalHost, TooltipPortalProvider } from './TooltipPortal.tsx';
-
-const runAfterInteractions = InteractionManager.runAfterInteractions;
-
-/**
- * container for stack screen
- * @param props
- * @constructor
- */
-const StackScreen: React.FC<any> = props => {
-  const { showGrid, navigator } = useContext(ApplicationContext);
-  const tracking = useRef<any>({
-    mounted: false,
-    timeoutLoad: undefined,
-    timeoutInteraction: undefined,
-    timeoutTracking: undefined,
-    timeoutLoading: undefined,
-    startTime: Date.now(),
-    endTime: Date.now(),
-    traceIdLoad: undefined,
-    traceIdInteraction: undefined,
-    releaseLoad: undefined,
-    releaseInteraction: undefined,
-    releaseUserInteraction: undefined,
-    releaseLoading: false,
-    timeLoad: 0,
-    timeInteraction: 0,
-    timeStartLoading: 0,
-    timeEndLoading: 0,
-    widgets: [],
-    params: undefined,
-    lastElement: undefined,
-  });
-  const widgets = useRef<any>([]);
-  const context = useContext<any>(MiniAppContext);
-  const {
-    screen: Component,
-    options,
-    initialParams,
-    bottomTab,
-  } = props.route.params;
-  const navigation = useRef(new Navigation(props.navigation, context)).current;
-  const heightHeader = useHeaderHeight();
-  const { isBackgroundToForeground } = useAppState();
-
-  const data = {
-    ...initialParams,
-    ...props.route.params,
-    navigation,
-  };
-
-  delete data.screen;
-  delete data.initialParams;
-
-  const screenName = Component?.name || Component?.type?.name || 'Invalid';
-
-  /**
-   * set options for screen
-   */
-  useLayoutEffect(() => {
-    if (options) {
-      navigation.setOptions(options);
-    }
-  }, [navigation, options]);
-
-  /**
-   * tracking for screen
-   */
-  useEffect(() => {
-    let focusScreen: any;
-    let onFocusApp: any;
-    if (['Invalid', 'screen'].includes(screenName)) {
-      navigator?.maxApi?.showPopup?.('notice', {
-        title: 'Invalid screen name',
-        message:
-          'Your screen has not been rendered because Platform has not detected the screen name. Please migrate to support this feature.',
-      });
-    }
-
-    const startTime = Date.now();
-
-    if (!bottomTab) {
-      focusScreen = props.navigation.addListener('focus', () => {
-        navigator?.maxApi?.getDataObserver?.('current_screen', (item: any) => {
-          onScreenNavigated(item?.screenName, screenName);
-          navigator?.maxApi?.setDataObserver?.('current_screen', {
-            screenName,
-            startTime,
-          });
-        });
-      });
-      onFocusApp = navigator?.maxApi?.listen?.('onFocusApp', () => {
-        if (props.navigation.isFocused()) {
-          navigator?.maxApi?.getDataObserver?.(
-            'current_screen',
-            (item: any) => {
-              onScreenNavigated(item?.screenName, screenName);
-              navigator?.maxApi?.setDataObserver?.('current_screen', {
-                screenName,
-                startTime,
-              });
-            },
-          );
-        }
-      });
-    }
-
-    navigator?.maxApi?.startTraceScreenLoad?.(
-      screenName,
-      context,
-      (item: any) => {
-        tracking.current.traceIdLoad = item?.traceId;
-      },
-    );
-    navigator?.maxApi?.startTraceScreenInteraction?.(
-      screenName,
-      context,
-      (item: any) => {
-        tracking.current.traceIdInteraction = item?.traceId;
-      },
-    );
-
-    tracking.current.timeoutTracking = setTimeout(() => {
-      onScreenLoad();
-      onScreenInteraction();
-    }, 5000);
-
-    return () => {
-      onScreenLoad();
-      onScreenInteraction();
-      clearTimeout(tracking.current.timeoutLoad);
-      clearTimeout(tracking.current.timeoutInteraction);
-      clearTimeout(tracking.current.timeoutTracking);
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      clearTimeout(tracking.current.timeoutLoading);
-      focusScreen?.();
-      onFocusApp?.remove?.();
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  const onScreenNavigated = (pre: string, current: string) => {
-    if (!isBackgroundToForeground) {
-      const item: any = {
-        preScreenName: pre,
-        screenName: current,
-        componentName: 'Screen',
-        state: 'navigated',
-        action: tracking.current?.mounted ? 'back' : 'push',
-      };
-
-      context?.autoTracking?.({
-        ...context,
-        ...item,
-      });
-
-      tracking.current.mounted = true;
-
-      /**
-       * debug toast
-       */
-      navigator?.maxApi?.showToastDebug?.({
-        appId: context.appId,
-        message: `${screenName} screen_navigated`,
-        type: 'ERROR',
-      });
-    }
-  };
-
-  /**
-   * tracking for screen load
-   */
-  const onScreenLoad = () => {
-    if (!tracking.current?.releaseLoad) {
-      let timeLoad = tracking.current.timeLoad;
-      if (timeLoad === 0) {
-        timeLoad = tracking.current.endTime - tracking.current.startTime;
-      }
-
-      context?.autoTracking?.({
-        ...context,
-        screenName,
-        componentName: 'Screen',
-        state: 'load',
-        duration: timeLoad,
-        widgets: tracking.current.widgets,
-        params: tracking.current.params,
-        version: version,
-        lastElement: tracking.current.lastElement,
-      });
-      navigator?.maxApi?.stopTrace?.(
-        tracking.current.traceIdLoad,
-        { value: timeLoad / 1000 },
-        null,
-      );
-      tracking.current.releaseLoad = true;
-
-      /**
-       * debug
-       */
-      navigator?.maxApi?.showToastDebug?.({
-        appId: context.appId,
-        message: `${screenName} screen_load_time ${timeLoad}`,
-        type: 'ERROR',
-      });
-      if (
-        __DEV__ &&
-        tracking.current.lastElement?.children?.current?.length > 0
-      ) {
-        Alert.alert(
-          `${screenName}- load ${timeLoad}ms`,
-          JSON.stringify(tracking.current.lastElement?.children?.current),
-        );
-      }
-    }
-  };
-
-  /**
-   * tracking for screen load
-   */
-  const onScreenInteraction = () => {
-    if (!tracking.current?.releaseInteraction) {
-      let timeLoad = tracking.current.timeLoad;
-      if (timeLoad === 0) {
-        timeLoad = tracking.current.endTime - tracking.current.startTime;
-      }
-      if (tracking.current.timeInteraction === 0) {
-        tracking.current.timeInteraction = timeLoad;
-      }
-
-      context?.autoTracking?.({
-        ...context,
-        screenName,
-        componentName: 'Screen',
-        state: 'interaction',
-        duration: tracking.current.timeInteraction - timeLoad,
-        totalDuration: tracking.current.timeInteraction,
-        params: tracking.current.params,
-        version: version,
-      });
-      navigator?.maxApi?.stopTrace?.(
-        tracking.current.traceIdInteraction,
-        { value: tracking.current.timeInteraction / 1000 },
-        null,
-      );
-      tracking.current.releaseInteraction = true;
-
-      /**
-       * debug toast
-       */
-      navigator?.maxApi?.showToastDebug?.({
-        appId: context.appId,
-        message: `${screenName} screen_interaction_time ${tracking.current.timeInteraction}`,
-        type: 'ERROR',
-      });
-    }
-  };
-
-  /**
-   * tracking for first interaction by user
-   */
-  const onFirstInteraction = (action: string) => {
-    if (!tracking.current?.releaseUserInteraction) {
-      const timeLoad = tracking.current.endTime - tracking.current.startTime;
-      context?.autoTracking?.({
-        ...context,
-        screenName,
-        componentName: 'Screen',
-        state: 'interaction',
-        duration: timeLoad,
-        action,
-      });
-      tracking.current.releaseUserInteraction = true;
-
-      /**
-       * debug
-       */
-      navigator?.maxApi?.showToastDebug?.({
-        appId: context.appId,
-        message: `${screenName} user_interaction ${timeLoad}`,
-        type: 'ERROR',
-      });
-    }
-  };
-
-  /**
-   * tracking for loading screen
-   */
-  const onScreenLoading = () => {
-    const start = tracking.current.timeStartLoading;
-    const end = tracking.current.timeEndLoading;
-    if (!tracking.current?.releaseLoading && start && end && end > start) {
-      context?.autoTracking?.({
-        ...context,
-        screenName,
-        componentName: 'Screen',
-        state: 'loading',
-        duration: end - start,
-        loadingType: 'skeleton',
-      });
-      tracking.current.releaseLoading = true;
-    }
-  };
-
-  return (
-    <ScreenContext.Provider
-      value={{
-        screenName,
-        onElementLoad: (item: any) => {
-          /**
-           * widget handle
-           */
-          if (item?.componentName === 'Widget') {
-            const index = widgets.current.findIndex(
-              (element: any) => element.componentId === item.componentId,
-            );
-            const time = Date.now() - tracking.current.startTime;
-            if (index === -1) {
-              widgets.current.push({
-                componentId: item.componentId,
-                appId: item.params?.appId,
-                code: item.params?.code,
-                start: time,
-              });
-            } else {
-              const exist = widgets.current[index];
-              widgets.current[index] = {
-                ...exist,
-                end: time,
-                duration: time - exist.start,
-              };
-            }
-            return;
-          }
-
-          /**
-           * tracking for element screen load
-           */
-          clearTimeout(tracking.current.timeoutLoad);
-          tracking.current.endTime = Date.now();
-          tracking.current.timeoutInteraction?.cancel?.();
-          tracking.current.timeoutInteraction = runAfterInteractions(() => {
-            tracking.current.timeInteraction =
-              Date.now() - tracking.current.startTime;
-          });
-
-          /**
-           * support for debug last element
-           */
-          if (item?.componentName) {
-            tracking.current.lastElement = item;
-          }
-
-          /**
-           * for stop tracking when user interaction
-           */
-          if (item?.interaction) {
-            onScreenLoad();
-            onScreenInteraction();
-            onFirstInteraction(item?.action);
-          }
-          /**
-           * timeout for handle tracking screen
-           */
-          tracking.current.timeoutLoad = setTimeout(() => {
-            const time = tracking.current.endTime - tracking.current.startTime;
-            tracking.current.widgets = widgets.current;
-
-            if (tracking.current.timeLoad === 0) {
-              tracking.current.timeLoad = time;
-            }
-
-            onScreenLoad();
-            onScreenInteraction();
-          }, 2000);
-        },
-        onLoading: (loading: boolean) => {
-          if (loading && tracking.current.timeStartLoading === 0) {
-            tracking.current.timeStartLoading = Date.now();
-          }
-
-          /**
-           * tracking for loading screen
-           */
-          if (!loading) {
-            tracking.current.timeEndLoading = Date.now();
-          }
-
-          /**
-           * timeout for handle tracking screen
-           */
-          clearTimeout(tracking.current.timeoutLoading);
-          tracking.current.timeoutLoading = setTimeout(() => {
-            onScreenLoading();
-          }, 2000);
-        },
-        onSetParams: (item: ScreenTrackingParams) => {
-          tracking.current.params = item;
-        },
-      }}
-    >
-      <TooltipPortalProvider>
-        <Component heightHeader={heightHeader} {...data} />
-        {showGrid && <GridSystem />}
-        <TooltipPortalHost />
-      </TooltipPortalProvider>
-    </ScreenContext.Provider>
-  );
-};
-
-export default StackScreen;