@applicaster/zapp-react-native-ui-components 15.1.13-alpha.1034774223 → 15.1.13

package/Components/ModalComponent/__tests__/showTextInput.test.ts

@@ -1,95 +0,0 @@
-import {
-  actionExecutor,
-  ActionResult,
-} from "@applicaster/zapp-react-native-utils/actionsExecutor/ActionExecutor";
-import { TextInputContent } from "../TextInputContent";
-import { showTextInputAction } from "../showTextInput";
-
-jest.mock(
-  "@applicaster/zapp-react-native-utils/actionsExecutor/ActionExecutor",
-  () => ({
-    actionExecutor: {
-      handleAction: jest.fn().mockResolvedValue("success"),
-    },
-    ActionResult: { Success: "success", Error: "error" },
-  })
-);
-
-jest.mock("../TextInputContent", () => ({
-  TextInputContent: function MockTextInputContent() {
-    return null;
-  },
-}));
-
-describe("showTextInputAction", () => {
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  it("delegates to openBottomSheet with TextInputContent as body-only component", async () => {
-    const action = {
-      type: "showTextInput",
-      options: {
-        headerTitle: "Create Playlist",
-        inputLabel: "Name your playlist",
-        defaultValue: "",
-        buttonLabel: "Create",
-        actions: [
-          {
-            type: "sendCloudEvent",
-            options: {
-              url: "https://example.com/events",
-              type: "com.applicaster.collection.create.v1",
-              data: {},
-            },
-          },
-          {
-            type: "showToast",
-            options: {
-              message: "Playlist created.",
-            },
-          },
-        ],
-      },
-    };
-
-    const result = await showTextInputAction(action as any);
-
-    expect(result).toBe(ActionResult.Success);
-    expect(actionExecutor.handleAction).toHaveBeenCalledTimes(1);
-
-    expect(actionExecutor.handleAction).toHaveBeenCalledWith(
-      {
-        type: "openBottomSheet",
-        options: {
-          header: {
-            title: "Create Playlist",
-          },
-          content: {
-            component: TextInputContent,
-            props: {
-              inputLabel: "Name your playlist",
-              defaultValue: "",
-              buttonLabel: "Create",
-              actions: action.options.actions,
-            },
-          },
-        },
-      },
-      undefined
-    );
-  });
-
-  it("returns Error when required options are missing", async () => {
-    const action = {
-      type: "showTextInput",
-      options: {
-        headerTitle: "Create Playlist",
-      },
-    };
-
-    const result = await showTextInputAction(action as any);
-    expect(result).toBe(ActionResult.Error);
-    expect(actionExecutor.handleAction).not.toHaveBeenCalled();
-  });
-});

package/Components/ModalComponent/presets/__tests__/getCell.test.ts

@@ -1,66 +0,0 @@
-import { getCell } from "../index";
-import { standardCell } from "../standardCell";
-import { selectableCell } from "../selectableCell";
-import { dynamicCollectionCell } from "../dynamicCollectionCell";
-import { mapMenuItemToPlaylistData } from "../../AudioPlayer/Components/Item";
-
-describe("getCell", () => {
-  it("returns selectable cell for collection_selector", () => {
-    expect(getCell("collection_selector")).toBe(selectableCell);
-  });
-
-  it("returns selectable cell for preference_editor", () => {
-    expect(getCell("preference_editor")).toBe(selectableCell);
-  });
-
-  it("returns standard cell when role is undefined", () => {
-    expect(getCell(undefined)).toBe(standardCell);
-  });
-
-  it("returns standard cell for unknown roles", () => {
-    expect(getCell("unknown_role")).toBe(standardCell);
-  });
-
-  it("returns the dynamic collection cell for dynamic_collection", () => {
-    expect(getCell("dynamic_collection")).toBe(dynamicCollectionCell);
-  });
-
-  it("does not use behavior to select the cell family", () => {
-    expect(getCell(undefined, { selectMode: "multi" })).toBe(standardCell);
-
-    expect(getCell("collection_selector", { selectMode: "single" })).toBe(
-      selectableCell
-    );
-  });
-});
-
-describe("mapMenuItemToPlaylistData", () => {
-  const item = {
-    title: "Playlist 1",
-    summary: "5 items",
-    icon: "https://example.com/icon.png",
-  };
-
-  it("defaults to multiSelect trailing button when selectMode is multi or undefined", () => {
-    const data1 = mapMenuItemToPlaylistData(item, { selectMode: "multi" });
-    expect(data1.trailingButton).toBe("multiSelect");
-
-    const data2 = mapMenuItemToPlaylistData(item);
-    expect(data2.trailingButton).toBe("multiSelect");
-  });
-
-  it("omits trailing button when behavior selectMode is none", () => {
-    const data = mapMenuItemToPlaylistData(item, { selectMode: "none" });
-    expect(data.trailingButton).toBeUndefined();
-  });
-
-  it("omits trailing button when item trailingButton is explicitly none", () => {
-    const itemWithNone = { ...item, trailingButton: "none" };
-
-    const data = mapMenuItemToPlaylistData(itemWithNone, {
-      selectMode: "multi",
-    });
-
-    expect(data.trailingButton).toBeUndefined();
-  });
-});

