@applicaster/zapp-react-native-utils 14.0.0-rc.9 → 15.0.0-alpha.1001559563

package/zappFrameworkUtils/HookCallback/callbackNavigationAction.ts

@@ -0,0 +1,217 @@
+import { useNavigation, useRivers, useScreenContext } from "../../reactHooks";
+import { createLogger } from "../../logger";
+import { useCallback, useMemo } from "react";
+
+export enum NavigationCallbackOptions {
+  DEFAULT = "default",
+  GO_HOME = "go_home",
+  GO_BACK = "go_back",
+  GO_TO_SCREEN = "go_to_screen",
+}
+
+export enum ResultType {
+  login = "login",
+  logout = "logout",
+}
+
+export type CallbackResult = hookCallbackArgs & {
+  options?: {
+    resultType?: ResultType;
+  };
+};
+
+export type ScreenResultCallback = (args: CallbackResult) => void | undefined;
+
+export const CALLBACK_NAVIGATION_KEY = "completion_action";
+
+export const CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY =
+  "completion_action_navigation_go_to_screen";
+
+type NavKeys = {
+  action: NavigationCallbackOptions;
+  targetScreenId: string | null;
+} | null;
+
+type General = Record<string, unknown>;
+
+const LogPrefix = "useCallbackNavigationAction:";
+
+const { log_info, log_verbose, log_debug } = createLogger({
+  subsystem: "hook-navigation-callback",
+});
+
+const legacyMappingKeys = {
+  "quick-brick-login-flow": {
+    actionType: "login_completion_action",
+    targetScreen: "navigate_to_login_screen",
+  },
+  "quick-brick-user-account-ui-component": {
+    actionType: "callbackAction",
+  },
+  "quick-brick-login-multi-login-providers.login": {
+    actionType: "login_completion_action",
+    targetScreen: "navigate_to_login_screen",
+  },
+  "quick-brick-login-multi-login-providers.logout": {
+    actionType: "logout_completion_action",
+    targetScreen: "navigate_to_logout_screen",
+  },
+};
+
+const NAV_ACTIONS = Object.values(NavigationCallbackOptions) as string[];
+
+const isNavAction = (v: unknown): v is NavigationCallbackOptions =>
+  typeof v === "string" && NAV_ACTIONS.includes(v);
+
+export const getNavigationKeys = (
+  item?: ZappUIComponent | ZappRiver,
+  resultType: ResultType | null = null
+): NavKeys => {
+  const general = (item?.general ?? {}) as General;
+
+  const pluginIdentifier = (item as any).identifier ?? item?.type ?? "";
+
+  const legacy =
+    legacyMappingKeys[`${pluginIdentifier}.${resultType}`] ??
+    legacyMappingKeys[pluginIdentifier] ??
+    {};
+
+  const actionKey = resultType
+    ? `${resultType}_${CALLBACK_NAVIGATION_KEY}`
+    : CALLBACK_NAVIGATION_KEY;
+
+  const rawAction =
+    (general as General)[actionKey] ??
+    (legacy.actionType ? (general as General)[legacy.actionType] : undefined);
+
+  const action: NavigationCallbackOptions | null = isNavAction(rawAction)
+    ? rawAction
+    : null;
+
+  if (!action) return null;
+
+  let targetScreenId: string | null = null;
+
+  if (action === NavigationCallbackOptions.GO_TO_SCREEN) {
+    const screenKey = resultType
+      ? `${resultType}_${CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY}`
+      : CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY;
+
+    const screenId: string | null =
+      ((general as General)[screenKey] as string) ??
+      (legacy.targetScreen
+        ? ((general as General)[legacy.targetScreen] as string)
+        : undefined);
+
+    if (screenId) {
+      targetScreenId = screenId.length > 0 ? screenId : null;
+    }
+  }
+
+  return { action, targetScreenId };
+};
+
+export const useCallbackNavigationAction = (
+  item?: ZappUIComponent | ZappRiver
+): ((
+  args: CallbackResult,
+  hookCallback?: hookCallback
+) => void | undefined) => {
+  const navigation = useNavigation();
+  const rivers = useRivers();
+  const screenContext = useScreenContext();
+
+  const overrideCallbackFromComponent = useMemo(() => {
+    log_verbose(`${LogPrefix}: overridden callbackAction by component`);
+
+    // TODO: Check if we have better option where to store overridden callback action
+    return screenContext?.options?.callback;
+  }, [screenContext?.options?.callback]);
+
+  if (typeof __DEV__ !== "undefined" && __DEV__) {
+    log_verbose(`${LogPrefix} screenContext`, { screenContext, item });
+  }
+
+  const callbackAction = useCallback<hookCallback>(
+    (args: CallbackResult, hookCallback: hookCallback = null) => {
+      if (!args.success) {
+        log_debug(
+          `${LogPrefix} callback called with no success, use original callback`
+        );
+
+        hookCallback?.(args);
+
+        return;
+      }
+
+      if (args.cancelled) {
+        log_debug(
+          `${LogPrefix} callback called but cancelled, use original callback`
+        );
+
+        hookCallback?.(args);
+
+        return;
+      }
+
+      const data = getNavigationKeys(item, args.options?.resultType ?? null);
+
+      if (!data) {
+        hookCallback?.(args);
+
+        return;
+      }
+
+      hookCallback?.({ ...args, success: false, cancelled: true });
+
+      switch (data.action) {
+        case NavigationCallbackOptions.GO_BACK: {
+          if (navigation.canGoBack()) {
+            navigation.goBack();
+            log_info(`${LogPrefix} performing 'GO BACK' action`);
+          } else {
+            log_info(`${LogPrefix} cannot perform 'GO BACK' action — ignoring`);
+          }
+
+          break;
+        }
+
+        case NavigationCallbackOptions.GO_HOME: {
+          navigation.goHome();
+          log_info(`${LogPrefix} performing 'GO HOME' action`);
+          break;
+        }
+
+        case NavigationCallbackOptions.GO_TO_SCREEN: {
+          const screenId = data.targetScreenId;
+
+          if (!screenId) {
+            log_info(`${LogPrefix} no screenId provided — ignoring`);
+            break;
+          }
+
+          const screen = rivers[screenId];
+
+          if (screen) {
+            navigation.replace(screen);
+
+            log_info(
+              `${LogPrefix} performing 'GO TO SCREEN' action to screen: ${screenId}`
+            );
+          } else {
+            log_info(`${LogPrefix} no screen provided — ignoring`);
+          }
+
+          break;
+        }
+
+        default: {
+          break;
+        }
+      }
+    },
+    [item, navigation, rivers]
+  );
+
+  return overrideCallbackFromComponent || callbackAction;
+};

