@applicaster/zapp-react-native-utils 14.0.0-alpha.1661204539 → 14.0.0-alpha.1718713411

package/manifestUtils/index.js

@@ -29,6 +29,9 @@ const {
   getUpdatedSecondaryImageKeys,
 } = require("./secondaryImage");
 
+const DEFAULT_GRADIENT_IMAGE =
+  "data:image/png;base64,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";
+
 module.exports = {
   fontKey,
   fontKeyTV,
@@ -47,5 +50,6 @@ module.exports = {
   tvProgressBar,
   secondaryImage,
   getUpdatedSecondaryImageKeys,
+  DEFAULT_GRADIENT_IMAGE,
   compact,
 };

package/manifestUtils/keys.js

@@ -485,6 +485,18 @@ const TV_MENU_LABEL_FIELDS = [
     type: ZAPPIFEST_FIELDS.number_input,
     suffix: "LG letter spacing",
   },
+  {
+    type: ZAPPIFEST_FIELDS.font_selector.roku,
+    suffix: "Roku font family",
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "Roku font size",
+  },
+  {
+    type: ZAPPIFEST_FIELDS.number_input,
+    suffix: "Roku line height",
+  },
   {
     type: ZAPPIFEST_FIELDS.select,
     suffix: "text transform",

package/manifestUtils/progressBar/__tests__/mobileProgressBar.test.js

@@ -18,36 +18,6 @@ describe("mobileProgressBar", () => {
     ]),
   });
 