package/Components/ModalComponent/presets/dynamicCollectionCell.tsx

@@ -1,78 +0,0 @@
-import React from "react";
-import {
-  AudioPlayerTrackItem,
-  VARIANT_QUEUED_ITEM,
-  ItemData,
-} from "../AudioPlayer/Components/Item";
-import type { CellRenderer, RenderItemArgs } from "./types";
-import {
-  MenuItem,
-  OPERATIONS,
-  hasOperation,
-} from "@applicaster/zapp-react-native-utils/modalState";
-
-function mapMenuItemToDynamicData(
-  item: MenuItem,
-  operations: string[]
-): ItemData {
-  const hasRemove = hasOperation(operations, OPERATIONS.REMOVE);
-  const hasReorder = hasOperation(operations, OPERATIONS.REORDER);
-
-  const title =
-    typeof item?.title === "string"
-      ? item.title
-      : item?.title != null
-        ? String(item.title)
-        : "";
-
-  const summary =
-    typeof item?.summary === "string"
-      ? item.summary.trim()
-      : item?.summary != null
-        ? String(item.summary)
-        : "";
-
-  return {
-    imageUri: item?.icon,
-    textLabel1: title,
-    textLabel2: summary,
-    leadingButton: hasRemove ? "remove" : undefined,
-    trailingButton: hasReorder ? "drag" : undefined,
-    isSelected: item?.isSelected,
-  };
-}
-
-export const dynamicCollectionCell: CellRenderer = {
-  renderItem: ({
-    item,
-    index,
-    onPress,
-    context,
-    renderHandle,
-  }: RenderItemArgs) => {
-    const { editableCollection } = context;
-    const operations = editableCollection?.operations || [];
-
-    const handleRemove = () => {
-      if (editableCollection?.remove) {
-        editableCollection.remove(index);
-      }
-    };
-
-    const handleDrag = () => {
-      // Drag is managed by SortableList drag handle context
-    };
-
-    return (
-      <AudioPlayerTrackItem
-        key={item.id}
-        configuration={VARIANT_QUEUED_ITEM}
-        data={mapMenuItemToDynamicData(item, operations)}
-        onPress={() => onPress(item)}
-        onLeadingButtonPress={handleRemove}
-        onTrailingButtonPress={handleDrag}
-        renderHandle={renderHandle}
-      />
-    );
-  },
-};

package/Components/ModalComponent/presets/index.ts