package/zappFrameworkUtils/HookCallback/hookCallbackManifestExtensions.config.js

@@ -0,0 +1,76 @@
+const NavigationCallbackOptions = {
+  DEFAULT: "default",
+  GO_HOME: "go_home",
+  GO_BACK: "go_back",
+  GO_TO_SCREEN: "go_to_screen",
+};
+
+const ResultType = {
+  login: "login",
+  logout: "logout",
+};
+
+const CALLBACK_NAVIGATION_KEY = "completion_action";
+
+const CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY =
+  "completion_action_navigation_go_to_screen";
+
+const callbackKeyPrefix = (key, prefix, keySeparator = "_") =>
+  prefix ? `${prefix}${keySeparator}${key}` : key;
+
+const extendManifestWithHookCallback = (prefix = null) => ({
+  group: true,
+  label: "CallBack Navigation",
+  folded: true,
+  fields: [
+    {
+      type: "select",
+      key: callbackKeyPrefix(CALLBACK_NAVIGATION_KEY, prefix),
+      label: callbackKeyPrefix(
+        "Callback Navigation",
+        prefix?.toUpperCase(),
+        " "
+      ),
+      label_tooltip:
+        "Defines what navigation action should be performed after the callback is called.",
+      options: [
+        {
+          text: "Use default flow",
+          value: NavigationCallbackOptions.DEFAULT,
+        },
+        {
+          text: "Go Back to home screen",
+          value: NavigationCallbackOptions.GO_HOME,
+        },
+        {
+          text: "Go Back to previous screen",
+          value: NavigationCallbackOptions.GO_BACK,
+        },
+        {
+          text: "Move to specific screen",
+          value: NavigationCallbackOptions.GO_TO_SCREEN,
+        },
+      ],
+      initial_value: "default",
+    },
+    {
+      type: "screen_selector",
+      key: callbackKeyPrefix(CALLBACK_NAVIGATION_GO_TO_SCREEN_KEY, prefix),
+      label: callbackKeyPrefix(
+        "Navigate to screen",
+        prefix?.toUpperCase(),
+        " "
+      ),
+      label_tooltip: "Screen you wish to navigate to after success purchase",
+      rules: "conditional",
+      conditional_fields: [
+        {
+          key: `general/${callbackKeyPrefix(CALLBACK_NAVIGATION_KEY, prefix)}`,
+          condition_value: NavigationCallbackOptions.GO_TO_SCREEN,
+        },
+      ],
+    },
+  ],
+});
+
+module.exports = { extendManifestWithHookCallback, ResultType };

package/zappFrameworkUtils/HookCallback/useCallbackActions.ts

@@ -0,0 +1,19 @@
+import { useCallback } from "react";
+import {
+  CallbackResult,
+  useCallbackNavigationAction,
+} from "./callbackNavigationAction";
+
+export const useCallbackActions = (
+  item?: ZappUIComponent | ZappRiver,
+  hookCallback?: hookCallback
+): hookCallback => {
+  const navigationAction = useCallbackNavigationAction(item);
+
+  return useCallback(
+    async (data: CallbackResult) => {
+      navigationAction(data, hookCallback);
+    },
+    [navigationAction, hookCallback]
+  );
+};

package/zappFrameworkUtils/loginPluginUtils.ts

@@ -20,7 +20,7 @@ const isAuthenticationRequired = ({ payload, logs }) => {
 
   if (!payload) {
     log_info(
-      "isAuthenticationRequired: No payload exist, authentefication required"
+      "isAuthenticationRequired: No payload exist, authentication required"
     );
 
     return true;