-  // const timeRemainingLabelConditions = (condition) => ({
-  //   rules: "all_conditions",
-  //   conditional_fields: compact([
-  //     {
-  //       key: "assets/progress_bar_switch",
-  //       condition_value: true,
-  //     },
-  //     {
-  //       key: "assets/progress_bar_time_remaining_label_enable",
-  //       condition_value: true,
-  //     },
-  //     condition,
-  //   ]),
-  // });
-
-  // const watchedLabelConditions = (condition) => ({
-  //   rules: "all_conditions",
-  //   conditional_fields: compact([
-  //     {
-  //       key: "assets/progress_bar_switch",
-  //       condition_value: true,
-  //     },
-  //     {
-  //       key: "assets/progress_bar_watched_label_enable",
-  //       condition_value: true,
-  //     },
-  //     condition,
-  //   ]),
-  // });
-
   it("generate progress-bar configuration - enabled and with bottom_of_cell", () => {
     const enable = true;
     const hideUnwatched = true;

package/manifestUtils/sharedConfiguration/screenPicker/stylesFields.js

@@ -8,7 +8,6 @@ const {
   conditional_horizontal_type,
   conditional_vertical_type,
   conditional_horizontal_type_item_fixed,
-  conditional_horizontal_type_item_dynamic,
   conditional_horizontal_asset_on,
   conditional_horizontal_display_type_fixed,
 } = require("./utils");
@@ -48,7 +47,7 @@ const componentConfigurationFields = [
       { text: "Right", value: "right" },
       { text: "Center", value: "center" },
     ],
-    ...conditional_horizontal_type_item_dynamic,
+    ...conditional_horizontal_type,
   },
   {
     type: "select",
@@ -425,6 +424,12 @@ const titleFields = [
     key: "vizio_font_family",
     initial_value: fontFamily,
   },
+  {
+    type: "roku_font_selector",
+    label: "Roku TV Font Family",
+    key: "roku_font_family",
+    initial_value: fontFamily,
+  },
   ...generateFontConfiguration(),
   // text transform
   {

package/package.json

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

package/playerUtils/__tests__/configurationUtils.test.ts

@@ -1,72 +1,8 @@
 import * as utils from "../configurationUtils";
 
-const { modifyDefaultConfigValues, parseLanguageTracks } = utils;
-
-const configuration = {
-  general: { fields: [{ key: "general_1", initial_value: true }] },
-  styles: { fields: [{ key: "styles_1", initial_value: true }] },
-  localizations: {
-    fields: [{ key: "localizations_1", initial_value: true, label: "label" }],
-  },
-  custom_configuration_fields: [
-    { key: "custom_configuration_fields_1", initial_value: true },
-    { key: "custom_configuration_fields_2", initial_value: "black" },
-    {
-      group: true,
-      fields: [{ key: "custom_configuration_fields_3", initial_value: "red" }],
-    },
-  ],
-};
+const { parseLanguageTracks } = utils;
 
 describe("utilities", () => {
-  describe("modifyDefaultConfigValues", () => {
-    it("should not modify the configuration if a map key doesn't exist in configuration ", function () {
-      const res = modifyDefaultConfigValues(configuration, {
-        custom_configuration_fields: {
-          non_existing_key: { initial_value: "true" },
-        },
-      });
-
-      expect(res).toEqual(configuration);
-    });
-
-    it("should modify the key from mapping", function () {
-      const currentResult = modifyDefaultConfigValues(configuration, {
-        styles: { styles_1: { initial_value: false } },
-      });
-
-      expect(currentResult.styles.fields[0].initial_value).toBe(false);
-    });
-
-    it("should add extra keys the key from mapping", function () {
-      const currentResult = modifyDefaultConfigValues(configuration, {
-        styles: { styles_1: { extra_key: false } },
-      });
-
-      expect(currentResult.styles.fields[0].extra_key).toBeDefined();
-    });
-
-    it("should not remove existing keys that aren't being overwritten", function () {
-      const currentResult = modifyDefaultConfigValues(configuration, {
-        localizations: { localizations_1: { initial_value: false } },
-      });
-
-      expect(currentResult.localizations.fields[0].label).toBeDefined();
-    });
-
-    it("should modify values in groups as well", function () {
-      const currentResult = modifyDefaultConfigValues(configuration, {
-        custom_configuration_fields: {
-          custom_configuration_fields_3: { initial_value: "blue" },
-        },
-      });
-
-      expect(
-        currentResult.custom_configuration_fields[2].fields[0].initial_value
-      ).toBe("blue");
-    });
-  });
-
   describe("parseLanguageTracks", () => {
     const textTrack = { index: 0, id: "text-0" };
     const audioTrack = { index: 0, id: "audio-0" };

package/playerUtils/__tests__/getPlayerActionButtons.test.ts

@@ -0,0 +1,54 @@
+import { getPlayerActionButtons } from "../getPlayerActionButtons";
+import { selectActionButtons } from "../../conf/player/selectors";
+
+jest.mock("../../conf/player/selectors", () => ({
+  selectActionButtons: jest.fn(),
+}));
+
+describe("getPlayerActionButtons", () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("returns an empty array if selectActionButtons returns undefined", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue(undefined);
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual([]);
+  });
+
+  it("returns an empty array if selectActionButtons returns null", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue(null);
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual([]);
+  });
+
+  it("returns an empty array if selectActionButtons returns empty string", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue("");
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual([]);
+  });
+
+  it("returns the first two trimmed action buttons", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue(" play , pause , stop ");
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual(["play", "pause"]);
+  });
+
+  it("returns only one button if only one is present", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue(" play ");
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual(["play"]);
+  });
+
+  it("trims whitespace from button names", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue("  play  ,   pause  ");
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual(["play", "pause"]);
+  });
+
+  it("returns an empty array if selectActionButtons returns only commas", () => {
+    (selectActionButtons as jest.Mock).mockReturnValue(" , , ");
+    const result = getPlayerActionButtons({});
+    expect(result).toEqual(["", ""]);
+  });
+});

package/playerUtils/_internals/__tests__/utils.test.ts

