@applicaster/quick-brick-core 13.0.0-alpha.3755455151 → 13.0.0-alpha.4004617449

package/App/DeepLinking/URLSchemeListener/URLSchemeContextProvider.tsx

@@ -10,7 +10,11 @@ import * as ReactNative from "react-native";
 
 import { isWeb } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { log_debug, log_error, log_info } from "../logger";
-
+import { getAppUrlScheme } from "@applicaster/zapp-react-native-utils/appDataUtils";
+import {
+  getZappPlatform,
+  ZappPlatform,
+} from "@applicaster/zapp-react-native-utils/appUtils/platform";
 type Props = {
   listenerSpy?: (...any) => void;
   children: ReactChild;
@@ -34,6 +38,15 @@ const initialState = { url: null, done: () => {} };
 
 export const URLSchemeContext = createContext<State>(initialState);
 
+const getWebDeepLink = (initialURL: string) => {
+  if (!initialURL) return null;
+
+  const index = initialURL.indexOf("?");
+  if (index === -1) return;
+
+  return getAppUrlScheme() + "://open" + initialURL.slice(index);
+};
+
 function URLSchemeContextProvider(props: Props) {
   const [state, setState] = useState<string | null>(initialState.url);
 
@@ -51,10 +64,24 @@ function URLSchemeContextProvider(props: Props) {
     props?.listenerSpy?.("getInitialURL");
 
     try {
-      if (isWeb()) return;
-
       const url = await Linking.getInitialURL();
 
+      if (isWeb()) {
+        if (getZappPlatform() === ZappPlatform.Vizio) {
+          const deepLink = getWebDeepLink(url);
+
+          if (deepLink) {
+            log_info(
+              `URLSchemeContextProvider: Retrieved initial deep link: ${deepLink}`
+            );
+
+            return setState(deepLink);
+          }
+        }
+
+        return;
+      }
+
       log_info(
         `URLSchemeContextProvider: Retrieved initial url: ${url || "not exist"}`
       );

package/App/LoadingOverlay/LoadingOverlayManager.tsx

@@ -0,0 +1,27 @@
+import { BehaviorSubject } from "rxjs";
+
+class LoadingOverlayManager {
+  visibilitySubject: BehaviorSubject<boolean>;
+
+  constructor() {
+    this.visibilitySubject = new BehaviorSubject(false);
+  }
+
+  show() {
+    this.visibilitySubject.next(true);
+  }
+
+  hide() {
+    this.visibilitySubject.next(false);
+  }
+
+  onVisibilityStateChange(cb: (value: boolean) => void) {
+    return this.visibilitySubject.subscribe(cb);
+  }
+
+  get visibility(): boolean {
+    return this.visibilitySubject.value;
+  }
+}
+
+export const loadingOverlayManager = new LoadingOverlayManager();

package/App/LoadingOverlay/index.tsx

@@ -0,0 +1,49 @@
+import * as React from "react";
+import { View, StyleSheet } from "react-native";
+import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils/focusManager";
+import { isVizioPlatform } from "@applicaster/zapp-react-native-utils/reactUtils";
+import { Spinner } from "@applicaster/zapp-react-native-ui-components/Components/Spinner";
+import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
+
+import { useLoadingOverlayVisibility } from "./useLoadingOverlayVisibility";
+
+export { loadingOverlayManager } from "./LoadingOverlayManager";
+
+const styles = StyleSheet.create({
+  container: {
+    opacity: 0.5,
+    alignItems: "center",
+    justifyContent: "center",
+    zIndex: 100,
+    flex: 1,
+  },
+});
+
+const LoadingOverlayComponent = () => {
+  const visible = useLoadingOverlayVisibility();
+  const theme = useTheme();
+
+  const backgroundColor = React.useMemo(() => {
+    return theme?.app_background_color || "black";
+  }, [theme?.app_background_color]);
+
+  React.useEffect(() => {
+    if (visible) {
+      focusManager.disableFocus();
+    } else {
+      focusManager.enableFocus();
+    }
+  }, [visible]);
+
+  return visible ? (
+    <View
+      style={[StyleSheet.absoluteFill, styles.container, { backgroundColor }]}
+    >
+      <Spinner />
+    </View>
+  ) : null;
+};
+
+export const LoadingOverlay = isVizioPlatform()
+  ? LoadingOverlayComponent
+  : () => null;

package/App/LoadingOverlay/useLoadingOverlayVisibility.tsx

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { loadingOverlayManager } from "./LoadingOverlayManager";
+
+export const useLoadingOverlayVisibility = () => {
+  const [visible, setVisible] = React.useState(
+    loadingOverlayManager.visibility
+  );
+
+  React.useEffect(() => {
+    const listener = loadingOverlayManager.onVisibilityStateChange(setVisible);
+
+    return () => {
+      listener.unsubscribe();
+    };
+  }, []);
+
+  return visible;
+};

package/App/NavigationProvider/NavigationProvider.tsx

@@ -49,6 +49,7 @@ import { coreAppLogger } from "../logger";
 import {
   getPlatform,
   isTV,
+  isVizioPlatform,
 } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { useConnectionInfo } from "@applicaster/zapp-react-native-utils/reactHooks/connection";
 import {
@@ -67,6 +68,9 @@ import { useModalStore } from "@applicaster/zapp-react-native-utils/modalState";
 import { useSubscriberFor } from "@applicaster/zapp-react-native-utils/reactHooks/useSubscriberFor";
 import { QBUIComponentEvents } from "@applicaster/zapp-react-native-ui-components/events";
 import { Hook } from "@applicaster/zapp-react-native-utils/appUtils/HooksManager/Hook";
+import { URLSchemeContext } from "../DeepLinking/URLSchemeListener/URLSchemeContextProvider";
+
+import { loadingOverlayManager } from "../LoadingOverlay";
 
 const logger = coreAppLogger.addSubsystem("Navigator");
 
@@ -86,6 +90,8 @@ const navigationActions = {
 const platform = getPlatform();
 
 export function NavigationProvider({ children }: Props) {
+  const { url: deepLinkURL } = React.useContext(URLSchemeContext);
+
   const {
     appData: { layoutVersion },
     rivers,
@@ -393,6 +399,8 @@ export function NavigationProvider({ children }: Props) {
     } else {
       dispatch(push(route, { entry: payload, screen: hookPlugin }));
     }
+
+    closeLoadingOverlay();
   };
 
   const handleHookError = ({ error, hookPlugin, callback }, dispose) => {
@@ -411,6 +419,8 @@ export function NavigationProvider({ children }: Props) {
     if (callback && typeof callback === "function") {
       callback();
     }
+
+    closeLoadingOverlay();
   };
 
   const handleHookCancel = ({ hookPlugin, callback }, dispose) => {
@@ -426,6 +436,8 @@ export function NavigationProvider({ children }: Props) {
     } else {
       goBack(true, true);
     }
+
+    closeLoadingOverlay();
   };
 
   const handleHookSuccess = ({ hookPlugin, callback }) => {
@@ -436,6 +448,10 @@ export function NavigationProvider({ children }: Props) {
     }
   };
 
+  const handleBackgroundHook = () => {
+    openLoadingOverlay();
+  };
+
   const checkStartUpHooks = React.useMemo(() => {
     if (!pluginConfigurations) return false;
 
@@ -497,8 +513,7 @@ export function NavigationProvider({ children }: Props) {
     ({ hookPlugin, payload, callback }, dispose) => {
       if (hookPlugin?.lastHook) {
         dispose({ disposeAll: true });
-
-        startUpHooks.current && setStartUpHooks(false);
+        currentStartUpHooks.current && setStartUpHooks(false);
       }
 
       dispatch(
@@ -506,6 +521,8 @@ export function NavigationProvider({ children }: Props) {
       );
 
       callback?.();
+
+      closeLoadingOverlay();
     };
 
   const offlinePlugin = React.useMemo(() => {
@@ -620,6 +637,7 @@ export function NavigationProvider({ children }: Props) {
           .on(HOOKS_EVENTS.ERROR, handleHookError)
           .on(HOOKS_EVENTS.CANCEL, handleHookCancel)
           .on(HOOKS_EVENTS.SUCCESS, handleHookSuccess)
+          .on(HOOKS_EVENTS.START_BACKGROUND_HOOK, handleBackgroundHook)
           .on(
             HOOKS_EVENTS.COMPLETE,
             handleHookComplete(navigationAction, targetRoute, {
@@ -635,6 +653,14 @@ export function NavigationProvider({ children }: Props) {
     },
   });
 
+  const openLoadingOverlay = React.useCallback(() => {
+    deepLinkURL && isVizioPlatform() && loadingOverlayManager.show();
+  }, [deepLinkURL]);
+
+  const closeLoadingOverlay = React.useCallback(() => {
+    loadingOverlayManager.hide();
+  }, []);
+
   const openPiP = React.useCallback(() => {
     dispatch(setVideoPiP());
   }, []);

package/App/appLifeCycleManager/index.tsx

@@ -131,9 +131,8 @@ export function appLifeCycleManager(appLoader, QuickBrickManager) {
             )
             .map((plugin: any) => plugin.module?.getLoginProtocol?.());
 
-          const loginProtocols: LoginProtocol[] = await Promise.all(
-            promiseProtocols
-          );
+          const loginProtocols: LoginProtocol[] =
+            await Promise.all(promiseProtocols);
 
           // Await all does not work here
           for (const protocol of loginProtocols) {

package/App/index.tsx

@@ -1,3 +1,7 @@
+// Disable logs popups(RN68)
+import { LogBox } from "react-native";
+LogBox.ignoreAllLogs();
+
 import * as React from "react";
 import * as R from "ramda";
 import {
@@ -29,6 +33,7 @@ import { appRemoteDataLoader } from "./appRemoteDataLoader";
 import { withActionExecutor } from "@applicaster/zapp-react-native-utils/actionsExecutor/ActionExecutorContext";
 import { withScreenDataContextProvider } from "@applicaster/zapp-react-native-ui-components/Contexts/ScreenDataContext";
 import { LogicAggregatorContainer } from "./LogicAggregatorContainer";
+import { LoadingOverlay } from "./LoadingOverlay";
 
 interface AppOptions {
   Layout: React.ComponentType;
@@ -74,6 +79,7 @@ const App = ({
               <LogicAggregatorContainer
                 components={[InteractionManager, ApplyScreenHooks]}
               />
+              <LoadingOverlay />
             </ErrorBoundary>
           </AppContainer>
         </SafeAreaProvider>

package/index.d.ts

@@ -24,7 +24,7 @@ type AnyValue = void | string | number | boolean | AnyArray | AnyRecord;
 declare type ReducerAction<
   T extends string = string,
   P extends AnyValue = AnyValue,
-  M extends AnyRecord = AnyRecord
+  M extends AnyRecord = AnyRecord,
 > = {
   type: T;
   payload?: P;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/quick-brick-core",
-  "version": "13.0.0-alpha.3755455151",
+  "version": "13.0.0-alpha.4004617449",
   "description": "Core package for Applicaster's Quick Brick App",
   "main": "index.js",
   "types": "index.d.ts",
@@ -29,13 +29,13 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "13.0.0-alpha.3755455151",
-    "@applicaster/quick-brick-core-plugins": "13.0.0-alpha.3755455151",
-    "@applicaster/zapp-pipes-v2-client": "13.0.0-alpha.3755455151",
-    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.3755455151",
-    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.3755455151",
-    "@applicaster/zapp-react-native-ui-components": "13.0.0-alpha.3755455151",
-    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.3755455151",
+    "@applicaster/applicaster-types": "13.0.0-alpha.4004617449",
+    "@applicaster/quick-brick-core-plugins": "13.0.0-alpha.4004617449",
+    "@applicaster/zapp-pipes-v2-client": "13.0.0-alpha.4004617449",
+    "@applicaster/zapp-react-native-bridge": "13.0.0-alpha.4004617449",
+    "@applicaster/zapp-react-native-redux": "13.0.0-alpha.4004617449",
+    "@applicaster/zapp-react-native-ui-components": "13.0.0-alpha.4004617449",
+    "@applicaster/zapp-react-native-utils": "13.0.0-alpha.4004617449",
     "atob": "^2.1.2",
     "axios": "^0.28.0",
     "btoa": "^1.2.1",