@applicaster/zapp-react-native-utils 15.1.21 → 15.1.22

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

@@ -2,6 +2,22 @@ import { openBottomSheetAction } from "../openBottomSheet";
 import { actionExecutor, ActionResult } from "../../ActionExecutor";
 import { modalOrchestrator } from "../../../modalState/ModalOrchestrator";
 
+jest.mock("@applicaster/zapp-pipes-v2-client", () => ({
+  PipesClientResponseHelper: jest.fn(() => ({ error: null })),
+  RequestBuilder: jest.fn(() => ({
+    setEntryContext: jest.fn().mockReturnThis(),
+    setScreenContext: jest.fn().mockReturnThis(),
+    setUrl: jest.fn().mockReturnThis(),
+    buildAxiosRequest: jest.fn().mockResolvedValue(undefined),
+    call: jest.fn().mockResolvedValue({
+      response: {
+        entry: [],
+        extensions: { dynamic_collection_options: { operations: "add" } },
+      },
+    }),
+  })),
+}));
+
 jest.mock("../../../modalState/store", () => ({
   openBottomSheetModal: jest.fn(),
 }));
@@ -165,6 +181,62 @@ describe("openBottomSheetAction inline items", () => {
     expect(menu.content.emptyMessage).toBe("Queued items will be added here");
   });
 