@@ -0,0 +1,71 @@
+import { getAllFields, getConfigurationDiff } from "../utils";
+
+describe("getAllFields", () => {
+  it("should return all field keys from flat configs", () => {
+    const config1 = {
+      fields: [{ key: "foo" }, { key: "bar" }],
+    };
+
+    const config2 = {
+      fields: [{ key: "baz" }],
+    };
+
+    expect(getAllFields(config1, config2)).toEqual(["foo", "bar", "baz"]);
+  });
+
+  it("should handle grouped fields", () => {
+    const config = {
+      fields: [
+        {
+          group: true,
+          fields: [{ key: "grouped1" }, { key: "grouped2" }],
+        },
+        { key: "single" },
+      ],
+    };
+
+    expect(getAllFields(config)).toEqual(["grouped1", "grouped2", "single"]);
+  });
+
+  it("should filter out fields without a key", () => {
+    const config = {
+      fields: [{ key: "foo" }, { notAKey: "bar" }],
+    };
+
+    expect(getAllFields(config)).toEqual(["foo"]);
+  });
+
+  it("should return an empty array if no fields are present", () => {
+    expect(getAllFields({})).toEqual([]);
+  });
+});
+
+describe("getConfigurationDiff", () => {
+  it("should return keys in defaultConfig not present in config", () => {
+    const defaultConfig = ["foo", "bar", "baz"];
+    const config = { foo: 1, baz: 2 };
+
+    expect(getConfigurationDiff(defaultConfig, config)).toEqual(["bar"]);
+  });
+
+  it("should return all keys if config is empty", () => {
+    const defaultConfig = ["foo", "bar"];
+    const config = {};
+
+    expect(getConfigurationDiff(defaultConfig, config)).toEqual(["foo", "bar"]);
+  });
+
+  it("should return an empty array if all keys are present", () => {
+    const defaultConfig = ["foo"];
+    const config = { foo: 1 };
+
+    expect(getConfigurationDiff(defaultConfig, config)).toEqual([]);
+  });
+
+  it("should return defaultConfig if config has no matching keys", () => {
+    const defaultConfig = ["foo", "bar"];
+    const config = { baz: 1 };
+
+    expect(getConfigurationDiff(defaultConfig, config)).toEqual(["foo", "bar"]);
+  });
+});

package/playerUtils/_internals/index.ts

@@ -0,0 +1 @@
+export * from "./utils";

package/playerUtils/_internals/utils.ts

@@ -0,0 +1,31 @@
+import {
+  flatMap,
+  get,
+  flatten,
+  difference,
+} from "@applicaster/zapp-react-native-utils/utils";
+
+const extractFields = (field: any) => {
+  if (field.group === true) {
+    return field.fields;
+  }
+
+  return field;
+};
+
+export const getAllFields = (...configs: any[]) => {
+  const allFields = flatMap(configs, (config) => get(config, "fields", []));
+
+  const processedFields = flatten(allFields.map(extractFields))
+    .map((field) => get(field, "key"))
+    .filter(Boolean);
+
+  return processedFields;
+};
+
+export const getConfigurationDiff = (
+  defaultConfig,
+  config: Record<string, any>
+) => {
+  return difference(defaultConfig, Object.keys(config));
+};

package/playerUtils/configurationUtils.ts

@@ -1,50 +1,6 @@
 import { parseJsonIfNeeded } from "../functionUtils";
 import * as R from "ramda";
 