@@ -1,27 +0,0 @@
-import type { SelectionBehavior } from "@applicaster/zapp-react-native-utils/modalState";
-import { selectableCell } from "./selectableCell";
-import { standardCell } from "./standardCell";
-import type { CellRenderer } from "./types";
-
-export type { CellRenderer, RenderItemArgs, SheetRenderContext } from "./types";
-
-export { standardCell } from "./standardCell";
-
-export { selectableCell } from "./selectableCell";
-
-import { dynamicCollectionCell } from "./dynamicCollectionCell";
-
-const SELECTION_ROLES = new Set(["collection_selector", "preference_editor"]);
-
-/**
- * Resolve the row cell from feed role (+ behavior for future config only).
- * Unknown / none -> standard Button cell.
- */
-export const getCell = (
-  role?: string,
-  _behavior?: SelectionBehavior
-): CellRenderer => {
-  if (role === "dynamic_collection") return dynamicCollectionCell;
-
-  return role && SELECTION_ROLES.has(role) ? selectableCell : standardCell;
-};

package/Components/ModalComponent/presets/selectableCell.tsx

@@ -1,28 +0,0 @@
-import React from "react";
-import {
-  AudioPlayerTrackItem,
-  mapMenuItemToPlaylistData,
-  VARIANT_PLAYLIST_ITEM,
-} from "../AudioPlayer/Components/Item";
-import type { CellRenderer } from "./types";
-
-export const selectableCell: CellRenderer = {
-  renderItem: ({ item, onPress, context }) => (
-    <AudioPlayerTrackItem
-      key={item.id}
-      configuration={VARIANT_PLAYLIST_ITEM}
-      data={mapMenuItemToPlaylistData(item, context?.behavior)}
-      onPress={() => onPress(item)}
-      onTrailingButtonPress={
-        item.secondaryAction?.action
-          ? () =>
-              onPress({
-                id: `${item.id}_secondary`,
-                title: item.title,
-                action: item.secondaryAction!.action,
-              })
-          : undefined
-      }
-    />
-  ),
-};

package/Components/ModalComponent/presets/standardCell.tsx

@@ -1,41 +0,0 @@
-import React from "react";
-import type { CellRenderer } from "./types";
-
-export const standardCell: CellRenderer = {
-  renderItem: ({ item, onPress, context }) => {
-    if (!item) {
-      return null;
-    }
-
-    const {
-      theme,
-      ButtonComponent,
-      current_selection,
-      iconBaseProps,
-      itemBaseProps,
-      labelBaseProps,
-      getSelectedItemIcon,
-      getDefaultItemIcon,
-      iconPlacement,
-    } = context;
-
-    return (
-      <ButtonComponent
-        key={item.id}
-        configuration={theme}
-        selectedItem={current_selection}
-        item={item}
-        onPress={onPress}
-        label={
-          theme[(item as any)?.label] ?? ((item as any)?.label || item?.title)
-        }
-        iconBaseProps={iconBaseProps}
-        itemBaseProps={itemBaseProps}
-        labelBaseProps={labelBaseProps}
-        selectedItemIcon={getSelectedItemIcon(theme)}
-        defaultItemIcon={getDefaultItemIcon(theme)}
-        iconPlacement={iconPlacement}
-      />
-    );
-  },
-};

package/Components/ModalComponent/presets/types.ts

@@ -1,35 +0,0 @@
-import type React from "react";
-import type {
-  MenuItem,
-  SelectionBehavior,
-} from "@applicaster/zapp-react-native-utils/modalState";
-import type { EditableCollection } from "@applicaster/zapp-react-native-utils/modalState/EditableCollection";
-
-/**
- * Extra props row renderers need.
- */
-export type SheetRenderContext = {
-  theme: any;
-  ButtonComponent: React.ComponentType<any>;
-  current_selection?: any;
-  iconBaseProps: any;
-  itemBaseProps: any;
-  labelBaseProps: any;
-  getSelectedItemIcon: (theme: any) => any;
-  getDefaultItemIcon: (theme: any) => any;
-  iconPlacement?: "left" | "right";
-  editableCollection?: EditableCollection | null;
-  behavior?: SelectionBehavior;
-};
-
-export type RenderItemArgs = {
-  item: MenuItem;
-  index: number;
-  onPress: (item: MenuItem) => void;
-  context: SheetRenderContext;
-  renderHandle?: (children: React.ReactElement) => React.ReactElement;
-};
-
-export type CellRenderer = {
-  renderItem: (args: RenderItemArgs) => React.ReactNode;
-};