+  it("forwards content.operationButtons onto the menu", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        header: { title: "Playlists" },
+        content: {
+          items: [{ id: "p1", title: "Playlist 1" }],
+          operationButtons: {
+            add: {
+              title: "Create New Playlist",
+              iconURL: "https://example.com/add.png",
+            },
+          },
+        },
+      },
+    } as any);
+
+    expect(result).toBe(ActionResult.Success);
+
+    const [menu] = (modalOrchestrator.open as jest.Mock).mock.calls[0];
+
+    expect(menu.content.operationButtons).toEqual({
+      add: {
+        title: "Create New Playlist",
+        iconURL: "https://example.com/add.png",
+      },
+    });
+  });
+
+  it("preserves Add presentation when loading itemsUrl content", async () => {
+    const result = await openBottomSheetAction({
+      type: "openBottomSheet",
+      options: {
+        content: {
+          itemsUrl: "https://example.com/collections",
+          operationButtons: {
+            add: {
+              title: "Create Collection",
+              iconURL: "file:///bundled-add.png",
+            },
+          },
+        },
+      },
+    });
+
+    expect(result).toBe(ActionResult.Success);
+    const [menu] = (modalOrchestrator.open as jest.Mock).mock.calls[0];
+
+    expect(menu.content).toMatchObject({
+      operationButtons: {
+        add: { title: "Create Collection", iconURL: "file:///bundled-add.png" },
+      },
+      dynamicCollection: { operations: ["add"] },
+    });
+  });
+
   it("pushes a new sheet by default even when another sheet is already open", async () => {
     (modalOrchestrator as any).stackSize = 1;
 

package/actionsExecutor/actions/openBottomSheet.ts

@@ -290,6 +290,7 @@ export async function openBottomSheetAction(
         themePluginId,
         styleOverrides: styleOverrides ?? content?.styleOverrides,
         emptyMessage: content?.emptyMessage,
+        operationButtons: content?.operationButtons,
         context,
       },
     };

package/appUtils/playerManager/__tests__/playerDiagnostics.test.ts

@@ -0,0 +1,62 @@
+import { Player } from "../player";
+
+const entry = (id: string) => ({ id, title: id }) as unknown as ZappEntry;
+
+const makePlayer = () => {
+  const player = new Player({ playerId: "test-player" });
+  player.entry = entry("first");
+
+  return player;
+};
+
+describe("Player per-entry diagnostics", () => {
+  it("keeps the latest of onError and onVideoError, and clears it when a new entry loads", () => {
+    const player = makePlayer();
+    const second = { message: "second" };
+
+    player.onError({ message: "first" } as any);
+    player.onVideoError(second as any);
+
+    expect(player.lastError).toBe(second);
+
+    player.entry = entry("second");
+
+    expect(player.lastError).toBeNull();
+  });
+
+  it("reads the next entry without creating the overlay observer", () => {
+    const player = makePlayer();
+
+    expect(player.getPlayNextEntry()).toBeNull();
+
+    jest
+      .spyOn(player.getOverlayObservable(), "getPlayNextEntry")
+      .mockReturnValue(entry("next"));
+
+    expect(player.getPlayNextEntry()).toEqual(entry("next"));
+  });
+
+  it("keeps the content clock while a client-side ad plays", () => {
+    const player = makePlayer();
+
+    player.onVideoProgress({
+      currentTime: 300,
+      duration: 1800,
+      seekableDuration: 1800,
+    });
+
+    player.onAdBegin({});
+
+    player.onVideoProgress({
+      currentTime: 5,
+      duration: 15,
+      seekableDuration: 15,
+    });
+
+    expect(player.getPosition()).toBe(5);
+    expect(player.getDuration()).toBe(15);
+    expect(player.getContentPosition()).toBe(300);
+    expect(player.getContentDuration()).toBe(1800);
+    expect(player.getSeekableDuration()).toBe(1800);
+  });
+});

package/appUtils/playerManager/__tests__/playerToolbox.test.ts

@@ -18,6 +18,9 @@ const loadToolbox = () => {
 const player = (overrides = {}) => ({
   getSeekableDuration: () => 100,
   getContentPosition: () => 40,
+  isLive: () => false,
+  getPlayNextEntry: () => null,
+  playNextHandler: jest.fn(),
   seekTo: jest.fn(),
   ...overrides,
 });
@@ -30,7 +33,7 @@ const registeredTools = async (active) => {
   mockXray = { registerReactToolbox: mockRegister };
   await loadToolbox().registerPlayerToolbox(manager(active));
 
-  const { tools } = mockRegister.mock.calls[0][0];
+  const { tools } = mockRegister.mock.lastCall[0];
 
   return Object.fromEntries(tools.map((tool) => [tool.name, tool.handler]));
 };
@@ -87,6 +90,187 @@ describe("playerToolbox", () => {
     );
   });
 
+  describe("state", () => {
+    const playing = (overrides = {}, entry: any = { id: "e1", title: "T" }) =>
+      player({
+        playerId: "p1",
+        playerRole: "Primary",
+        getEntry: () => entry,
+        getPosition: () => 40,
+        getDuration: () => 100,
+        getContentDuration: () => 100,
+        isReadyToPlay: () => true,
+        isPlaying: () => true,
+        isBuffering: () => false,
+        isAd: () => false,
+        isLive: () => false,
+        getIsMuted: () => false,
+        ...overrides,
+      });
+
+    const state = async (overrides = {}, entry?: any) =>
+      (await registeredTools(playing(overrides, entry))).state();
+
+    it("reports inactive when nothing plays", async () => {
+      expect((await registeredTools(null)).state()).toEqual({
+        active: false,
+        casting: false,
+      });
+    });
+
+    it("keeps the existing fields and adds the content clock for a VOD", async () => {
+      expect(await state()).toEqual({
+        active: true,
+        playerId: "p1",
+        entry: { id: "e1", title: "T" },
+        position: 40,
+        duration: 100,
+        playing: true,
+        buffering: false,
+        readyToPlay: true,
+        ad: false,
+        live: false,
+        muted: false,
+        role: "Primary",
+        plugin: null,
+        engine: null,
+        casting: false,
+        seekableDuration: 100,
+        contentPosition: 40,
+        contentDuration: 100,
+        drm: null,
+        lastError: null,
+        next: null,
+      });
+    });
+
+    it("reports the content's clock next to the ad's during a client-side ad", async () => {
+      const result = await state({
+        isAd: () => true,
+        getPosition: () => 5,
+        getDuration: () => 15,
+        getContentPosition: () => 300,
+        getContentDuration: () => 1800,
+      });
+
+      expect(result).toMatchObject({
+        ad: true,
+        position: 5,
+        duration: 15,
+        contentPosition: 300,
+        contentDuration: 1800,
+      });
+    });
+
+    it("reports non-finite numbers as null", async () => {
+      expect(
+        await state({
+          getSeekableDuration: () => NaN,
+          getContentPosition: () => null,
+          getContentDuration: () => Infinity,
+        })
+      ).toMatchObject({
+        seekableDuration: null,
+        contentPosition: null,
+        contentDuration: null,
+      });
+    });
+
+    it("reports the player plugin and its web engine", async () => {
+      expect(
+        await state({
+          playerPluginId: "QuickBrickPlayerPlugin",
+          engine: "hls.js",
+        })
+      ).toMatchObject({ plugin: "QuickBrickPlayerPlugin", engine: "hls.js" });
+    });
+
+    it("lists the entry's DRM key systems, or null", async () => {
+      const drm = { widevine: { license_url: "w" }, playready: {} };
+
+      expect((await state({}, { id: "e", extensions: { drm } })).drm).toEqual([
+        "widevine",
+        "playready",
+      ]);
+
+      expect((await state({}, { id: "e", extensions: { drm: {} } })).drm).toBe(
+        null
+      );
+
+      expect((await state({}, { id: "e", extensions: {} })).drm).toBe(null);
+      expect((await state({}, null)).drm).toBe(null);
+    });
+
+    it("reports no last error as null", async () => {
+      expect((await state({ lastError: null })).lastError).toBeNull();
+    });
+  });
+
+  describe("play next", () => {
+    const nextEntry = { id: "n1", title: "Next", extensions: {} };
+
+    const stateWith = async (overrides) =>
+      (
+        await registeredTools(
+          player({
+            getEntry: () => null,
+            getPosition: () => 0,
+            getDuration: () => 0,
+            getContentDuration: () => 0,
+            isReadyToPlay: () => true,
+            isPlaying: () => true,
+            isBuffering: () => false,
+            isAd: () => false,
+            getIsMuted: () => false,
+            ...overrides,
+          })
+        )
+      ).state();
+
+    it("reports the entry Play Next would play", async () => {
+      expect(
+        (await stateWith({ getPlayNextEntry: () => nextEntry })).next
+      ).toEqual({ id: "n1", title: "Next" });
+    });
+
+    it("reports no next entry as null", async () => {
+      expect((await stateWith({})).next).toBeNull();
+    });
+
+    it("plays the next entry through the player's Play Next action", async () => {
+      const active = player({ getPlayNextEntry: () => nextEntry });
+      const tools = await registeredTools(active);
+
+      expect(tools.next()).toEqual({ id: "n1", title: "Next" });
+      expect(active.playNextHandler).toHaveBeenCalledTimes(1);
+    });
+
+    it("fails without a next entry", async () => {
+      const active = player();
+      const tools = await registeredTools(active);
+
+      expect(() => tools.next()).toThrow("No next item");
+      expect(active.playNextHandler).not.toHaveBeenCalled();
+    });
+
+    it("fails when no Play Next action is registered", async () => {
+      const tools = await registeredTools(
+        player({
+          getPlayNextEntry: () => nextEntry,
+          playNextHandler: null,
+        })
+      );
+
+      expect(() => tools.next()).toThrow("No next item");
+    });
+
+    it("fails without an active player", async () => {
+      const tools = await registeredTools(null);
+
+      expect(() => tools.next()).toThrow("No active player");
+    });
+  });
+
   it("refuses to seek a stream that is not seekable", async () => {
     const tools = await registeredTools(
       player({ getSeekableDuration: () => 0 })

package/appUtils/playerManager/player.ts

@@ -76,6 +76,12 @@ export class Player {
   private overlaysObserver?: OverlaysObserver | null;
   private entryObservable?: BehaviorSubject<ZappEntry> | null;
   private contentSubject?: BehaviorSubject<PlayerContent> | null;
+  // Read by the X-Ray `player` toolbox: the last onError/onVideoError of the current entry,
+  // and the Play Next action of the PlayerContainer showing this player.
+  public lastError: unknown = null;
+  public playNextHandler: (() => void) | null = null;
+  // The web engine the default player picked (hls.js, dash.js, shaka, video.js); null elsewhere.
+  public engine: string | null = null;
 
   protected listeners: {
     [key: string]: QuickBrickPlayer.SharedPlayerCallBacks;
@@ -89,6 +95,7 @@ export class Player {
 
   set entry(newEntry: ZappEntry | null) {
     this._entry = newEntry;
+    this.lastError = null;
     // The live entry is scoped to the entry it overlays - see
     // `OverlaysObserver.clearLiveEntry`. No-op when there is no observer,
     // which is every non-live player.
@@ -271,6 +278,10 @@ export class Player {
 
   getEntry = (): ZappEntry | null => this.entry;
 
+  /** The entry Play Next would play now; null without one. Never creates the overlay observer. */
+  getPlayNextEntry = (): ZappEntry | null =>
+    this.overlaysObserver?.getPlayNextEntry() ?? null;
+
   logState = (text, additionalParams = {}) => {
     const isSeeking = this.playerState.seekPosition !== null;
 
@@ -488,6 +499,8 @@ export class Player {
   };
 
   onVideoError = (error: Error) => {
+    this.lastError = error;
+
     this.invokeListenersUpdate({
       callbackName: SharedPlayerCallBacksKeys.OnVideoError,
       event: error,
@@ -495,6 +508,8 @@ export class Player {
   };
 
   onError = (error: Error) => {
+    this.lastError = error;
+
     this.invokeListenersUpdate({
       callbackName: SharedPlayerCallBacksKeys.OnError,
       event: error,

package/appUtils/playerManager/playerToolbox.ts

@@ -14,6 +14,12 @@ const toNumber = (value: unknown) =>
 
 const clamp = (value: number, max: number) => Math.min(Math.max(value, 0), max);
 
+/** Key systems the entry declares (widevine, playready, fairplay...). */
+const drmKeySystems = (drm: unknown) =>
+  drm && typeof drm === "object" && Object.keys(drm).length
+    ? Object.keys(drm)
+    : null;
+
 /** The range a seek can reach: the DVR window on live, the content on VOD. */
 const requireSeekable = (player: {
   getSeekableDuration: () => number | undefined;
@@ -38,14 +44,21 @@ const tools = (manager: PlayerManager): XrayToolSpec[] => {
     {
       name: "state",
       description:
-        "The active player: entry, position and duration in seconds, playing/buffering/ad/live/muted, " +
-        "role (Primary, Cell, Chromecast) and casting. active: false when nothing plays.",
+        "The active player: entry, position and duration in seconds (the ad's while an ad plays), " +
+        "playing/buffering/ad/live/muted, role (Primary, Cell, Chromecast) and casting; in seconds, " +
+        "seekableDuration and contentPosition/contentDuration (the content's, even during ads); " +
+        "drm key systems, lastError {message} and next {id, title}, each null when absent; " +
+        "plugin (player plugin id) and engine (the default player's web engine, else null). " +
+        "active: false when nothing plays.",
       handler: () => {
         const player = manager.getActivePlayer();
 
         if (!player) return { active: false, casting: manager.isCasting() };
 
         const entry = player.getEntry();
+        const seekableDuration = toNumber(player.getSeekableDuration());
+        const next = player.getPlayNextEntry();
+        const error: any = player.lastError;
 
         return {
           active: true,
@@ -61,7 +74,18 @@ const tools = (manager: PlayerManager): XrayToolSpec[] => {
           live: !!player.isLive(),
           muted: !!player.getIsMuted(),
           role: player.playerRole,
+          plugin: player.playerPluginId ?? null,
+          engine: player.engine ?? null,
           casting: manager.isCasting(),
+          seekableDuration,
+          contentPosition: toNumber(player.getContentPosition()),
+          contentDuration: toNumber(player.getContentDuration()),
+          drm: drmKeySystems(entry?.extensions?.drm),
+          lastError:
+            error == null
+              ? null
+              : { message: String(error?.message ?? error?.error ?? error) },
+          next: next ? { id: next.id, title: next.title } : null,
         };
       },
     },
@@ -83,6 +107,21 @@ const tools = (manager: PlayerManager): XrayToolSpec[] => {
         return "OK";
       },
     },
+    {
+      name: "next",
+      description:
+        "Play the next item, as the Play Next overlay does. Fails when there is none.",
+      handler: () => {
+        const player = requirePlayer();
+        const next = player.getPlayNextEntry();
+
+        if (!next || !player.playNextHandler) throw new Error("No next item");
+
+        player.playNextHandler();
+
+        return { id: next.id, title: next.title };
+      },
+    },
     {
       name: "seek",
       description:

package/configurationUtils/__tests__/modalBlocksParser.test.ts

@@ -1,4 +1,7 @@
-import { parseModalBlocksConfiguration } from "../modalBlocksParser";
+import {
+  getEmptyModalBlocksStructure,
+  parseModalBlocksConfiguration,
+} from "../modalBlocksParser";
 
 // Mock the platform selection logic so it's consistent
 jest.mock("../../reactUtils", () => ({
@@ -151,57 +154,66 @@ describe("parseModalBlocksConfiguration", () => {
     );
   });
 
-  it("should map button.create_new_playlist_asset onto leadingIcon.asset", () => {
+  it("should ignore keys that do not map to a known block sub-component", () => {
     const result = parseModalBlocksConfiguration(
       {
         "button.create_new_playlist_asset":
           "https://placehold.co/24x24/FF00FF/FFFFFF/png?text=CN",
+        "item.checkbox_asset":
+          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=CB",
+        "reorder_playlist_item.reorder_handle_asset":
+          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
       },
       "playlist-experience"
     );
 
-    expect(result.button.leadingIcon.default).toEqual(
-      expect.objectContaining({
-        asset: "https://placehold.co/24x24/FF00FF/FFFFFF/png?text=CN",
-      })
-    );
+    expect(result.button.leadingIcon.default?.asset).toBeUndefined();
+    expect(result.item.checkbox.default).toBeUndefined();
+    expect(result.item.actionButtons.default).toBeUndefined();
   });
 
-  it("should map item.checkbox_asset and checked_checkbox_asset onto item.checkbox", () => {
+  it("parses the generic button leading icon asset", () => {
     const result = parseModalBlocksConfiguration(
-      {
-        "item.checkbox_asset":
-          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=CB",
-        "item.checked_checkbox_asset":
-          "https://placehold.co/24x24/FFD60A/000000/png?text=CK",
-      },
+      { "button.leading_icon.asset": "https://example.com/add.png" },
       "playlist-experience"
     );
 
-    expect(result.item.checkbox.default).toEqual(
-      expect.objectContaining({
-        asset: "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=CB",
-        checkedAsset: "https://placehold.co/24x24/FFD60A/000000/png?text=CK",
-      })
+    expect(result.button.leadingIcon.default?.asset).toBe(
+      "https://example.com/add.png"
     );
   });
+});
 
-  it("should map reorder/remove Studio assets onto item.actionButtons", () => {
-    const result = parseModalBlocksConfiguration(
-      {
-        "reorder_playlist_item.remove_from_playlist_asset":
-          "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        "reorder_playlist_item.reorder_handle_asset":
-          "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
-      },
-      "playlist-experience"
-    );
+describe("getEmptyModalBlocksStructure", () => {
+  it("should return every block with empty containers and no state entries", () => {
+    const result = getEmptyModalBlocksStructure();
 
-    expect(result.item.actionButtons.default).toEqual(
-      expect.objectContaining({
-        removeAsset: "https://placehold.co/24x24/00FF00/000000/png?text=RM",
-        dragAsset: "https://placehold.co/24x24/FF3B30/FFFFFF/png?text=RH",
-      })
+    expect(result.header.container).toEqual({});
+    expect(result.item.background).toEqual({});
+    expect(result.button.background).toEqual({});
+    expect(result.action.background).toEqual({});
+
+    expect(result.button.leadingIcon.default).toBeUndefined();
+    expect(result.item.checkbox.default).toBeUndefined();
+    expect(result.item.actionButtons.default).toBeUndefined();
+  });
+
+  it("should return a fresh object on every call", () => {
+    const first = getEmptyModalBlocksStructure();
+    const second = getEmptyModalBlocksStructure();
+
+    expect(first).not.toBe(second);
+    expect(first.header).not.toBe(second.header);
+    expect(first).toEqual(second);
+  });
+
+  it("should be what the parser returns when config or componentName is missing", () => {
+    expect(
+      parseModalBlocksConfiguration(undefined as any, "queue_action")
+    ).toEqual(getEmptyModalBlocksStructure());
+
+    expect(parseModalBlocksConfiguration({ foo: "bar" }, "")).toEqual(
+      getEmptyModalBlocksStructure()
     );
   });
 

package/configurationUtils/modalBlocksParser.ts

@@ -60,10 +60,7 @@ export type ModalBlocksConfig = {
   };
 };
 
-export const parseModalBlocksConfiguration = (
-  configuration: Record<string, any>,
-  componentName: string
-): ModalBlocksConfig => {
+export const getEmptyModalBlocksStructure = (): ModalBlocksConfig => {
   const result: ModalBlocksConfig = {
     header: {
       container: {},
@@ -118,6 +115,15 @@ export const parseModalBlocksConfiguration = (
     },
   };
 
+  return result;
+};
+
+export const parseModalBlocksConfiguration = (
+  configuration: Record<string, any>,
+  componentName: string
+): ModalBlocksConfig => {
+  const result = getEmptyModalBlocksStructure();
+
   if (!configuration || !componentName) {
     return result;
   }
@@ -242,107 +248,5 @@ export const parseModalBlocksConfiguration = (
 
   assignLeafAsset(result.item, "item.reorder_handle_asset", "dragAsset");
 
-  // Playlist-experience Studio keys live in this shared parser because modal
-  // blocks are themed by themePluginId. Gate them so other plugins are not
-  // affected by playlist-only asset names.
-  const isPlaylistExperience =
-    normalizedComponentName === "playlist_experience";
-
-  // Studio uploads Create New icon as button.create_new_playlist_asset (not
-  // button.leading_icon.asset). Map it onto leadingIcon so AudioPlayerButton
-  // can override the hardcoded action-type asset.
-  const createNewPlaylistAsset = isPlaylistExperience
-    ? configuration["button.create_new_playlist_asset"] ||
-      configuration[
-        `${normalizedComponentName}_button_create_new_playlist_asset`
-      ]
-    : undefined;
-
-  if (createNewPlaylistAsset) {
-    if (!result.button.leadingIcon.default) {
-      result.button.leadingIcon.default = {};
-    }
-
-    result.button.leadingIcon.default.asset = createNewPlaylistAsset;
-  }
-
-  // Studio checkbox assets are top-level item.* keys (not a parseBlock
-  // sub-component). Map onto item.checkbox so multiSelect can render them.
-  const checkboxAsset =
-    configuration["item.checkbox_asset"] ||
-    configuration[`${normalizedComponentName}_item_checkbox_asset`];
-
-  const checkedCheckboxAsset =
-    configuration["item.checked_checkbox_asset"] ||
-    configuration[`${normalizedComponentName}_item_checked_checkbox_asset`];
-
-  if (checkboxAsset || checkedCheckboxAsset) {
-    if (!result.item.checkbox.default) {
-      result.item.checkbox.default = {};
-    }
-
-    if (checkboxAsset) {
-      result.item.checkbox.default.asset = checkboxAsset;
-    }
-
-    if (checkedCheckboxAsset) {
-      result.item.checkbox.default.checkedAsset = checkedCheckboxAsset;
-    }
-  }
-
-  // Edit Order row icons: prefer reorder_playlist_item.*, then flavor1, then
-  // flavor2 playlist_experience_assets_* (playlist-experience theme only).
-  const removeAsset = isPlaylistExperience
-    ? configuration["reorder_playlist_item.remove_from_playlist_asset"] ||
-      configuration[
-        `${normalizedComponentName}_reorder_playlist_item_remove_from_playlist_asset`
-      ] ||
-      configuration[
-        "playlist_experience_assets_flavor1.remove_from_playlist_asset"
-      ] ||
-      configuration[
-        `${normalizedComponentName}_assets_flavor1_remove_from_playlist_asset`
-      ] ||
-      configuration[
-        "playlist_experience_assets_flavor2.remove_from_playlist_asset"
-      ] ||
-      configuration[
-        `${normalizedComponentName}_assets_flavor2_remove_from_playlist_asset`
-      ]
-    : undefined;
-
-  const dragAsset = isPlaylistExperience
-    ? configuration["reorder_playlist_item.reorder_handle_asset"] ||
-      configuration[
-        `${normalizedComponentName}_reorder_playlist_item_reorder_handle_asset`
-      ] ||
-      configuration[
-        "playlist_experience_assets_flavor1.reorder_handle_asset"
-      ] ||
-      configuration[
-        `${normalizedComponentName}_assets_flavor1_reorder_handle_asset`
-      ] ||
-      configuration[
-        "playlist_experience_assets_flavor2.reorder_handle_asset"
-      ] ||
-      configuration[
-        `${normalizedComponentName}_assets_flavor2_reorder_handle_asset`
-      ]
-    : undefined;
-
-  if (removeAsset || dragAsset) {
-    if (!result.item.actionButtons.default) {
-      result.item.actionButtons.default = {};
-    }
-
-    if (removeAsset) {
-      result.item.actionButtons.default.removeAsset = removeAsset;
-    }
-
-    if (dragAsset) {
-      result.item.actionButtons.default.dragAsset = dragAsset;
-    }
-  }
-
   return result;
 };

package/entryActions/__tests__/buildEntryActions.test.ts

@@ -60,7 +60,7 @@ describe("buildEntryActions - alias & label resolution", () => {
     expect(state.label).toBe("Label Property Action");
   });
 
-  it("resolves entry action with known backend button alias (e.g. add_all_to_queue)", () => {
+  it("humanizes an un-overridden alias and falls back to the placeholder asset", () => {
     const entry = {
       id: "entry-3",
       extensions: {
@@ -71,11 +71,7 @@ describe("buildEntryActions - alias & label resolution", () => {
             dismiss_on_action: true,
           },
           {
-            button: { alias: "add_to_playlist" },
-            actions: [{ type: "test" }],
-          },
-          {
-            button: { alias: "delete_collection" },
+            button: { alias: "custom_unknown_action" },
             actions: [{ type: "test" }],
           },
         ],
@@ -84,42 +80,86 @@ describe("buildEntryActions - alias & label resolution", () => {
 
     const actions = resolveEntryActions(entry as any);
 
-    expect(actions).toHaveLength(3);
+    expect(actions).toHaveLength(2);
 
+    // No built-in alias vocabulary any more: underscores become spaces and
+    // only the first letter is capitalized, so "queue" stays lowercase.
     expect(actions[0].action.initialEntryState(entry as any)).toMatchObject({
       state: 0,
-      label: "Add all to Queue",
+      label: "Add all to queue",
     });
 
     expect(actions[1].action.initialEntryState(entry as any)).toMatchObject({
       state: 0,
-      label: "Add to Playlist",
+      label: "Custom unknown action",
     });
 
-    expect(actions[2].action.initialEntryState(entry as any)).toMatchObject({
-      state: 0,
-      label: "Delete collection",
-    });
+    // The asset has no such fallback: without an override it is the red-box
+    // placeholder, so a missing Studio icon is visible rather than absent.
+    for (const action of actions) {
+      expect(action.action.initialEntryState(entry as any)).toMatchObject({
+        asset: expect.stringMatching(/^data:image\/png;base64,/),
+      });
+    }
   });
 
-  it("formats unknown alias nicely as fallback", () => {
+  it("prefers aliasPresentation overrides over the humanized fallbacks", () => {
+    const deps = {
+      actionExecutor: { handleActions: jest.fn() } as any,
+      actionContext: {},
+      aliasPresentation: {
+        labels: { add_all_to_queue: "Add all to Queue" },
+        assets: { add_all_to_queue: "http://example.com/queue.png" },
+      },
+    };
+
     const entry = {
       id: "entry-4",
       extensions: {
         entry_action: [
           {
-            button: { alias: "custom_unknown_action" },
+            button: { alias: "add_all_to_queue" },
+            actions: [{ type: "test" }],
+          },
+          {
+            button: { alias: "not_overridden" },
             actions: [{ type: "test" }],
           },
         ],
       },
     };
 
-    const actions = resolveEntryActions(entry as any);
+    const actions = buildEntryActions(entry as any, deps);
 
-    expect(actions).toHaveLength(1);
+    expect(actions[0].action.initialEntryState(entry as any)).toMatchObject({
+      label: "Add all to Queue",
+      asset: "http://example.com/queue.png",
+    });
+
+    // Overrides are per-alias, so an alias absent from the map still humanizes.
+    expect(actions[1].action.initialEntryState(entry as any)).toMatchObject({
+      label: "Not overridden",
+    });
+  });
+
+  it("returns no asset when the button has neither iconURL nor alias", () => {
+    const entry = {
+      id: "entry-5",
+      extensions: {
+        entry_action: [
+          {
+            button: { label: "Plain Label" },
+            actions: [{ type: "test" }],
+          },
+        ],
+      },
+    };
+
+    const actions = resolveEntryActions(entry as any);
     const state = actions[0].action.initialEntryState(entry as any);
-    expect(state.label).toBe("Custom unknown action");
+
+    expect(state.label).toBe("Plain Label");
+    expect(state.asset).toBeUndefined();
   });
 
   it("uses actionExecutor.getActionState for plugin-provided label and asset", () => {

package/entryActions/aliasPresentation.ts

@@ -1,52 +1,29 @@
 /**
- * Presentation defaults for backend action aliases.
+ * Presentation fallbacks for backend action aliases.
  *
  * Entries may declare an action by `alias` alone, without a label or an icon.
- * These maps are the last-resort labels/icons for the aliases we know about; an
- * unknown alias falls back to a humanized version of the alias itself.
+ * There is no built-in alias vocabulary: a label falls back to a humanized
+ * version of the alias itself, and an icon falls back to an inline placeholder
+ * that is deliberately conspicuous, so a missing asset reads as unconfigured
+ * rather than as a deliberate blank.
  *
- * They are defaults, not a framework guarantee: an app that speaks a different
- * alias vocabulary, needs other languages, or does not want to depend on these
- * icon hosts passes its own through `EntryActionDeps.aliasPresentation`.
+ * Both are last resorts, not a framework guarantee: an app that speaks its own
+ * alias vocabulary or needs other languages passes labels and assets through
+ * `EntryActionDeps.aliasPresentation`, which is consulted per alias.
  */
 
 import { EntryAction } from "./types";
 
-const ADD_TO_PLAYLIST_ICON =
-  "https://assets-secure.applicaster.com/zapp/assets/app_family/1710/906728572617/playlist_add_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.png";
-
-const REMOVE_ICON =
-  "https://assets-secure.applicaster.com/zapp/assets/app_family/1710/372097240191/remove_24dp_EA3323_FILL0_wght400_GRAD0_opsz24.png";
-
-const EDIT_ICON =
-  "https://upload.wikimedia.org/wikipedia/commons/b/b6/Edit-icon.png";
-
-/** Known backend action alias labels. */
-export const ALIAS_LABELS: Record<string, string> = {
-  add_to_playlist: "Add to Playlist",
-  add_to_queue: "Add to Queue",
-  add_all_to_queue: "Add all to Queue",
-  play_all: "Play All",
-  remove_item: "Remove item",
-  delete_collection: "Delete collection",
-  create_collection: "Create collection",
-  edit: "Edit",
-  edit_name: "Edit Name & Details",
-};
+import { createLogger } from "@applicaster/zapp-react-native-utils/logger";
 
-/** Known backend action alias image assets. */
-export const ALIAS_ASSETS: Record<string, string> = {
-  add_to_playlist: ADD_TO_PLAYLIST_ICON,
-  add_to_queue: ADD_TO_PLAYLIST_ICON,
-  add_all_to_queue: ADD_TO_PLAYLIST_ICON,
-  play_all: ADD_TO_PLAYLIST_ICON,
-  remove_item: REMOVE_ICON,
-  delete_collection: REMOVE_ICON,
-  edit: EDIT_ICON,
-  edit_name: EDIT_ICON,
-};
+const logger = createLogger({
+  category: "zapp-react-native-utils:aliasPresentation",
+});
+
+const PLACEHOLDER_RED_BOX =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAJ0lEQVR4nO3NMQEAAAjDsIF/z2ACvlRAU5NMHuvPOQAAAAAAAMBdC/07Ai5sNw+CAAAAAElFTkSuQmCC";
 
-/** Per-app overrides for the maps above. */
+/** Per-app labels and icons, keyed by alias, that outrank the fallbacks. */
 export type AliasPresentation = {
   labels?: Record<string, string>;
   assets?: Record<string, string>;
@@ -56,7 +33,7 @@ function formatAliasLabel(
   alias: string,
   overrides?: AliasPresentation
 ): string {
-  const label = overrides?.labels?.[alias] ?? ALIAS_LABELS[alias];
+  const label = overrides?.labels?.[alias];
 
   if (label) {
     return label;
@@ -107,7 +84,7 @@ export function resolveButtonLabel(
   return "";
 }
 
-/** Icon to show for an entry action: explicit iconURL, else the alias default. */
+/** Icon to show for an entry action: explicit iconURL, matching alias asset or fallback to red box. */
 export function resolveButtonAsset(
   button: EntryAction["button"],
   overrides?: AliasPresentation
@@ -120,5 +97,12 @@ export function resolveButtonAsset(
     return undefined;
   }
 
-  return overrides?.assets?.[button.alias] ?? ALIAS_ASSETS[button.alias];
+  if (!overrides?.assets?.[button.alias]) {
+    logger.log_warning(
+      `Entry action alias '${button.alias}' was not resolved by any plugin feedDecorator or app override. Falling back to placeholder red box.`,
+      { data: { button } }
+    );
+  }
+
+  return overrides?.assets?.[button.alias] ?? PLACEHOLDER_RED_BOX;
 }

package/entryActions/index.ts

@@ -1,8 +1,6 @@
 export { buildEntryActions, isEntryAction } from "./buildEntryActions";
 
 export {
-  ALIAS_ASSETS,
-  ALIAS_LABELS,
   resolveButtonAsset,
   resolveButtonLabel,
   resolveExplicitLabel,

package/modalState/ModalOrchestrator.ts

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

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

@@ -60,4 +60,27 @@ describe("ModalOrchestrator phase 3", () => {
 
     expect(props.emptyMessage).toBe("Queued items will be added here");
   });
+
+  it("forwards operationButtons onto the sheet props unchanged", () => {
+    const operationButtons = {
+      add: {
+        title: "Create New Playlist",
+        iconURL: "https://example.com/add.png",
+      },
+    };
+
+    modalOrchestrator.open({
+      header: { title: "Playlists" },
+      content: {
+        title: "Playlists",
+        items: [],
+        operationButtons,
+      },
+    });
+
+    const props = (modalStore.getState().modalState.screen as any)
+      ?.modalBottomSheetContentProps;
+
+    expect(props.operationButtons).toEqual(operationButtons);
+  });
 });

package/modalState/index.ts

@@ -23,6 +23,8 @@ export type {
   SecondaryAction,
   SelectMode,
   SelectionBehavior,
+  OperationButton,
+  OperationButtons,
 } from "./types";
 
 export {

package/modalState/types.ts

@@ -1,3 +1,5 @@
+import type { EntryAction } from "../entryActions/types";
+
 export interface Header {
   title: string;
   subtitle?: string;
@@ -107,6 +109,13 @@ export interface DynamicCollectionOptions {
   events?: Record<CollectionScopedOperation | string, Action[]>;
 }
 
+/** Presentation of a sheet-synthesized operation control; same fields as an entry action button. */
+export type OperationButton = Pick<EntryAction["button"], "title" | "iconURL">;
+
+export type OperationButtons = Partial<
+  Record<CollectionScopedOperation | string, OperationButton>
+>;
+
 export interface Content {
   title: string;
   stickyTitle?: boolean;
@@ -120,6 +129,8 @@ export interface Content {
   styleOverrides?: Record<string, any>;
   /** Shown under Next Up when the queue sheet has no upcoming items. */
   emptyMessage?: string;
+  /** Producer-owned presentation for sheet-synthesized operation controls (e.g. `add`). */
+  operationButtons?: OperationButtons;
   context?: Record<string, any>;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.1.21",
+  "version": "15.1.22",
   "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.21",
+    "@applicaster/applicaster-types": "15.1.22",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",