-import { getNativeName as nativeNameUtil } from "../localizationUtils/localeLanguage";
-
-export const modifyDefaultConfigValues = (
-  configuration: ConfigurationKeys,
-  mapping: ConfigValuesMapping
-): DefaultConfiguration => {
-  return R.mapObjIndexed((value, key) => {
-    const isFieldlessKey = key === "custom_configuration_fields";
-    const keyMapping = mapping[key];
-    const fields = value?.fields || value;
-
-    if (!keyMapping) {
-      return value;
-    }
-
-    const mapper = (obj) => {
-      if (obj.fields) {
-        return R.mergeLeft({ fields: R.map(mapper)(obj.fields) })(obj);
-      }
-
-      return R.mergeLeft(keyMapping?.[obj.key])(obj);
-    };
-
-    const mappedFields = R.map(mapper)(fields);
-
-    return R.unless(() => isFieldlessKey, R.objOf("fields"))(mappedFields);
-  })(configuration);
-};
-
-export function nativeName(localeCode) {
-  try {
-    const {
-      getNativeName,
-    } = require("@applicaster/zapp-react-native-utils/localizationUtils/localeLanguage");
-
-    return getNativeName(localeCode);
-  } catch (error) {
-    // eslint-disable-next-line no-console
-    console.warn("Could not load localeLanguage utils from QB", error);
-
-    return nativeNameUtil(localeCode);
-  }
-}
-
 const setTrackType = R.curry(
   (
     type: QuickBrickPlayer.TrackType,

package/playerUtils/getPlayerActionButtons.ts

@@ -0,0 +1,17 @@
+import { map, take, trim } from "../utils";
+import { selectActionButtons } from "../conf/player/selectors";
+
+/**
+ * Returns the first two action buttons from the configuration.
+ * @param {Object} configuration - The player configuration object.
+ * @returns {Array} An array containing the first two action buttons.
+ */
+export const getPlayerActionButtons = (configuration: any) => {
+  const buttonsString = selectActionButtons(configuration);
+
+  if (!buttonsString) {
+    return [];
+  }
+
+  return take(map(buttonsString.split(","), trim), 2);
+};

package/playerUtils/index.ts

@@ -1,8 +1,13 @@
 import * as R from "ramda";
 import { playerManager } from "@applicaster/zapp-react-native-utils/appUtils/playerManager";
 import { isString } from "@applicaster/zapp-react-native-utils/typeGuards";
+import { isFilledArray } from "@applicaster/zapp-react-native-utils/arrayUtils";
+import { isTV } from "@applicaster/zapp-react-native-utils/reactUtils";
 
 import { getBoolFromConfigValue } from "../configurationUtils";
+import { Dimensions } from "react-native";
+
+export { getPlayerActionButtons } from "./getPlayerActionButtons";
 
 /**
  * Gets duration value from player manager, and from extensions
@@ -89,3 +94,57 @@ export const isAudioItem = (item: Option<ZappEntry>) => {
 
   return false;
 };
+
+export const isInlineTV = (screenData) => {
+  return isTV() && isFilledArray(screenData?.ui_components);
+};
+
+const isPercentage = (value: string | number): boolean => {
+  if (typeof value === "string") {
+    return value.includes("%");
+  }
+
+  return false;
+};
+
+const getPercentageOf = (percent: string, value: number) => {
+  const percentageValue = parseFloat(percent.replace("%", ""));
+
+  if (isNaN(percentageValue)) {
+    return value;
+  }
+
+  return (value * percentageValue) / 100;
+};
+
+type DimensionsT = {
+  width: number | string;
+  height: number | string | undefined;
+  aspectRatio?: number;
+};
+
+export const getTabletWidth = (
+  tablet_landscape_sidebar_width,
+  dimensions: DimensionsT
+) => {
+  const { width: SCREEN_WIDTH } = Dimensions.get("screen");
+
+  const { width } = dimensions;
+  let widthValue = Number(width);
+
+  if (isPercentage(width)) {
+    widthValue = getPercentageOf(width.toString(), SCREEN_WIDTH);
+  }
+
+  const sidebarWidth = Number(tablet_landscape_sidebar_width?.replace("%", ""));
+
+  if (tablet_landscape_sidebar_width?.includes("%")) {
+    return widthValue * (1 - sidebarWidth / 100);
+  }
+
+  if (Number.isNaN(sidebarWidth)) {
+    return widthValue * 0.65;
+  }
+
+  return widthValue - sidebarWidth;
+};

package/playerUtils/useValidatePlayerConfig.tsx

@@ -1,34 +1,37 @@
 import * as React from "react";
-import * as R from "ramda";
-import generateConfiguration from "./configurationGenerator";
 import { createLogger } from "../logger";
+import { createConfig } from "../manifestUtils/createConfig";
+import { getAllFields, getConfigurationDiff } from "./_internals";
 
 export const logger = createLogger({
   category: "useValidatePlayerConfig",
   subsystem: "useValidatePlayerConfig",
 });
 
-const configuration = generateConfiguration();
+/** Default Player Configuration */
+const {
+  styles,
+  general,
+  localizations,
+  custom_configuration_fields,
+}: DefaultConfiguration = createConfig(
+  () => {
+    return {};
+  },
+  { extend: "player" }
+) as any;
+
+const QBPlayerConfigFields = getAllFields(
+  styles,
+  general,
+  localizations,
+  custom_configuration_fields
+);
 
 export const useValidatePlayerConfig = (config) => {
   React.useEffect(() => {
     try {
-      const QBPlayerConfigFields = R.compose(
-        R.map(R.prop("key")),
-        R.flatten,
-        R.map(R.compose(R.when(R.propEq("group", true), R.prop("fields")))),
-        R.concat
-      )(
-        configuration.styles.fields,
-        configuration.general.fields,
-        configuration.localizations.fields,
-        configuration.custom_configuration_fields
-      );
-
-      const diff = R.compose(
-        R.difference(QBPlayerConfigFields),
-        R.keys
-      )(config);
+      const diff = getConfigurationDiff(QBPlayerConfigFields, config);
 
       logger.log_info(
         "Missing following configuration properties. Some elements of the player may not work correctly. Check QuickBrickPlayerPlugin for the configuration reference https://github.com/applicaster/QuickBrick/tree/main/plugins/zapp-react-native-default-player/manifests",

package/reactHooks/cell-click/index.ts

@@ -16,7 +16,7 @@ import { ActionExecutorContext } from "@applicaster/zapp-react-native-utils/acti
 import { isFunction, noop } from "../../functionUtils";
 import { useSendAnalyticsOnPress } from "../analytics";
 import { logOnPress, warnEmptyContentType } from "./helpers";
-import { useCurrentScreenData, useScreenContext } from "../screen";
+import { useCurrentScreenData } from "../screen";
 
 /**
  * If onCellTap is defined execute the function and
@@ -46,7 +46,6 @@ export const useCellClick = ({
   const onCellTap: Option<Function> = React.useContext(CellTapContext);
   const actionExecutor = React.useContext(ActionExecutorContext);
   const screenData = useCurrentScreenData();
-  const screenState = useScreenContext()?.options;
 
   const cellSelectable = toBooleanWithDefaultTrue(
     component?.rules?.component_cells_selectable
@@ -84,8 +83,6 @@ export const useCellClick = ({
         await actionExecutor?.handleEntryActions(selectedItem, {
           component,
           screenData,
-          screenState,
-          screenRoute: pathname,
         });
       }
 
@@ -120,7 +117,6 @@ export const useCellClick = ({
       push,
       sendAnalyticsOnPress,
       screenData,
-      screenState,
     ]
   );
 

package/reactHooks/feed/useBatchLoading.ts

@@ -10,7 +10,7 @@ import {
   getSearchContext,
 } from "@applicaster/zapp-react-native-utils/reactHooks";
 import { isGallery } from "@applicaster/zapp-react-native-utils/componentsUtils";
-import { useScreenContext } from "../screen/useScreenContext";
+import { useScreenContext } from "../screen";
 
 type Options = {
   initialBatchSize?: number;
@@ -144,11 +144,11 @@ export const useBatchLoading = (
         }
       }
     });
-  }, [feedUrls]);
+  }, [feedUrls, feeds]);
 
   React.useEffect(() => {
     runBatchLoading();
-  }, []);
+  }, [runBatchLoading]); // Adding runBatchLoading as a dependency to ensure that it reloads feeds when clearPipesData is called
 
   React.useEffect(() => {
     // check if all feeds are ready and set hasEverBeenReady to true