package/Components/ModalComponent/showTextInput.ts

@@ -1,43 +0,0 @@
-import {
-  actionExecutor,
-  ActionResult,
-} from "@applicaster/zapp-react-native-utils/actionsExecutor/ActionExecutor";
-import { TextInputContent } from "./TextInputContent";
-
-/**
- * Opens a text-input bottom sheet driven by action.options.
- * Uses openBottomSheet with content.component as body-only UI;
- * standard ModalHeader (dismiss x) is provided by ModalComponent.
- */
-export async function showTextInputAction(
-  action: ActionType,
-  context?: Record<string, any>
-): Promise<ActionResult> {
-  const { headerTitle, inputLabel, defaultValue, buttonLabel, actions } =
-    action.options || {};
-
-  if (!headerTitle || !buttonLabel || !actions || !actions.length) {
-    return ActionResult.Error;
-  }
-
-  return actionExecutor.handleAction(
-    {
-      type: "openBottomSheet",
-      options: {
-        header: {
-          title: headerTitle,
-        },
-        content: {
-          component: TextInputContent,
-          props: {
-            inputLabel,
-            defaultValue: defaultValue ?? "",
-            buttonLabel,
-            actions,
-          },
-        },
-      },
-    },
-    context
-  );
-}

package/Hooks/useEntryActionsExpander.ts

@@ -1,63 +0,0 @@
-import * as React from "react";
-
-import { ActionExecutorContext } from "@applicaster/zapp-react-native-utils/actionsExecutor/ActionExecutorContext";
-import {
-  buildEntryActions,
-  EntryActionDeps,
-} from "@applicaster/zapp-react-native-utils/entryActions";
-import { useRoute } from "@applicaster/zapp-react-native-utils/reactHooks/navigation";
-import { useScreenStateStore } from "@applicaster/zapp-react-native-utils/reactHooks/navigation/useScreenStateStore";
-import {
-  useCurrentScreenData,
-  useScreenContext,
-} from "@applicaster/zapp-react-native-utils/reactHooks/screen";
-import { RegisteredAction } from "@applicaster/zapp-react-native-utils/uiActionsRegistrator";
-
-/**
- * Expands `entry.extensions.entry_action` into invokable actions, against the
- * screen this hook is called from.
- *
- * Entry actions are data on the entry, not an installed capability, so there is
- * nothing to look up by identifier: the surface showing the entry expands them.
- * That also decides which screen they execute against — the one whose tree this
- * hook runs in, rather than whichever screen happened to be current when a
- * global provider was registered.
- *
- * Pass the result to `resolveActionIdentifiers` / `resolvePlayerActions` as
- * `expandEntryActions`.
- */
-export function useEntryActionsExpander(): (
-  entry: ZappEntry | ZappFeed
-) => RegisteredAction[] {
-  const { pathname } = useRoute();
-
-  const screenContext = useScreenContext();
-  const screenData = useCurrentScreenData();
-  const screenState = screenContext?.options;
-  const screenStateStore = useScreenStateStore();
-  const actionExecutor = React.useContext(ActionExecutorContext);
-
-  // Read through a ref so the returned expander keeps a stable identity: it
-  // feeds `useMemo` dependency lists on surfaces that re-resolve their actions
-  // on every registry change.
-  const depsRef = React.useRef<EntryActionDeps>();
-
-  depsRef.current = {
-    actionExecutor,
-    actionContext: {
-      screenData,
-      screenState,
-      screenRoute: pathname,
-      screenStateStore,
-      // From the screen context, the way `useCellClick` builds the same bag.
-      // The ZappPipes entry context is a route-keyed map, so reading `.data`
-      // off it was always undefined.
-      screenEntry: screenContext?.entry,
-    },
-  };
-
-  return React.useCallback(
-    (entry: ZappEntry | ZappFeed) => buildEntryActions(entry, depsRef.current),
-    []
-  );
-}