@applicaster/zapp-react-native-utils 15.0.0-rc.98 → 15.1.0-alpha.1852552014

package/colorUtils/index.ts

@@ -0,0 +1,50 @@
+import validateColor from "validate-color";
+import { isNil } from "@applicaster/zapp-react-native-utils/utils";
+import { isString } from "@applicaster/zapp-react-native-utils/stringUtils";
+
+const normalizeRgbaAlpha = (color: string): string => {
+  return color.replace(
+    /^rgba\(([^)]+),\s*(\d+(?:\.\d+)?)\s*\)$/i,
+    (_, rgb, alpha) => {
+      const alphaValue = parseFloat(alpha);
+
+      if (!Number.isFinite(alphaValue) || !Number.isInteger(alphaValue)) {
+        return color;
+      }
+
+      return `rgba(${rgb},${alphaValue})`;
+    }
+  );
+};
+
+export const isValidColor = (color: string): boolean => {
+  if (isNil(color) || !isString(color)) {
+    return false;
+  }
+
+  if (validateColor(color)) {
+    return true;
+  }
+
+  // validate-color rejects integer alpha values written as floats (e.g. 1.0)
+  // https://github.com/dreamyguy/validate-color/issues/44
+  const normalizedColor = normalizeRgbaAlpha(color);
+
+  return normalizedColor !== color && validateColor(normalizedColor);
+};
+
+function isRgbaAlphaZero(color: string): boolean {
+  const layers = color
+    .replace("rgba(", "")
+    .replace(")", "")
+    .split(",")
+    .map((layer) => layer.trim());
+
+  return Number(layers[3]) === 0;
+}
+
+export const isTransparentColor = (color: string): boolean => {
+  return (
+    isValidColor(color) && (color === "transparent" || isRgbaAlphaZero(color))
+  );
+};

package/configurationUtils/__tests__/manifestKeyParser.test.ts

@@ -50,7 +50,7 @@ describe("getAllSpecificStyles", () => {
       });
 
       expect(outStyles).toHaveProperty("default");
-      expect(outStyles.default).toEqual({});
+      expect(outStyles["default"]).toEqual({});
     });
 
     it("should handle empty configuration", () => {
@@ -83,7 +83,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000",
         borderWidth: 2,
       });
@@ -104,7 +104,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000",
         textSize: 16,
       });
@@ -126,7 +126,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000",
       });
     });
@@ -148,11 +148,11 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000",
       });
 
-      expect(outStyles.pressed).toEqual({
+      expect(outStyles["pressed"]).toEqual({
         backgroundColor: "#00FF00",
       });
     });
@@ -171,7 +171,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.focused).toEqual({
+      expect(outStyles["focused"]).toEqual({
         borderWidth: 3,
       });
     });
@@ -190,7 +190,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.selected).toEqual({
+      expect(outStyles["selected"]).toEqual({
         opacity: 0.5,
       });
     });
@@ -209,7 +209,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.focused_selected).toEqual({
+      expect(outStyles["focused_selected"]).toEqual({
         scale: 1.2,
       });
     });
@@ -232,21 +232,21 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000",
         borderWidth: 1,
         opacity: 1,
       });
 
       // Pressed should have default styles merged with its specific override
-      expect(outStyles.pressed).toEqual({
+      expect(outStyles["pressed"]).toEqual({
         backgroundColor: "#00FF00", // Override
         borderWidth: 1, // From default
         opacity: 1, // From default
       });
 
       // Focused should have default styles merged with its specific override
-      expect(outStyles.focused).toEqual({
+      expect(outStyles["focused"]).toEqual({
         backgroundColor: "#FF0000", // From default
         borderWidth: 1, // From default
         opacity: 0.8, // Override
@@ -270,7 +270,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.pressed).toEqual({
+      expect(outStyles["pressed"]).toEqual({
         existingKey: "existingValue", // Should be preserved
         backgroundColor: "#FF0000", // From default
         textColor: "#FFFFFF", // New pressed style
@@ -294,7 +294,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FF0000", // Samsung-specific should be included
       });
     });
@@ -317,7 +317,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FFFFFF", // Only non-platform specific
       });
     });
@@ -336,7 +336,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         color: "#FF0000",
       });
     });
