@applicaster/zapp-react-native-utils 15.1.15-rc.0 → 15.1.16-rc.0

package/actionsExecutor/ActionExecutor.ts

@@ -56,7 +56,6 @@ export class ActionExecutor {
     context?: ActionExecutionContext
   ): Promise<ActionResult> => {
     for (const action of actionTypes) {
-      // TODO: Handle action result error
       const result = await this.handleAction(action, context);
 
       if (result === ActionResult.Cancel) {
@@ -64,6 +63,16 @@ export class ActionExecutor {
 
         return result;
       }
+
+      if (result === ActionResult.Error) {
+        // Everything after a failed step was written for a state that never
+        // happened — the event was refused, the screen never opened — so
+        // running it is how a chain ends up telling the user their mail was
+        // sent when it was not.
+        log_error(`handleActions: action: ${action.type} failed`, { action });
+
+        return result;
+      }
     }
 
     return ActionResult.Success;

package/actionsExecutor/ActionExecutorContext.tsx

@@ -18,6 +18,7 @@ import { createLogger } from "../logger";
 import {
   appRestartAction,
   confirmDialogAction,
+  showAlertAction,
   createGoBackAction,
   createGoHomeAction,
   createNavigateToScreenAction,
@@ -109,6 +110,8 @@ const prepareDefaultActions = (actionExecutor) => {
     confirmDialogAction
   );
 
+  actionExecutor.registerAction(ACTION_TYPES.SHOW_ALERT, showAlertAction);
+
   actionExecutor.registerAction(
     ACTION_TYPES.SEND_CLOUD_EVENT,
     sendCloudEventAction

package/actionsExecutor/__tests__/ActionExecutor.test.ts

@@ -0,0 +1,71 @@
+import { ActionExecutor, ActionResult } from "../ActionExecutor";
+
+jest.mock("../../logger", () => ({
+  createLogger: () => ({
+    log_error: jest.fn(),
+    log_debug: jest.fn(),
+    log_info: jest.fn(),
+  }),
+}));
+
+describe("handleActions", () => {
+  const executor = () => {
+    const ran: string[] = [];
+    const actionExecutor = new ActionExecutor();
+
+    const register = (type: string, result?: ActionResult) =>
+      actionExecutor.registerAction(type, async () => {
+        ran.push(type);
+
+        return result as ActionResult;
+      });
+
+    register("ok", ActionResult.Success);
+    register("fails", ActionResult.Error);
+    register("cancels", ActionResult.Cancel);
+    register("recover", ActionResult.Success);
+    register("after", ActionResult.Success);
+
+    return { actionExecutor, ran };
+  };
+
+  // Everything after a failed step was written for a state that never
+  // happened: the event was refused, the screen never opened.
+  it("stops when an action fails", async () => {
+    const { actionExecutor, ran } = executor();
+
+    const result = await actionExecutor.handleActions([
+      { type: "fails" },
+      { type: "after" },
+    ]);
+
+    expect(ran).toEqual(["fails"]);
+    expect(result).toBe(ActionResult.Error);
+  });
+
+  it("still stops on a cancel", async () => {
+    const { actionExecutor, ran } = executor();
+
+    const result = await actionExecutor.handleActions([
+      { type: "cancels" },
+      { type: "after" },
+    ]);
+
+    expect(ran).toEqual(["cancels"]);
+    expect(result).toBe(ActionResult.Cancel);
+  });
+
+  // An action nobody registered never ran, which is a misconfigured feed
+  // rather than a step that failed. It is stepped over, as it always was.
+  it("steps over an action with no handler", async () => {
+    const { actionExecutor, ran } = executor();
+
+    const result = await actionExecutor.handleActions([
+      { type: "nobody-registered-this" },
+      { type: "after" },
+    ]);
+
+    expect(ran).toEqual(["after"]);
+    expect(result).toBe(ActionResult.Success);
+  });
+});

package/actionsExecutor/actions/__tests__/openBottomSheet.inlineItems.test.ts

@@ -77,6 +77,94 @@ describe("openBottomSheetAction inline items", () => {
     });
   });
 
+  it("opens an empty inline collection when dynamic collection options are present", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        header: { title: "Queue" },
+        content: {
+          items: [],
+          emptyMessage: "Queued items will be added here",
+          dynamicCollection: {
+            operations: ["remove"],
+            provider: "@{provider/queue}",
+          },
+        },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Success);
+
+    const [menu] = (modalOrchestrator.open as jest.Mock).mock.calls[0];
+
+    expect(menu.content.items).toEqual([]);
+    expect(menu.content.emptyMessage).toBe("Queued items will be added here");
+
+    expect(menu.content.dynamicCollection).toMatchObject({
+      operations: ["remove"],
+      provider: "@{provider/queue}",
+    });
+  });
+
+  it("accepts empty inline items when dynamic_collection_options live on extensions", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        content: {
+          items: [],
+          extensions: {
+            dynamic_collection_options: {
+              operations: "remove,reorder",
+              provider: "@{provider/offline}",
+            },
+          },
+        },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Success);
+
+    const [menu] = (modalOrchestrator.open as jest.Mock).mock.calls[0];
+
+    expect(menu.content.items).toEqual([]);
+
+    expect(menu.content.dynamicCollection).toMatchObject({
+      operations: ["remove", "reorder"],
+      provider: "@{provider/offline}",
+    });
+  });
+
+  it("returns an error for an empty items array with no source", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        content: { items: [] },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Error);
+    expect(modalOrchestrator.open).not.toHaveBeenCalled();
+  });
+
+  it("forwards content.emptyMessage onto the menu", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        header: { title: "Queue" },
+        content: {
+          items: [{ id: "t1", title: "Track 1" }],
+          emptyMessage: "Queued items will be added here",
+        },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Success);
+
+    const [menu] = (modalOrchestrator.open as jest.Mock).mock.calls[0];
+
+    expect(menu.content.emptyMessage).toBe("Queued items will be added here");
+  });
+
   it("pushes a new sheet by default even when another sheet is already open", async () => {
     (modalOrchestrator as any).stackSize = 1;
 

package/actionsExecutor/actions/__tests__/showAlert.test.ts

@@ -0,0 +1,49 @@
+import { showAlertAction } from "../showAlert";
+import { ActionResult } from "../../ActionExecutor";
+import { showAlertDialog } from "../../../alertUtils";
+
+jest.mock("../../../alertUtils", () => ({
+  showAlertDialog: jest.fn(),
+}));
+
+const dialog = showAlertDialog as jest.Mock;
+
+const dismiss = () => dialog.mock.calls[0][0].completion();
+
+describe("showAlert", () => {
+  beforeEach(() => dialog.mockReset());
+
+  it("shows the notice and resolves once it is dismissed", async () => {
+    const result = showAlertAction({
+      type: "showAlert",
+      options: { title: "Locked", message: "Ask the account owner." },
+    });
+
+    expect(dialog).toHaveBeenCalledWith(
+      expect.objectContaining({
+        title: "Locked",
+        message: "Ask the account owner.",
+        okButtonText: "OK",
+      })
+    );
+
+    dismiss();
+
+    // Dismissing a notice is not a cancellation: the chain carries on.
+    await expect(result).resolves.toBe(ActionResult.Success);
+  });
+
+  it("takes the dismiss label from the action", async () => {
+    const result = showAlertAction({
+      type: "showAlert",
+      options: { title: "Locked", okButtonText: "Got it" },
+    });
+
+    expect(dialog).toHaveBeenCalledWith(
+      expect.objectContaining({ okButtonText: "Got it" })
+    );
+
+    dismiss();
+    await result;
+  });
+});

package/actionsExecutor/actions/index.ts

@@ -15,6 +15,8 @@ export { appRestartAction } from "./appRestart";
 
 export { confirmDialogAction } from "./confirmDialog";
 
+export { showAlertAction } from "./showAlert";
+
 export { sendCloudEventAction } from "./sendCloudEvent";
 
 export { sessionStorageToggleFlagAction } from "./sessionStorageToggleFlag";

package/actionsExecutor/actions/openBottomSheet.ts

@@ -227,7 +227,18 @@ export async function openBottomSheetAction(
 
     let dynamicCollection: DynamicCollectionOptions | undefined;
 
-    if (Array.isArray(inlineItems) && inlineItems.length > 0) {
+    const rawDynamicCollection =
+      content?.dynamicCollection ??
+      content?.extensions?.dynamic_collection_options;
+
+    // An empty items array is a valid starting state for a provider-backed or
+    // offline collection. A sheet with neither items nor a source still errors.
+    const hasDynamicCollection = Boolean(rawDynamicCollection);
+
+    if (
+      Array.isArray(inlineItems) &&
+      (inlineItems.length > 0 || hasDynamicCollection)
+    ) {
       log_info("openBottomSheet: using inline items from action options", {
         count: inlineItems.length,
       });
@@ -239,10 +250,7 @@ export async function openBottomSheetAction(
         entryToMenuItem(entry, behavior?.currentSelection ?? [])
       );
 
-      dynamicCollection = parseDynamicCollectionOptions(
-        content?.dynamicCollection ??
-          content?.extensions?.dynamic_collection_options
-      );
+      dynamicCollection = parseDynamicCollectionOptions(rawDynamicCollection);
     } else if (itemsUrl) {
       log_info(`openBottomSheet: loading items from source: ${itemsUrl}`);
 
@@ -280,6 +288,7 @@ export async function openBottomSheetAction(
         dynamicCollection,
         themePluginId,
         styleOverrides: styleOverrides ?? content?.styleOverrides,
+        emptyMessage: content?.emptyMessage,
         context,
       },
     };

package/actionsExecutor/actions/showAlert.ts

@@ -0,0 +1,51 @@
+/// <reference types="@applicaster/applicaster-types" />
+import { showAlertDialog } from "../../alertUtils";
+import { ActionResult } from "../ActionExecutor";
+import { ActionHandler } from "../types";
+import { createLogger } from "../../logger";
+
+const { log_info } = createLogger({
+  subsystem: "ActionExecutorContext",
+  category: "General",
+});
+
+/**
+ * Options for the showAlert action.
+ */
+export interface ShowAlertOptions {
+  /** Dialog title (required) */
+  title: string;
+
+  /** Dialog message */
+  message?: string;
+
+  /** Dismiss button text. Defaults to "OK" */
+  okButtonText?: string;
+}
+
+/**
+ * Tells the user something and waits for them to acknowledge it.
+ *
+ * One button, because there is nothing to decide. Use `confirmDialog` when the
+ * user is choosing between going on and backing out; a `confirmDialog` without
+ * a cancel label still renders two buttons, the second one blank.
+ *
+ * Always resolves to Success: dismissing a notice is not a cancellation, so the
+ * rest of the chain runs.
+ */
+export const showAlertAction: ActionHandler<ShowAlertOptions> = async (
+  action
+): Promise<ActionResult> => {
+  log_info("handleAction: showAlert event");
+
+  const options = action.options as ShowAlertOptions;
+
+  return new Promise<ActionResult>((resolve) => {
+    showAlertDialog({
+      title: options?.title,
+      message: options?.message,
+      okButtonText: options?.okButtonText || "OK",
+      completion: () => resolve(ActionResult.Success),
+    });
+  });
+};

package/actionsExecutor/consts.ts

@@ -20,6 +20,7 @@ export const ACTION_TYPES = {
   SWITCH_LAYOUT: "switchLayout",
   APP_RESTART: "appRestart",
   CONFIRM_DIALOG: "confirmDialog",
+  SHOW_ALERT: "showAlert",
   SCREEN_SET_VARIABLE: "screenSetVariable",
   SCREEN_TOGGLE_FLAG: "screenToggleFlag",
 } as const;

package/appUtils/playerManager/OverlayObserver/__tests__/getUpcomingQueue.test.ts

@@ -0,0 +1,67 @@
+import { getUpcomingQueue } from "../getUpcomingQueue";
+
+describe("getUpcomingQueue", () => {
+  it("returns null when plugin is not provided or has no module", async () => {
+    expect(await getUpcomingQueue(undefined)).toBeNull();
+    expect(await getUpcomingQueue({} as any)).toBeNull();
+  });
+
+  it("returns null when QueueManager is not present on module", async () => {
+    const plugin = {
+      identifier: "queue-action",
+      module: {},
+    } as any;
+
+    expect(await getUpcomingQueue(plugin)).toBeNull();
+  });
+
+  it("calls setupQuickBrickQueue when QueueManager is not initialized", async () => {
+    const setupQuickBrickQueue = jest.fn();
+    const mockUpcoming = [{ id: "item_1" }];
+
+    const QueueManager = {
+      isInitialized: jest
+        .fn()
+        .mockReturnValueOnce(false)
+        .mockReturnValueOnce(true),
+      instance: {
+        getUpcomingQueue: jest.fn().mockResolvedValue(mockUpcoming),
+      },
+    };
+
+    const plugin = {
+      identifier: "queue-action",
+      module: {
+        QueueManager,
+        setupQuickBrickQueue,
+      },
+    } as any;
+
+    const result = await getUpcomingQueue(plugin);
+
+    expect(setupQuickBrickQueue).toHaveBeenCalled();
+    expect(result).toEqual(mockUpcoming);
+  });
+
+  it("returns upcoming items when QueueManager is already initialized", async () => {
+    const mockUpcoming = [{ id: "item_1" }, { id: "item_2" }];
+
+    const QueueManager = {
+      isInitialized: jest.fn().mockReturnValue(true),
+      instance: {
+        getUpcomingQueue: jest.fn().mockResolvedValue(mockUpcoming),
+      },
+    };
+
+    const plugin = {
+      identifier: "queue-action",
+      module: {
+        QueueManager,
+      },
+    } as any;
+
+    const result = await getUpcomingQueue(plugin);
+
+    expect(result).toEqual(mockUpcoming);
+  });
+});

package/appUtils/playerManager/OverlayObserver/getUpcomingQueue.ts

@@ -1,9 +1,22 @@
 export const getUpcomingQueue = async (
   plugin?: QuickBrickPlugin | ZappPlugin
 ): Promise<unknown[] | null> => {
-  const QueueManager = (plugin as any)?.module?.QueueManager;
+  const module = (plugin as any)?.module;
+  const QueueManager = module?.QueueManager;
+  const setupQuickBrickQueue = module?.setupQuickBrickQueue;
 
-  if (!QueueManager?.instance) {
+  if (!QueueManager) {
+    return null;
+  }
+
+  if (
+    !QueueManager.isInitialized?.() &&
+    typeof setupQuickBrickQueue === "function"
+  ) {
+    setupQuickBrickQueue();
+  }
+
+  if (!QueueManager.isInitialized?.()) {
     return null;
   }
 

package/configurationUtils/__tests__/modalBlocksParser.test.ts

@@ -205,56 +205,64 @@ describe("parseModalBlocksConfiguration", () => {
     );
   });
 
-  it("should fall back to flavor1 reorder/remove assets", () => {
+  it("should parse section_header title and action_buttons independently of header", () => {
     const result = parseModalBlocksConfiguration(
       {
-        "playlist_experience_assets_flavor1.remove_from_playlist_asset":
-          "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        "playlist_experience_assets_flavor1.reorder_handle_asset":
-          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
+        "section_header.title.font_color": "#ABCDEF",
+        "section_header.title.font_size": 13,
+        "section_header.title.ios.font_family": "SFProText-Bold",
+        "section_header.action_buttons.default.background_color":
+          "rgba(62, 62, 62, 1)",
+        "section_header.action_buttons.focus.background_color":
+          "rgba(78, 78, 78, 1)",
+        "section_header.action_buttons.default.font_color": "#FFFFFF",
+        "section_header.action_buttons.font_size": 14,
+        "section_header.action_buttons.border_radius": 16,
+        // Theme modal header — must not leak into sectionHeader
+        queue_action_style_header_title_default_fontColor: "#111111",
+        queue_action_style_header_title_default_fontSize: 22,
       },
-      "playlist-experience"
+      "queue_action"
     );
 
-    expect(result.item.actionButtons.default).toEqual(
+    expect(result.sectionHeader.title.default).toEqual(
       expect.objectContaining({
-        removeAsset: "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        dragAsset: "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
+        fontColor: "#ABCDEF",
+        fontSize: 13,
+        fontFamily: "SFProText-Bold",
       })
     );
-  });
 
-  it("should fall back to flavor2 reorder/remove assets", () => {
-    const result = parseModalBlocksConfiguration(
-      {
-        "playlist_experience_assets_flavor2.remove_from_playlist_asset":
-          "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        "playlist_experience_assets_flavor2.reorder_handle_asset":
-          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
-      },
-      "playlist-experience"
+    expect(result.sectionHeader.actionButtons.default).toEqual(
+      expect.objectContaining({
+        backgroundColor: "rgba(62, 62, 62, 1)",
+        fontColor: "#FFFFFF",
+        fontSize: 14,
+        borderRadius: 16,
+      })
     );
 
-    expect(result.item.actionButtons.default).toEqual(
+    expect(result.sectionHeader.actionButtons.focused).toEqual(
       expect.objectContaining({
-        removeAsset: "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        dragAsset: "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
+        backgroundColor: "rgba(78, 78, 78, 1)",
+      })
+    );
+
+    expect(result.header.title.default).toEqual(
+      expect.objectContaining({
+        fontColor: "#111111",
+        fontSize: 22,
       })
     );
   });
 
-  it("should ignore playlist-only asset keys for other theme plugins", () => {
+  it("should leave sectionHeader empty when keys are absent", () => {
     const result = parseModalBlocksConfiguration(
-      {
-        "button.create_new_playlist_asset":
-          "https://placehold.co/24x24/FF00FF/FFFFFF/png?text=CN",
-        "playlist_experience_assets_flavor1.reorder_handle_asset":
-          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
-      },
-      "queue-action"
+      { "item.text_label1.font_color": "#FFFFFF" },
+      "playlist-experience"
     );
 
-    expect(result.button.leadingIcon.default?.asset).toBeUndefined();
-    expect(result.item.actionButtons.default?.dragAsset).toBeUndefined();
+    expect(result.sectionHeader.title).toEqual({ default: {} });
+    expect(result.sectionHeader.actionButtons).toEqual({ default: {} });
   });
 });

package/configurationUtils/modalBlocksParser.ts

@@ -7,6 +7,14 @@ export type ModalBlocksConfig = {
     closeButton: Record<string, any>;
     actionButtons: Record<string, any>;
   };
+  /**
+   * Queue Section Header (BB Variant 3) — shared by Next in Queue / Next Up.
+   * Separate from Theme modal `header` so top-title styles do not collide.
+   */
+  sectionHeader: {
+    title: Record<string, any>;
+    actionButtons: Record<string, any>;
+  };
   action: {
     background: Record<string, any>;
     title: Record<string, any>;
@@ -63,6 +71,10 @@ export const parseModalBlocksConfiguration = (
       closeButton: {},
       actionButtons: {},
     },
+    sectionHeader: {
+      title: {},
+      actionButtons: {},
+    },
     action: {
       background: {},
       title: {},
@@ -148,6 +160,8 @@ export const parseModalBlocksConfiguration = (
     "action_buttons",
   ]);
 
+  parseBlock("section_header", ["title", "action_buttons"]);
+
   parseBlock("action", [
     "background",
     "title",

package/modalState/ModalOrchestrator.ts

@@ -44,6 +44,7 @@ function menuToModalArgs(
       title: menu.header?.title ?? menu.content.title,
       summary: menu.header?.subtitle,
       styleOverrides: menu.content.styleOverrides,
+      emptyMessage: menu.content.emptyMessage,
       onPress: onItemPress,
       viewModel,
     },

package/modalState/__tests__/ModalOrchestrator.phase3.test.ts

@@ -44,4 +44,20 @@ describe("ModalOrchestrator phase 3", () => {
     expect(props.title).toBe("Sleep Timer");
     expect(props.summary).toBe("remaining");
   });
+
+  it("forwards the queue empty message onto the sheet props", () => {
+    modalOrchestrator.open({
+      header: { title: "Queue" },
+      content: {
+        title: "Queue",
+        items: [],
+        emptyMessage: "Queued items will be added here",
+      },
+    });
+
+    const props = (modalStore.getState().modalState.screen as any)
+      ?.modalBottomSheetContentProps;
+
+    expect(props.emptyMessage).toBe("Queued items will be added here");
+  });
 });

package/modalState/types.ts

@@ -118,6 +118,8 @@ export interface Content {
   dynamicCollection?: DynamicCollectionOptions;
   themePluginId?: string;
   styleOverrides?: Record<string, any>;
+  /** Shown under Next Up when the queue sheet has no upcoming items. */
+  emptyMessage?: string;
   context?: Record<string, any>;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.1.15-rc.0",
+  "version": "15.1.16-rc.0",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,7 +27,7 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "15.1.15-rc.0",
+    "@applicaster/applicaster-types": "15.1.16-rc.0",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",