@applicaster/quick-brick-core 15.1.6 → 15.1.7-alpha.1530511842

package/App/NotificationToastRenderer/NotificationToastManager.ts

@@ -24,12 +24,21 @@ export interface ToastStyle {
   letterSpacing?: number;
 }
 
+export const DEFAULT_TOAST_TIMEOUT = 1000;
+
+export const CONFIRMATION_TOAST_SOURCE = "confirmation";
+
 export interface ToastPayload {
   id?: string;
   message: string;
   extraMessage?: string; // secondary line; TV renderers show it as a subtitle, mobile ignores it
-  timeout?: number; // ms; if omitted, toast stays until dismissed
+  // ms; confirmation toasts default to DEFAULT_TOAST_TIMEOUT (1000) when omitted.
+  // Non-confirmation toasts stay until dismissed when timeout is omitted.
+  timeout?: number;
   style?: ToastStyle;
+  // stamped by the showToast action; Theme confirmation styles apply when
+  // source === CONFIRMATION_TOAST_SOURCE ("confirmation")
+  source?: string;
   [key: string]: unknown;
 }
 
@@ -122,7 +131,14 @@ class NotificationToastManager {
   };
 
   private handleShowToast = (payload: ToastPayload) => {
-    const item = { ...payload, id: payload.id ?? String(this.nextId++) };
+    const isConfirmation = payload.source === CONFIRMATION_TOAST_SOURCE;
+
+    const item = {
+      ...payload,
+      id: payload.id ?? String(this.nextId++),
+      timeout:
+        payload.timeout ?? (isConfirmation ? DEFAULT_TOAST_TIMEOUT : undefined),
+    };
 
     const queuedIndex = this.queue.findIndex((queued) => queued.id === item.id);
 

package/App/NotificationToastRenderer/NotificationToastRenderer.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
 import {
   View,
   Text,
@@ -7,10 +7,23 @@ import {
   TouchableWithoutFeedback,
   ViewStyle,
 } from "react-native";
+import {
+  Directions,
+  FlingGestureHandler,
+  State,
+} from "react-native-gesture-handler";
+import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
 
-import { notificationToastManager } from "./NotificationToastManager";
+import {
+  CONFIRMATION_TOAST_SOURCE,
+  notificationToastManager,
+} from "./NotificationToastManager";
 import { useNotificationToastState } from "./useNotificationToastState";
 import { useNotificationHeight } from "./useNotificationHeight";
+import { resolveConfirmationToastStyle } from "./resolveConfirmationToastStyle";
+
+const DEFAULT_TOAST_BACKGROUND_COLOR = "#000";
+const DEFAULT_TOAST_MESSAGE_COLOR = "#fff";
 
 const styles = StyleSheet.create({
   notificationView: {
@@ -22,12 +35,19 @@ const styles = StyleSheet.create({
     left: 0,
     right: 0,
   },
+  toastContent: {
+    flex: 1,
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "center",
+  },
 });
 
 type NumberBoolean = 0 | 1;
 
 export const NotificationToastRenderer = ({ children }) => {
   const { statusHeight, notificationHeight } = useNotificationHeight();
+  const theme = useTheme<BaseThemePropertiesMobile>();
 
   const toast = useNotificationToastState();
 
@@ -36,15 +56,22 @@ export const NotificationToastRenderer = ({ children }) => {
 
   const yPosition = useRef(new Animated.Value(0)).current;
 
-  const backgroundColor = toast?.style?.backgroundColor ?? "#000";
-  const color = toast?.style?.color ?? "#fff";
+  const resolvedStyle =
+    toast?.source === CONFIRMATION_TOAST_SOURCE
+      ? resolveConfirmationToastStyle(theme, toast.style)
+      : toast?.style;
+
+  const backgroundColor =
+    resolvedStyle?.backgroundColor ?? DEFAULT_TOAST_BACKGROUND_COLOR;
+
+  const color = resolvedStyle?.color ?? DEFAULT_TOAST_MESSAGE_COLOR;
 
   const textStyles = {
     color,
-    fontFamily: toast?.style?.fontFamily,
-    fontSize: toast?.style?.fontSize,
-    lineHeight: toast?.style?.lineHeight,
-    letterSpacing: toast?.style?.letterSpacing,
+    fontFamily: resolvedStyle?.fontFamily,
+    fontSize: resolvedStyle?.fontSize,
+    lineHeight: resolvedStyle?.lineHeight,
+    letterSpacing: resolvedStyle?.letterSpacing,
   };
 
   const animatedViewStyles: ViewStyle = {
@@ -64,6 +91,20 @@ export const NotificationToastRenderer = ({ children }) => {
     backgroundColor,
   };
 
+  const dismissToast = useCallback(() => {
+    notificationToastManager.dismiss();
+  }, []);
+
+  const onFlingStateChange = useCallback(
+    ({ nativeEvent }) => {
+      // Fling activates then ends; dismiss once the upward fling is recognized.
+      if (nativeEvent.oldState === State.ACTIVE) {
+        dismissToast();
+      }
+    },
+    [dismissToast]
+  );
+
   useEffect(() => {
     if (toast) {
       setNotificationOpacity(1);
@@ -83,20 +124,39 @@ export const NotificationToastRenderer = ({ children }) => {
   }, [toast]);
 
   return (
-    <View testID="NotificationToastRenderer" style={StyleSheet.absoluteFill}>
+    <View
+      testID="NotificationToastRenderer"
+      style={StyleSheet.absoluteFill}
+      pointerEvents="box-none"
+    >
       {children}
-      <TouchableWithoutFeedback
-        testID="NotificationToastRenderer-touchable"
-        style={styles.notificationView}
-        onPress={() => notificationToastManager.dismiss()}
+      <FlingGestureHandler
+        enabled={!!toast}
+        direction={Directions.UP}
+        onHandlerStateChange={onFlingStateChange}
       >
-        <Animated.View style={animatedViewStyles}>
-          <View style={{ height: statusHeight, backgroundColor }} />
-          <Text testID="NotificationToastRenderer-message" style={textStyles}>
-            {toast?.message}
-          </Text>
+        <Animated.View
+          testID="NotificationToastRenderer-fling"
+          pointerEvents={toast ? "auto" : "none"}
+          style={animatedViewStyles}
+        >
+          {/* Tap dismiss kept alongside fling for discoverability / a11y */}
+          <TouchableWithoutFeedback
+            testID="NotificationToastRenderer-touchable"
+            onPress={dismissToast}
+          >
+            <View style={styles.toastContent}>
+              <View style={{ height: statusHeight, backgroundColor }} />
+              <Text
+                testID="NotificationToastRenderer-message"
+                style={textStyles}
+              >
+                {toast?.message}
+              </Text>
+            </View>
+          </TouchableWithoutFeedback>
         </Animated.View>
-      </TouchableWithoutFeedback>
+      </FlingGestureHandler>
     </View>
   );
 };

package/App/NotificationToastRenderer/__tests__/NotificationToastManager.test.ts

@@ -1,6 +1,8 @@
 import {
   notificationToastManager,
   NOTIFICATION_TOAST_EVENTS,
+  DEFAULT_TOAST_TIMEOUT,
+  CONFIRMATION_TOAST_SOURCE,
 } from "../NotificationToastManager";
 import { postEvent } from "@applicaster/zapp-react-native-utils/reactHooks/useSubscriberFor";
 
@@ -210,4 +212,55 @@ describe("NotificationToastManager", () => {
 
     expect(onShow).not.toHaveBeenCalled();
   });
+
+  it("defaults timeout to DEFAULT_TOAST_TIMEOUT for confirmation toasts when omitted", () => {
+    const onShow = jest.fn();
+    const onHide = jest.fn();
+    on(NOTIFICATION_TOAST_EVENTS.SHOW, onShow);
+    on(NOTIFICATION_TOAST_EVENTS.HIDE, onHide);
+
+    notificationToastManager.showToast({
+      message: "Added to queue",
+      source: CONFIRMATION_TOAST_SOURCE,
+    });
+
+    expect(onShow).toHaveBeenCalledWith(
+      expect.objectContaining({
+        message: "Added to queue",
+        timeout: DEFAULT_TOAST_TIMEOUT,
+      }),
+      expect.any(Function)
+    );
+
+    jest.advanceTimersByTime(DEFAULT_TOAST_TIMEOUT);
+
+    expect(onHide).toHaveBeenCalledTimes(1);
+  });
+
+  it("keeps non-confirmation toasts until dismissed when timeout is omitted", () => {
+    const onShow = jest.fn();
+    const onHide = jest.fn();
+    on(NOTIFICATION_TOAST_EVENTS.SHOW, onShow);
+    on(NOTIFICATION_TOAST_EVENTS.HIDE, onHide);
+
+    notificationToastManager.showToast({
+      message: "Sticky toast",
+    });
+
+    expect(onShow).toHaveBeenCalledWith(
+      expect.objectContaining({
+        message: "Sticky toast",
+        timeout: undefined,
+      }),
+      expect.any(Function)
+    );
+
+    jest.advanceTimersByTime(DEFAULT_TOAST_TIMEOUT * 5);
+
+    expect(onHide).not.toHaveBeenCalled();
+
+    notificationToastManager.dismiss();
+
+    expect(onHide).toHaveBeenCalledTimes(1);
+  });
 });

package/App/NotificationToastRenderer/__tests__/NotificationToastRenderer.test.tsx

@@ -1,16 +1,68 @@
 import React from "react";
 import { Text } from "react-native";
-import { act, fireEvent } from "@testing-library/react-native";
-import { renderWithProviders } from "@applicaster/zapp-react-native-utils/testUtils";
-
-import { notificationToastManager } from "../NotificationToastManager";
+import { act, fireEvent, render } from "@testing-library/react-native";
+import { State } from "react-native-gesture-handler";
+import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
+
+import {
+  CONFIRMATION_TOAST_SOURCE,
+  notificationToastManager,
+} from "../NotificationToastManager";
 import { NotificationToastRenderer } from "../NotificationToastRenderer";
 
 jest.mock("react-native-safe-area-context", () => ({
-  ...jest.requireActual("react-native-safe-area-context"),
   useSafeAreaInsets: () => ({ top: 44 }),
 }));
 
+jest.mock("@applicaster/zapp-react-native-utils/theme", () => ({
+  useTheme: jest.fn(),
+}));
+
+jest.mock("react-native-gesture-handler", () => {
+  const RN = require("react-native");
+  const ReactActual = require("react");
+  const actual = jest.requireActual("react-native-gesture-handler");
+
+  const FlingGestureHandler = ReactActual.forwardRef(
+    (
+      { children, onHandlerStateChange, enabled, direction, ...rest }: any,
+      ref: any
+    ) => (
+      <RN.View
+        ref={ref}
+        testID="NotificationToastRenderer-fling-handler"
+        accessibilityState={{ disabled: !enabled }}
+        direction={direction}
+        {...rest}
+        onHandlerStateChange={onHandlerStateChange}
+      >
+        {children}
+      </RN.View>
+    )
+  );
+
+  return {
+    __esModule: true,
+    ...actual,
+    FlingGestureHandler,
+  };
+});
+
+const mockedUseTheme = useTheme as jest.MockedFunction<typeof useTheme>;
+
+const confirmationTheme: Partial<BaseThemePropertiesMobile> = {
+  confirmation_toast_style_background_color: "#0188FF",
+  confirmation_toast_style_color: "#EFEFEF",
+  confirmation_toast_style_ios_font_family: "SFProText-Semibold",
+  confirmation_toast_style_android_font_family: "Roboto-Medium",
+  confirmation_toast_style_ios_font_size: 14,
+  confirmation_toast_style_android_font_size: 14,
+  confirmation_toast_style_ios_line_height: 44,
+  confirmation_toast_style_android_line_height: 44,
+  confirmation_toast_style_ios_letter_spacing: -1.4,
+  confirmation_toast_style_android_letter_spacing: -1.4,
+};
+
 describe("NotificationToastRenderer", () => {
   beforeAll(() => {
     jest.spyOn(console, "log").mockImplementation(() => {});
@@ -20,6 +72,12 @@ describe("NotificationToastRenderer", () => {
     (console.log as jest.Mock).mockRestore();
   });
 
+  beforeEach(() => {
+    mockedUseTheme.mockReturnValue(
+      confirmationTheme as BaseThemePropertiesMobile
+    );
+  });
+
   afterEach(() => {
     // drain whatever is left showing/queued so the next test starts clean
     for (let i = 0; i < 10; i++) {
@@ -31,7 +89,7 @@ describe("NotificationToastRenderer", () => {
   });
 
   it("renders its children", () => {
-    const { getByText } = renderWithProviders(
+    const { getByText } = render(
       <NotificationToastRenderer>
         <Text>child content</Text>
       </NotificationToastRenderer>
@@ -41,7 +99,7 @@ describe("NotificationToastRenderer", () => {
   });
 
   it("shows no message before any toast is emitted", () => {
-    const { getByTestId } = renderWithProviders(<NotificationToastRenderer />);
+    const { getByTestId } = render(<NotificationToastRenderer />);
 
     expect(
       getByTestId("NotificationToastRenderer-message").props.children
@@ -49,7 +107,7 @@ describe("NotificationToastRenderer", () => {
   });
 
   it("displays the message from a toast emitted by the manager", () => {
-    const { getByTestId } = renderWithProviders(<NotificationToastRenderer />);
+    const { getByTestId } = render(<NotificationToastRenderer />);
 
     act(() => {
       notificationToastManager.showToast({ message: "You are offline" });
@@ -61,7 +119,7 @@ describe("NotificationToastRenderer", () => {
   });
 
   it("applies the toast's style to the message text", () => {
-    const { getByTestId } = renderWithProviders(<NotificationToastRenderer />);
+    const { getByTestId } = render(<NotificationToastRenderer />);
 
     act(() => {
       notificationToastManager.showToast({
@@ -75,13 +133,116 @@ describe("NotificationToastRenderer", () => {
     ).toEqual(expect.objectContaining({ color: "#123456", fontSize: 20 }));
   });
 
-  it("dismisses the toast when the touchable area is pressed", () => {
+  it("applies Theme confirmation styles when source is confirmation", () => {
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    act(() => {
+      notificationToastManager.showToast({
+        message: "Added to queue",
+        source: CONFIRMATION_TOAST_SOURCE,
+      });
+    });
+
+    expect(
+      getByTestId("NotificationToastRenderer-message").props.style
+    ).toEqual(
+      expect.objectContaining({
+        color: "#EFEFEF",
+        fontSize: 14,
+        lineHeight: 44,
+        letterSpacing: -1.4,
+      })
+    );
+  });
+
+  it("shallow-merges style overrides onto Theme confirmation defaults", () => {
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    act(() => {
+      notificationToastManager.showToast({
+        message: "Playlist created",
+        source: CONFIRMATION_TOAST_SOURCE,
+        style: { backgroundColor: "#00FF00", fontSize: 20 },
+      });
+    });
+
+    expect(
+      getByTestId("NotificationToastRenderer-message").props.style
+    ).toEqual(
+      expect.objectContaining({
+        color: "#EFEFEF",
+        fontSize: 20,
+        lineHeight: 44,
+      })
+    );
+  });
+
+  it("does not apply Theme confirmation styles for non-confirmation toasts", () => {
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    act(() => {
+      notificationToastManager.showToast({
+        message: "You are offline",
+        style: { color: "#abcdef" },
+      });
+    });
+
+    expect(
+      getByTestId("NotificationToastRenderer-message").props.style
+    ).toEqual(
+      expect.objectContaining({
+        color: "#abcdef",
+      })
+    );
+
+    expect(
+      getByTestId("NotificationToastRenderer-message").props.style.fontSize
+    ).toBeUndefined();
+  });
+
+  it("dismisses the toast on an upward fling", () => {
     const dismissSpy = jest.spyOn(notificationToastManager, "dismiss");
 
-    const { getByTestId } = renderWithProviders(<NotificationToastRenderer />);
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    act(() => {
+      notificationToastManager.showToast({ message: "Added to queue" });
+    });
+
+    fireEvent(
+      getByTestId("NotificationToastRenderer-fling-handler"),
+      "handlerStateChange",
+      { nativeEvent: { oldState: State.ACTIVE, state: State.END } }
+    );
+
+    expect(dismissSpy).toHaveBeenCalled();
+  });
+
+  it("dismisses the toast when the toast area is pressed", () => {
+    const dismissSpy = jest.spyOn(notificationToastManager, "dismiss");
+
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    act(() => {
+      notificationToastManager.showToast({ message: "Added to queue" });
+    });
 
     fireEvent.press(getByTestId("NotificationToastRenderer-touchable"));
 
     expect(dismissSpy).toHaveBeenCalled();
   });
+
+  it("does not dismiss when the fling handler is not active", () => {
+    const dismissSpy = jest.spyOn(notificationToastManager, "dismiss");
+
+    const { getByTestId } = render(<NotificationToastRenderer />);
+
+    fireEvent(
+      getByTestId("NotificationToastRenderer-fling-handler"),
+      "handlerStateChange",
+      { nativeEvent: { oldState: State.BEGAN, state: State.FAILED } }
+    );
+
+    expect(dismissSpy).not.toHaveBeenCalled();
+  });
 });

package/App/NotificationToastRenderer/__tests__/resolveConfirmationToastStyle.test.ts

@@ -0,0 +1,118 @@
+import { resolveConfirmationToastStyle } from "../resolveConfirmationToastStyle";
+
+jest.mock("@applicaster/zapp-react-native-utils/reactUtils", () => ({
+  // manifestKeyParser captures currentPlatform at module load from this map
+  platformSelect: jest.fn((platforms) => {
+    if (platforms?.ios === "ios" && platforms?.android === "android") {
+      return "ios";
+    }
+
+    return platforms?.default;
+  }),
+}));
+
+describe("resolveConfirmationToastStyle", () => {
+  const theme = {
+    confirmation_toast_style_background_color: "#0188FF",
+    confirmation_toast_style_color: "#EFEFEF",
+    confirmation_toast_style_ios_font_family: "SFProText-Semibold",
+    confirmation_toast_style_android_font_family: "Roboto-Medium",
+    confirmation_toast_style_ios_font_size: 14,
+    confirmation_toast_style_android_font_size: 16,
+    confirmation_toast_style_ios_line_height: 44,
+    confirmation_toast_style_android_line_height: 40,
+    confirmation_toast_style_ios_letter_spacing: -1.4,
+    confirmation_toast_style_android_letter_spacing: -0.5,
+  };
+
+  it("maps Theme confirmation_toast_style_* keys via getAllSpecificStyles (iOS platform)", () => {
+    expect(resolveConfirmationToastStyle(theme)).toEqual({
+      backgroundColor: "#0188FF",
+      color: "#EFEFEF",
+      fontFamily: "SFProText-Semibold",
+      fontSize: 14,
+      lineHeight: 44,
+      letterSpacing: -1.4,
+    });
+  });
+
+  it("ignores other-platform keys for the current platform", () => {
+    const result = resolveConfirmationToastStyle(theme);
+
+    expect(result.fontFamily).toBe("SFProText-Semibold");
+    expect(result.fontSize).toBe(14);
+
+    expect(result).not.toEqual(
+      expect.objectContaining({
+        fontFamily: "Roboto-Medium",
+        fontSize: 16,
+      })
+    );
+  });
+
+  it("shallow-merges override style on top of Theme defaults", () => {
+    expect(
+      resolveConfirmationToastStyle(theme, {
+        backgroundColor: "#00FF00",
+        fontSize: 20,
+      })
+    ).toEqual({
+      backgroundColor: "#00FF00",
+      color: "#EFEFEF",
+      fontFamily: "SFProText-Semibold",
+      fontSize: 20,
+      lineHeight: 44,
+      letterSpacing: -1.4,
+    });
+  });
+
+  it("returns override fields when Theme is missing", () => {
+    expect(resolveConfirmationToastStyle(undefined, { color: "#fff" })).toEqual(
+      {
+        color: "#fff",
+      }
+    );
+  });
+});
+
+describe("resolveConfirmationToastStyle (android platform)", () => {
+  it("maps android platform Theme keys", () => {
+    jest.resetModules();
+
+    jest.doMock("@applicaster/zapp-react-native-utils/reactUtils", () => ({
+      platformSelect: jest.fn((platforms) => {
+        if (platforms?.ios === "ios" && platforms?.android === "android") {
+          return "android";
+        }
+
+        return platforms?.default;
+      }),
+    }));
+
+    const {
+      resolveConfirmationToastStyle: resolveAndroid,
+    } = require("../resolveConfirmationToastStyle");
+
+    const theme = {
+      confirmation_toast_style_background_color: "#0188FF",
+      confirmation_toast_style_color: "#EFEFEF",
+      confirmation_toast_style_ios_font_family: "SFProText-Semibold",
+      confirmation_toast_style_android_font_family: "Roboto-Medium",
+      confirmation_toast_style_ios_font_size: 14,
+      confirmation_toast_style_android_font_size: 16,
+      confirmation_toast_style_ios_line_height: 44,
+      confirmation_toast_style_android_line_height: 40,
+      confirmation_toast_style_ios_letter_spacing: -1.4,
+      confirmation_toast_style_android_letter_spacing: -0.5,
+    };
+
+    expect(resolveAndroid(theme)).toEqual({
+      backgroundColor: "#0188FF",
+      color: "#EFEFEF",
+      fontFamily: "Roboto-Medium",
+      fontSize: 16,
+      lineHeight: 40,
+      letterSpacing: -0.5,
+    });
+  });
+});

package/App/NotificationToastRenderer/index.tsx

@@ -1,5 +1,11 @@
 export { notificationToastManager } from "./NotificationToastManager";
 
+export type { ToastPayload, ToastStyle } from "./NotificationToastManager";
+
+export { CONFIRMATION_TOAST_SOURCE } from "./NotificationToastManager";
+
 export { NotificationToastRenderer } from "./NotificationToastRenderer";
 
 export { useNotificationHeight } from "./useNotificationHeight";
+
+export { resolveConfirmationToastStyle } from "./resolveConfirmationToastStyle";

package/App/NotificationToastRenderer/resolveConfirmationToastStyle.ts

@@ -0,0 +1,33 @@
+import { getAllSpecificStyles } from "@applicaster/zapp-react-native-utils/configurationUtils/manifestKeyParser";
+
+import { ToastStyle } from "./NotificationToastManager";
+
+const CONFIRMATION_TOAST_STYLE_COMPONENT = "confirmation_toast";
+
+/**
+ * Builds confirmation-toast style from Theme defaults via getAllSpecificStyles,
+ * then shallow-merges any caller override on top.
+ *
+ * Expected Theme keys follow:
+ * `confirmation_toast_style_[platform_]<style_name>`
+ * e.g. confirmation_toast_style_background_color,
+ *      confirmation_toast_style_ios_font_family
+ */
+export function resolveConfirmationToastStyle(
+  theme: Partial<BaseThemePropertiesMobile> | null | undefined,
+  overrideStyle?: ToastStyle | null
+): ToastStyle {
+  const outStyles: Record<string, ToastStyle> = {};
+
+  getAllSpecificStyles({
+    configuration: { ...(theme ?? {}) },
+    componentName: CONFIRMATION_TOAST_STYLE_COMPONENT,
+    subComponentName: "",
+    outStyles,
+  });
+
+  return {
+    ...outStyles.default,
+    ...overrideStyle,
+  };
+}

package/package.json

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