@@ -356,7 +356,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.pressed).toEqual({
+      expect(outStyles["pressed"]).toEqual({
         backgroundColor: "#FF0000", // Only samsung style
       });
     });
@@ -377,7 +377,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#00FF00", // Samsung-specific should win
       });
     });
@@ -412,14 +412,14 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         backgroundColor: "#FFFFFF",
         textColor: "#000000",
         borderWidth: 1,
         padding: 10,
       });
 
-      expect(outStyles.pressed).toEqual({
+      expect(outStyles["pressed"]).toEqual({
         backgroundColor: "#EEEEEE",
         textColor: "#000000",
         borderWidth: 1,
@@ -427,7 +427,7 @@ describe("getAllSpecificStyles", () => {
         opacity: 0.8,
       });
 
-      expect(outStyles.focused).toEqual({
+      expect(outStyles["focused"]).toEqual({
         backgroundColor: "#FFFFFF",
         textColor: "#000000",
         borderWidth: 1,
@@ -453,7 +453,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         validKey: "included",
       });
     });
@@ -474,11 +474,11 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.focused_selected).toEqual({
+      expect(outStyles["focused_selected"]).toEqual({
         test: "focused_selected_value",
       });
 
-      expect(outStyles.focused).toEqual({
+      expect(outStyles["focused"]).toEqual({
         another: "focused_value",
       });
     });
@@ -517,7 +517,7 @@ describe("getAllSpecificStyles", () => {
         outStyles,
       });
 
-      expect(outStyles.pressed.backgroundColor).toBe("#222222");
+      expect(outStyles["pressed"]["backgroundColor"]).toBe("#222222");
     });
 
     it("should handle frozen outStyles properties", () => {
@@ -537,7 +537,7 @@ describe("getAllSpecificStyles", () => {
       });
 
       // Should create new object instead of mutating frozen one
-      expect(outStyles.default).toEqual({
+      expect(outStyles["default"]).toEqual({
         existingProp: "value",
         backgroundColor: "#FF0000",
       });

package/dateUtils/__tests__/dayjs.test.ts

@@ -1,7 +1,4 @@
 import { dayjs } from "../index";
-import customParseFormat from "dayjs/plugin/customParseFormat";
-
-dayjs.extend(customParseFormat);
 
 describe("dayjs", () => {
   describe("basic functionality", () => {

package/dateUtils/index.ts

@@ -4,12 +4,14 @@ import timezone from "dayjs/plugin/timezone";
 import isoWeek from "dayjs/plugin/isoWeek";
 import duration from "dayjs/plugin/duration";
 import relativeTime from "dayjs/plugin/relativeTime";
+import customParseFormat from "dayjs/plugin/customParseFormat";
 
 // Extend dayjs with plugins
 dayjs.extend(utc);
 dayjs.extend(timezone);
 dayjs.extend(isoWeek);
 dayjs.extend(duration);
+dayjs.extend(customParseFormat);
 
 dayjs.extend(relativeTime, {
   thresholds: [

package/focusManager/aux/index.ts

@@ -49,7 +49,7 @@ export const findSelectedMenuId = (
 ) => {
   const sectionName = QUICK_BRICK_NAVBAR_SECTIONS[sectionKey];
 
-  return pathOr<string | undefined>(
+  return pathOr(
     undefined,
     ["children", index, "id"],
     focusableTree.find(sectionName)

package/headersUtils/__tests__/headersUtils.test.js

@@ -1,15 +1,6 @@
 import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
 import { getAppDataHeaders } from "../index";
 
-const mockUILanguage = "en-US";
-
-jest.mock(
-  "@applicaster/zapp-react-native-utils/appUtils/localizationsHelper",
-  () => ({
-    getUILanguage: jest.fn(() => mockUILanguage),
-  })
-);
-
 describe("getAppDataHeaders", () => {
   const mockAppData = {
     riversConfigurationId: "test-layout",
@@ -34,7 +25,7 @@ describe("getAppDataHeaders", () => {
     const expectedHeaders = {
       "x-applicaster-layout-id": mockAppData.riversConfigurationId,
       "x-applicaster-screen-id": screenId,
-      "x-applicaster-language-code": mockUILanguage,
+      "x-applicaster-language-code": mockAppData.languageCode,
       "x-applicaster-version-number": mockAppData.version_name,
       "x-applicaster-platform": mockAppData.platform,
       "x-applicaster-country-code": mockAppData.countryCode,
@@ -42,7 +33,6 @@ describe("getAppDataHeaders", () => {
         mockAppData.signedDeviceInfoToken,
       "x-applicaster-device-make": mockAppData.deviceMake,
       "x-applicaster-device-model": mockAppData.deviceModel,
-      "x-applicaster-uuid": undefined,
     };
 
     const headers = getAppDataHeaders(screenId);

package/headersUtils/index.ts

@@ -1,7 +1,6 @@
 import { appStore } from "@applicaster/zapp-react-native-redux/AppStore";
 import { getPlatform } from "@applicaster/zapp-react-native-utils/reactUtils";
 import { utilsLogger } from "../logger";
-import { getUILanguage } from "../localizationUtils";
 
 const logger = utilsLogger.addSubsystem("headersUtils");
 
@@ -22,7 +21,7 @@ export const getAppDataHeaders = (screenId: string) => {
     "x-applicaster-layout-id":
       appData.riversConfigurationId || appData.rivers_configuration_id,
     "x-applicaster-screen-id": screenId,
-    "x-applicaster-language-code": getUILanguage(),
+    "x-applicaster-language-code": appData.languageCode,
     "x-applicaster-version-number": appData.version_name || appData.versionName,
     "x-applicaster-platform": (platform || appData.platform).toLowerCase(),
     "x-applicaster-country-code": appData.countryCode,

package/manifestUtils/defaultManifestConfigurations/player.js

@@ -123,6 +123,12 @@ function getPlayerConfiguration({ platform, version }) {
         key: "skip_button_localization_text_skip_intro",
         initial_value: "Skip Intro",
       },
+      {
+        type: "text_input",
+        label: "Stream error message",
+        key: "stream_error_message",
+        initial_value: "Cannot play stream",
+      },
       {
         type: "text_input",
         label: "Locked message",
@@ -364,20 +370,6 @@ function getPlayerConfiguration({ platform, version }) {
   };
 
   if (isTV(platform)) {
-    localizations.fields.push({
-      key: "back_to_live_label",
-      label: "Back to live label",
-      initial_value: "Back To Live",
-      type: "text_input",
-    });
-
-    localizations.fields.push({
-      key: "start_over_label",
-      label: "Start over label",
-      initial_value: "Start Over",
-      type: "text_input",
-    });
-
     styles.fields.push(
       fieldsGroup("Always Show Scrub Bar & Timestamp", "", [
         {
@@ -490,7 +482,7 @@ function getPlayerConfiguration({ platform, version }) {
       ),
       fieldsGroup(
         "Skip Button",
-        "This section allows you to configure the skip button behaviour",
+        "This section allows you to configure the skip button styles for tv",
         [
           {
             type: "switch",
@@ -507,12 +499,6 @@ function getPlayerConfiguration({ platform, version }) {
             label: "Persistent Button Toggle",
             initial_value: true,
           },
-        ]
-      ),
-      fieldsGroup(
-        "Labeled Button Style",
-        "This section allows you to configure the labeled button styles",
-        [
           {
             type: "color_picker_rgba",
             label_tooltip: "",
@@ -668,61 +654,7 @@ function getPlayerConfiguration({ platform, version }) {
     );
   }
 
-  if (isTV(platform)) {
-    general.fields.push(
-      {
-        key: "liveSeekingEnabled",
-        label: "Live Seeking Enabled",
-        initial_value: false,
-        type: "switch",
-        label_tooltip: "Enable Live Seek",
-      },
-      {
-        key: "minimumAllowedSeekableDurationInSeconds",
-        label: "Minimum allowed seekable duration in seconds",
-        initial_value: 300,
-        type: "number_input",
-        label_tooltip:
-          "If duration less than this value, player will disable 'liveSeekingEnabled' value",
-      },
-      {
-        key: "live_image",
-        label: "Live badge",
-        type: "uploader",
-        label_tooltip: "Override default live badge / icon",
-      },
-      {
-        key: "live_width",
-        label: "Live badge width",
-        type: "number_input",
-        initial_value: 85,
-      },
-      {
-        key: "live_height",
-        label: "Live badge height",
-        type: "number_input",
-        initial_value: 50,
-      }
-    );
-  }
-
   if (isMobile(platform)) {
-    localizations.fields.push(
-      {
-        type: "text_input",
-        label: "Restrict playback on mobile networks alert title",
-        key: "mobile_connection_restricted_alert_title",
-        initial_value: "Restricted Connection Type",
-      },
-      {
-        type: "text_input",
-        label: "Restrict playback on mobile networks alert message",
-        key: "mobile_connection_restricted_alert_message",
-        initial_value:
-          "This content can only be viewed over a Wi-Fi or LAN network.",
-      }
-    );
-
     general.fields.push(
       {
         section: "Default Timestamp Type",

package/manifestUtils/keys.js

@@ -43,6 +43,7 @@ const TV_PLATFORMS = [
   "tvos_for_quickbrick",
   "samsung_tv",
   "lg_tv",
+  "vidaa",
   "vizio",
 ];
 

package/manifestUtils/platformIsTV.js

@@ -0,0 +1,14 @@
+function platformIsTV(platform) {
+  return [
+    "tvos_for_quickbrick",
+    "android_tv_for_quickbrick",
+    "amazon_fire_tv_for_quickbrick",
+    "lg_tv",
+    "vidaa",
+    "samsung_tv",
+    "web",
+    "vizio",
+  ].includes(platform);
+}
+
+module.exports = { platformIsTV };

package/manifestUtils/tvAction/container/index.js

@@ -38,7 +38,7 @@ function tvActionButtonsContainer({ label, description, defaults }) {
     generateFieldsFromDefaultsWithoutPrefixedLabel(
       label,
       defaults,
-      tvActionButtonContainerFields(defaults.position)
+      tvActionButtonContainerFields(defaults["position"])
     )
   );
 

package/numberUtils/__tests__/toNumber.test.ts

@@ -11,16 +11,6 @@ describe("toNumber", () => {
     });
   });
 
-  it("return number if input is BigInt", () => {
-    const inputs = [5n, -5n];
-    expect.assertions(inputs.length);
-
-    inputs.forEach((input) => {
-      const output = toNumber(input);
-      expect(output).toBe(Number(input));
-    });
-  });
-
   it("return number if input is string as number", () => {
     const inputs = ["-1", "0", "1", "100", "0.2"];
     expect.assertions(inputs.length);
@@ -42,8 +32,6 @@ describe("toNumber", () => {
       { test: 1 },
       [],
       [1],
-      "5n",
-      "-5n",
     ];
 
     expect.assertions(inputs.length);

package/numberUtils/index.ts

@@ -8,7 +8,7 @@ export const toNumber = (value: unknown): number | undefined => {
     return undefined;
   }
 
-  if (R.is(Number, value) || R.is(BigInt, value) || R.is(String, value)) {
+  if (R.is(Number, value) || R.is(String, value)) {
     const numberOrNan = Number(value);
 
     return Number.isNaN(numberOrNan) ? undefined : numberOrNan;
@@ -69,24 +69,6 @@ export const isMinusZero = (value: number) => {
   return 1 / value === -Infinity;
 };
 
-export const toPositiveNumber = (value: unknown): number | undefined => {
-  const possibleNumber = toNumber(value);
-
-  if (R.isNil(possibleNumber)) {
-    return undefined;
-  }
-
-  if (possibleNumber < 0) {
-    return undefined;
-  }
-
-  if (isZero(possibleNumber)) {
-    return undefined;
-  }
-
-  return possibleNumber;
-};
-
 export const toPositiveNumberWithDefault = (
   defaultValue: number,
   value: unknown

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/zapp-react-native-utils",
-  "version": "15.0.0-rc.98",
+  "version": "15.1.0-alpha.1852552014",
   "description": "Applicaster Zapp React Native utilities package",
   "main": "index.js",
   "types": "index.d.ts",
@@ -27,13 +27,13 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/applicaster-types": "15.0.0-rc.98",
+    "@applicaster/applicaster-types": "15.1.0-alpha.1852552014",
     "buffer": "^5.2.1",
     "camelize": "^1.0.0",
     "dayjs": "^1.11.10",
-    "handlebars": "4.7.8",
     "memoizee": "0.4.15",
-    "prop-types": "^15.0.0"
+    "prop-types": "^15.0.0",
+    "react-native-handlebars": "^5.0.0-alpha.1"
   },
   "peerDependencies": {
     "@applicaster/zapp-pipes-v2-client": "*",

package/pipesUtils/__tests__/buildUrlWithQuery.test.ts

@@ -0,0 +1,33 @@
+import { buildUrlWithQuery } from "../withPipesEndpoint";
+
+describe("buildUrlWithQuery", () => {
+  it("returns the url unchanged when requestParams is null", () => {
+    expect(buildUrlWithQuery("https://foo.com/path", null)).toBe(
+      "https://foo.com/path"
+    );
+  });
+
+  it("returns the url unchanged when requestParams has no params", () => {
+    expect(buildUrlWithQuery("https://foo.com/path", { headers: {} })).toBe(
+      "https://foo.com/path"
+    );
+  });
+
+  it("returns the url unchanged when url is empty", () => {
+    expect(buildUrlWithQuery("", { params: { a: "1" } })).toBe("");
+  });
+
+  it("appends params to a url with no existing query", () => {
+    expect(
+      buildUrlWithQuery("https://foo.com/path", { params: { token: "abc" } })
+    ).toBe("https://foo.com/path?token=abc");
+  });
+
+  it("merges params with an existing query string", () => {
+    expect(
+      buildUrlWithQuery("https://foo.com/path?existing=1", {
+        params: { token: "abc" },
+      })
+    ).toBe("https://foo.com/path?existing=1&token=abc");
+  });
+});

package/pipesUtils/__tests__/withPipesEndpoint.test.tsx

@@ -0,0 +1,56 @@
+import * as React from "react";
+import { render } from "@testing-library/react-native";
+import { Text } from "react-native";
+
+const mockedUseBuildPipesUrl = jest.fn();
+
+jest.mock("@applicaster/zapp-react-native-utils/reactHooks/feed", () => ({
+  useBuildPipesUrl: (args) => mockedUseBuildPipesUrl(args),
+}));
+
+const { withPipesEndpoint } = require("../withPipesEndpoint");
+
+// eslint-disable-next-line react/display-name
+const Wrapped = React.forwardRef((props: any, _ref) => (
+  <Text testID="wrapped">{`${props.uri}|${JSON.stringify(props.headers)}`}</Text>
+));
+
+describe("withPipesEndpoint", () => {
+  afterEach(() => jest.clearAllMocks());
+
+  it("renders nothing while the endpoint context is resolving", () => {
+    mockedUseBuildPipesUrl.mockReturnValue({ requestParams: null });
+
+    const Decorated = withPipesEndpoint(Wrapped);
+    const { queryByTestId } = render(<Decorated uri="https://foo.com" />);
+
+    expect(queryByTestId("wrapped")).toBeNull();
+  });
+
+  it("passes the uri through unchanged when there are no params", () => {
+    mockedUseBuildPipesUrl.mockReturnValue({ requestParams: {} });
+
+    const Decorated = withPipesEndpoint(Wrapped);
+    const { getByTestId } = render(<Decorated uri="https://foo.com/path" />);
+
+    expect(getByTestId("wrapped").props.children).toBe(
+      "https://foo.com/path|{}"
+    );
+  });
+
+  it("merges resolved params into the uri and forwards headers", () => {
+    mockedUseBuildPipesUrl.mockReturnValue({
+      requestParams: {
+        params: { token: "abc" },
+        headers: { Authorization: "Bearer xyz" },
+      },
+    });
+
+    const Decorated = withPipesEndpoint(Wrapped);
+    const { getByTestId } = render(<Decorated uri="https://foo.com/path" />);
+
+    expect(getByTestId("wrapped").props.children).toBe(
+      'https://foo.com/path?token=abc|{"Authorization":"Bearer xyz"}'
+    );
+  });
+});

package/pipesUtils/index.ts

@@ -0,0 +1 @@
+export { withPipesEndpoint, buildUrlWithQuery } from "./withPipesEndpoint";