@applicaster/zapp-react-native-ui-components 16.0.0-alpha.7845362739 → 16.0.0-alpha.8101951023

package/Components/AudioPlayer/tv/__tests__/audioPlayer.test.js

@@ -1,6 +1,15 @@
 import React from "react";
 import { render } from "@testing-library/react-native";
 
+let mockContent = { title: null, summary: null };
+
+// Read lazily inside the factory: `jest.mock` is hoisted above the `let` above,
+// so capturing the value eagerly would freeze it at `undefined`.
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayerContent",
+  () => ({ usePlayerContent: () => mockContent })
+);
+
 import { AudioPlayerTV } from "..";
 
 jest.mock("@applicaster/zapp-react-native-utils/audioPlayerUtils", () => ({
@@ -51,7 +60,17 @@ const audioPlayerProps = {
 
 describe("<AudioPlayerTV />", () => {
   it("renders correctly", () => {
+    // AudioPlayerTV no longer resolves its own title/summary from
+    // audio_item - it reads them from the player manager's content channel.
+    // Publishing the same values `audio_item.title`/`.summary` used to resolve
+    // to keeps this snapshot byte-for-byte identical to before that change.
+    mockContent = {
+      title: audioPlayerProps.audio_item.title,
+      summary: audioPlayerProps.audio_item.summary,
+    };
+
     const { toJSON } = render(<AudioPlayerTV {...audioPlayerProps} />);
+
     expect(toJSON()).toMatchSnapshot();
   });
 });

package/Components/AudioPlayer/tv/__tests__/index.test.tsx

@@ -0,0 +1,120 @@
+import React from "react";
+import { render } from "@testing-library/react-native";
+
+import { AudioPlayerTV } from "..";
+
+jest.mock("@applicaster/zapp-react-native-utils/audioPlayerUtils", () => ({
+  useArtworkImage: jest.fn(() => "artwork_url"),
+}));
+
+let mockContent: {
+  title: Option<string | number>;
+  summary: Option<string | number>;
+} = { title: null, summary: null };
+
+// Read lazily inside the factory: `jest.mock` is hoisted above the `let`
+// above, so capturing the value eagerly would freeze it at `undefined`.
+jest.mock(
+  "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayerContent",
+  () => ({ usePlayerContent: () => mockContent })
+);
+
+const baseAudioItem = {
+  title: "tittle",
+  summary: "Summary",
+  content: {
+    src: "https://example.com",
+  },
+  media_group: [
+    {
+      type: "audio",
+      media_item: [
+        {
+          type: "audio",
+          src: "https://example.com",
+          key: "base_code",
+        },
+      ],
+    },
+  ],
+  extensions: {
+    audio_player_artwork_aspect_ratio: "1:1",
+    audio_player_background_image: "https://example.com",
+    audio_player_background_color: "black",
+    audio_player_channel_icon: "https://example.com",
+    audio_player_title_color: "white",
+    audio_player_summary_color: "white",
+    audio_player_rtl: true,
+    start_time: "10:10",
+    end_time: "11:11",
+    episode_name: "Episode Custom Title",
+    episode_summary: "Episode Custom Summary",
+  },
+};
+
+const basePluginConfiguration = {
+  audio_player_background_color: "black",
+  audio_player_title_color: "white",
+  audio_player_summary_color: "white",
+  audio_player_rtl: true,
+  audio_player_background_image: "https://example.com",
+  audio_player_artwork_aspect_ratio: "1:1",
+};
+
+function renderAudioPlayer(
+  plugin_configuration,
+  content: {
+    title?: Option<string | number>;
+    summary?: Option<string | number>;
+  } = {}
+) {
+  mockContent = {
+    title: content.title ?? null,
+    summary: content.summary ?? null,
+  };
+
+  return render(
+    <AudioPlayerTV
+      audio_item={baseAudioItem}
+      plugin_configuration={plugin_configuration}
+      style={{}}
+    />
+  );
+}
+
+describe("<AudioPlayerTV /> player content", () => {
+  it("renders the title and summary published by the player manager", () => {
+    const { getByText } = renderAudioPlayer(basePluginConfiguration, {
+      title: "Episode Custom Title",
+      summary: "Episode Custom Summary",
+    });
+
+    expect(getByText("Episode Custom Title")).toBeTruthy();
+    expect(getByText("Episode Custom Summary")).toBeTruthy();
+  });
+
+  it("renders nothing for title/summary when the player published neither", () => {
+    const { queryByText } = renderAudioPlayer(basePluginConfiguration);
+
+    expect(queryByText("tittle")).toBeNull();
+    expect(queryByText("Summary")).toBeNull();
+  });
+
+  it("renders blank rather than crashing when no player is active", () => {
+    // `usePlayerContent` returns `{ title: null, summary: null }` when there is
+    // no player. A regression here means AudioPlayerTV crashes instead of
+    // rendering blank.
+    mockContent = { title: null, summary: null };
+
+    const { queryByText } = render(
+      <AudioPlayerTV
+        audio_item={baseAudioItem}
+        plugin_configuration={basePluginConfiguration}
+        style={{}}
+      />
+    );
+
+    expect(queryByText("tittle")).toBeNull();
+    expect(queryByText("Summary")).toBeNull();
+  });
+});

package/Components/AudioPlayer/tv/index.tsx

@@ -3,6 +3,8 @@ import React, { useCallback, useMemo } from "react";
 import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { useArtworkImage } from "@applicaster/zapp-react-native-utils/audioPlayerUtils";
 
+import { usePlayerContent } from "@applicaster/zapp-react-native-utils/appUtils/playerManager/usePlayerContent";
+
 import { AudioPlayerTVLayout } from "./Layout";
 
 import { Channel } from "./Channel";
@@ -15,10 +17,12 @@ import { Props } from "../types";
 
 export function AudioPlayerTV(props: Props) {
   const { audio_item, plugin_configuration, style = {} } = props;
-  const { extensions, title, summary } = audio_item;
+  const { extensions } = audio_item;
 
   const artwork = useArtworkImage(audio_item);
 
+  const { title, summary } = usePlayerContent();
+
   const getProp = useCallback(
     getPropertyFromEntryOrConfig({
       entry: audio_item,

package/Components/Cell/Cell.tsx

@@ -134,7 +134,7 @@ export class CellComponent extends React.Component<Props, State> {
     }
   }
 
-  onFocus(focusable, mouse) {
+  onFocus(focusable) {
     const {
       item: { id, title },
       shouldScrollVertically,
@@ -145,10 +145,7 @@ export class CellComponent extends React.Component<Props, State> {
     if (isFocusable) {
       this.setState({ cellFocused: true });
 
-      if (
-        shouldUpdate &&
-        shouldScrollVertically?.(mouse, focusable, id, title)
-      ) {
+      if (shouldUpdate && shouldScrollVertically?.(focusable, id, title)) {
         this.scrollVertically(focusable);
       }
     }
@@ -262,7 +259,7 @@ export class CellComponent extends React.Component<Props, State> {
     const handleFocus = (focusable, mouse) => {
       const focusFn = onFocus || noop;
       focusFn(focusable, mouse);
-      this.onFocus(focusable, mouse);
+      this.onFocus(focusable);
     };
 
     if (this.state.hasFocusableInside) {

package/Components/Cell/TvOSCellComponent.tsx

@@ -228,7 +228,6 @@ class TvOSCell extends React.Component<Props, State> {
       mainOffsetUpdater?.(
         { tag: this.target },
         totalOffset,
-        null,
         groupId,
         id,
         component.id,

package/Components/GeneralContentScreen/GeneralContentScreenHookAdapter.tsx

@@ -11,6 +11,20 @@ type HookComponentProps = HookPluginProps & {
 function GeneralContentScreenHookComponent(props: HookComponentProps) {
   const { hookPlugin, focused, parentFocus } = props;
 
+  const componentsMapExtraPropsMemo = React.useMemo(
+    () => ({
+      safeArea: {
+        edges: {
+          top: "additive",
+          bottom: "additive",
+          left: "off",
+          right: "off",
+        },
+      },
+    }),
+    []
+  );
+
   if (!hookPlugin?.screen_id) {
     log_error(
       "GeneralContentScreenHookAdapter: This component should only be used as a hook, but no hookPlugin was provided."
@@ -26,6 +40,7 @@ function GeneralContentScreenHookComponent(props: HookComponentProps) {
         isScreenWrappedInContainer={false}
         focused={focused}
         parentFocus={parentFocus}
+        componentsMapExtraProps={componentsMapExtraPropsMemo}
       />
     </HookContentFocusGroup>
   );

package/Components/GeneralContentScreen/hookAdapter/__tests__/skipExpression.test.ts

@@ -0,0 +1,294 @@
+import {
+  looksLikeSkipExpression,
+  parseSkipExpression,
+  evaluateSkipExpression,
+} from "../skipExpression";
+
+jest.mock("../logger", () => ({
+  log_debug: jest.fn(),
+  log_error: jest.fn(),
+  log_info: jest.fn(),
+}));
+
+const TOKEN = "quick-brick-login-flow.access_token";
+const PROFILE = "user_account.profile";
+
+/**
+ * Stands in for `getKeyToSkipHook`: resolves a "namespace.key" store, so the
+ * expression evaluator is exercised against real lookups rather than mocks.
+ */
+const storage = (store: Record<string, unknown>) =>
+  jest.fn((key: string, namespace?: string) =>
+    Promise.resolve(store[`${namespace}.${key}`])
+  );
+
+const evaluate = (expression: unknown, store: Record<string, unknown> = {}) =>
+  evaluateSkipExpression(parseSkipExpression(expression), storage(store));
+
+describe("looksLikeSkipExpression", () => {
+  it("recognises a JSON object, whatever its content", () => {
+    expect(looksLikeSkipExpression('{"exists":"ns.key"}')).toBe(true);
+    expect(looksLikeSkipExpression('  {"exists":"ns.key"}  ')).toBe(true);
+    expect(looksLikeSkipExpression({ exists: "ns.key" })).toBe(true);
+  });
+
+  it("recognises a malformed expression, so it is never read as a key list", () => {
+    expect(looksLikeSkipExpression('{"any":')).toBe(true);
+  });
+
+  it("rejects a legacy comma-separated key list", () => {
+    expect(looksLikeSkipExpression("ns1.key1, ns2.key2")).toBe(false);
+  });
+
+  it("rejects empty and missing input", () => {
+    expect(looksLikeSkipExpression("")).toBe(false);
+    expect(looksLikeSkipExpression("   ")).toBe(false);
+    expect(looksLikeSkipExpression(undefined)).toBe(false);
+  });
+});
+
+describe("parseSkipExpression", () => {
+  it("parses a JSON string into an expression object", () => {
+    expect(parseSkipExpression('{"exists":"ns.key"}')).toEqual({
+      exists: "ns.key",
+    });
+  });
+
+  it("ignores leading and trailing whitespace around the JSON", () => {
+    expect(parseSkipExpression('  {"exists":"ns.key"}  ')).toEqual({
+      exists: "ns.key",
+    });
+  });
+
+  it("accepts an expression that is already an object", () => {
+    expect(parseSkipExpression({ exists: "ns.key" })).toEqual({
+      exists: "ns.key",
+    });
+  });
+
+  it("returns null for a legacy comma-separated key list", () => {
+    expect(parseSkipExpression("ns1.key1, ns2.key2")).toBeNull();
+  });
+
+  it("returns null for a malformed JSON object", () => {
+    expect(parseSkipExpression('{"exists":')).toBeNull();
+  });
+
+  it("returns null for empty and missing input", () => {
+    expect(parseSkipExpression("")).toBeNull();
+    expect(parseSkipExpression(undefined)).toBeNull();
+    expect(parseSkipExpression(null)).toBeNull();
+  });
+
+  it("returns null for a JSON array, which is not a valid expression", () => {
+    expect(parseSkipExpression('["ns.key"]')).toBeNull();
+  });
+});
+
+describe("evaluateSkipExpression", () => {
+  it("returns false when there is no expression", async () => {
+    await expect(evaluateSkipExpression(null, storage({}))).resolves.toBe(
+      false
+    );
+  });
+
+  describe("exists", () => {
+    it("is true when the key holds a value", async () => {
+      await expect(
+        evaluate({ exists: "ns.key" }, { "ns.key": "value" })
+      ).resolves.toBe(true);
+    });
+
+    it("is false when the key is absent", async () => {
+      await expect(evaluate({ exists: "ns.key" })).resolves.toBe(false);
+    });
+
+    it("is false when the key holds an empty string", async () => {
+      await expect(
+        evaluate({ exists: "ns.key" }, { "ns.key": "" })
+      ).resolves.toBe(false);
+    });
+
+    it("splits the namespace on the last dot, like the legacy format", async () => {
+      const readKey = storage({ "com.applicaster.feature.someKey": "value" });
+
+      await evaluateSkipExpression(
+        { exists: "com.applicaster.feature.someKey" },
+        readKey
+      );
+
+      expect(readKey).toHaveBeenCalledWith(
+        "someKey",
+        "com.applicaster.feature"
+      );
+    });
+
+    it("treats a bare string operand as a shorthand for exists", async () => {
+      await expect(
+        evaluateSkipExpression("ns.key", storage({ "ns.key": "value" }))
+      ).resolves.toBe(true);
+    });
+  });
+
+  describe("missing", () => {
+    it("is true when the key is absent", async () => {
+      await expect(evaluate({ missing: "ns.key" })).resolves.toBe(true);
+    });
+
+    it("is false when the key holds a value", async () => {
+      await expect(
+        evaluate({ missing: "ns.key" }, { "ns.key": "value" })
+      ).resolves.toBe(false);
+    });
+  });
+
+  describe("equals", () => {
+    it("is true when the stored value matches", async () => {
+      await expect(
+        evaluate(
+          { equals: { key: "ns.key", value: "kids" } },
+          { "ns.key": "kids" }
+        )
+      ).resolves.toBe(true);
+    });
+
+    it("is false when the stored value differs", async () => {
+      await expect(
+        evaluate(
+          { equals: { key: "ns.key", value: "kids" } },
+          { "ns.key": "adults" }
+        )
+      ).resolves.toBe(false);
+    });
+
+    it("compares a non-string stored value by its string form", async () => {
+      await expect(
+        evaluate({ equals: { key: "ns.key", value: "42" } }, { "ns.key": 42 })
+      ).resolves.toBe(true);
+    });
+  });
+
+  describe("all", () => {
+    it("is true only when every operand is true", async () => {
+      await expect(
+        evaluate({ all: ["ns.a", "ns.b"] }, { "ns.a": "1", "ns.b": "2" })
+      ).resolves.toBe(true);
+    });
+
+    it("is false when one operand is false", async () => {
+      await expect(
+        evaluate({ all: ["ns.a", "ns.b"] }, { "ns.a": "1" })
+      ).resolves.toBe(false);
+    });
+
+    it("stops reading storage after the first false operand", async () => {
+      const readKey = storage({ "ns.b": "2" });
+
+      await evaluateSkipExpression({ all: ["ns.a", "ns.b"] }, readKey);
+
+      expect(readKey).toHaveBeenCalledTimes(1);
+    });
+
+    it("is false for an empty operand list", async () => {
+      await expect(evaluate({ all: [] })).resolves.toBe(false);
+    });
+  });
+
+  describe("any", () => {
+    it("is true when one operand is true", async () => {
+      await expect(
+        evaluate({ any: ["ns.a", "ns.b"] }, { "ns.b": "2" })
+      ).resolves.toBe(true);
+    });
+
+    it("is false when every operand is false", async () => {
+      await expect(evaluate({ any: ["ns.a", "ns.b"] })).resolves.toBe(false);
+    });
+
+    it("stops reading storage after the first true operand", async () => {
+      const readKey = storage({ "ns.a": "1", "ns.b": "2" });
+
+      await evaluateSkipExpression({ any: ["ns.a", "ns.b"] }, readKey);
+
+      expect(readKey).toHaveBeenCalledTimes(1);
+    });
+
+    it("is false for an empty operand list", async () => {
+      await expect(evaluate({ any: [] })).resolves.toBe(false);
+    });
+  });
+
+  describe("not", () => {
+    it("inverts a true operand", async () => {
+      await expect(
+        evaluate({ not: "ns.key" }, { "ns.key": "value" })
+      ).resolves.toBe(false);
+    });
+
+    it("inverts a false operand", async () => {
+      await expect(evaluate({ not: "ns.key" })).resolves.toBe(true);
+    });
+  });
+
+  describe("malformed expressions fail open", () => {
+    it("is false for an unknown operator", async () => {
+      await expect(evaluate({ matches: "ns.key" })).resolves.toBe(false);
+    });
+
+    it("is false for an operator carrying the wrong operand type", async () => {
+      await expect(evaluate({ exists: 42 })).resolves.toBe(false);
+      await expect(evaluate({ all: "ns.key" })).resolves.toBe(false);
+    });
+
+    it("is false for an operand list holding a malformed node", async () => {
+      await expect(
+        evaluate({ all: ["ns.a", { matches: "ns.b" }] }, { "ns.a": "1" })
+      ).resolves.toBe(false);
+    });
+
+    it("is false when a storage read throws", async () => {
+      const readKey = jest.fn(() => Promise.reject(new Error("storage error")));
+
+      await expect(
+        evaluateSkipExpression({ exists: "ns.key" }, readKey)
+      ).resolves.toBe(false);
+    });
+
+    it("keeps evaluating the other operands when one storage read throws", async () => {
+      const readKey = jest.fn((key: string) =>
+        key === "a"
+          ? Promise.reject(new Error("storage error"))
+          : Promise.resolve("value")
+      );
+
+      await expect(
+        evaluateSkipExpression({ any: ["ns.a", "ns.b"] }, readKey)
+      ).resolves.toBe(true);
+    });
+  });
+
+  describe("profile selector scenario", () => {
+    const skipProfileSelector = {
+      any: [{ missing: TOKEN }, { exists: PROFILE }],
+    };
+
+    it("shows the hook to a logged-in user who has not picked a profile yet", async () => {
+      await expect(
+        evaluate(skipProfileSelector, { [TOKEN]: "a-token" })
+      ).resolves.toBe(false);
+    });
+
+    it("skips the hook for a logged-out user", async () => {
+      await expect(evaluate(skipProfileSelector)).resolves.toBe(true);
+    });
+
+    it("skips the hook once a profile has been picked", async () => {
+      await expect(
+        evaluate(skipProfileSelector, {
+          [TOKEN]: "a-token",
+          [PROFILE]: "profile-id",
+        })
+      ).resolves.toBe(true);
+    });
+  });
+});

package/Components/GeneralContentScreen/hookAdapter/__tests__/validationHelper.test.ts

@@ -122,3 +122,67 @@ describe("shouldSkipHook", () => {
     await expect(shouldSkipHook("ns1.key1, ns2.key2")).resolves.toBe(true);
   });
 });
+
+describe("shouldSkipHook with a packed expression", () => {
+  const SKIP_UNLESS_LOGGED_IN_WITHOUT_PROFILE = JSON.stringify({
+    any: [
+      { missing: "quick-brick-login-flow.access_token" },
+      { exists: "user_account.profile" },
+    ],
+  });
+
+  const storedKeys = (store: Record<string, string>) => {
+    mockSessionGetItem.mockImplementation((key, namespace) =>
+      Promise.resolve(store[`${namespace}.${key}`] ?? null)
+    );
+
+    mockLocalGetItem.mockResolvedValue(null);
+  };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    storedKeys({});
+  });
+
+  it("does not skip for a logged-in user who has not picked a profile yet", async () => {
+    storedKeys({ "quick-brick-login-flow.access_token": "a-token" });
+
+    await expect(
+      shouldSkipHook(SKIP_UNLESS_LOGGED_IN_WITHOUT_PROFILE)
+    ).resolves.toBe(false);
+  });
+
+  it("skips for a logged-out user", async () => {
+    await expect(
+      shouldSkipHook(SKIP_UNLESS_LOGGED_IN_WITHOUT_PROFILE)
+    ).resolves.toBe(true);
+  });
+
+  it("skips once a profile has been picked", async () => {
+    storedKeys({
+      "quick-brick-login-flow.access_token": "a-token",
+      "user_account.profile": "profile-id",
+    });
+
+    await expect(
+      shouldSkipHook(SKIP_UNLESS_LOGGED_IN_WITHOUT_PROFILE)
+    ).resolves.toBe(true);
+  });
+
+  it("falls back to local storage for a key the session does not hold", async () => {
+    mockLocalGetItem.mockResolvedValue("a-token");
+
+    await expect(
+      shouldSkipHook(JSON.stringify({ exists: "ns.key" }))
+    ).resolves.toBe(true);
+
+    expect(mockSessionGetItem).toHaveBeenCalledWith("key", "ns");
+    expect(mockLocalGetItem).toHaveBeenCalledWith("key", "ns");
+  });
+
+  it("returns false for a malformed expression instead of reading storage", async () => {
+    await expect(shouldSkipHook('{"any":')).resolves.toBe(false);
+    expect(mockSessionGetItem).not.toHaveBeenCalled();
+    expect(mockLocalGetItem).not.toHaveBeenCalled();
+  });
+});