@applicaster/zapp-react-native-utils/manifestUtils/fonts/index.js

Applicaster Zapp React Native utilities package

const R = require("ramda");

const {
  TV_FONT_KEY_DATA,
  TV_MENU_LABEL_FIELDS,
  ZAPPIFEST_FIELDS,
  MOBILE_CELL_LABEL_FIELDS,
  TV_CELL_LABEL_FIELDS,
} = require("../keys");

const {
  toSnakeCase,
  capitalize,
  isDefined,
  generateFieldsFromDefaults,
  getConditionalField,
} = require("../_internals");

const { fieldsGroup } = require("../utils");

const { spacingKey } = require("../containers");

function fontKeyTV(label, defaults) {
  const keyName = R.compose(toSnakeCase, R.toLower)(label);

  const { fields, conditionalField = [] } = getConditionalField(
    label,
    defaults,
    "styles/"
  );

  return R.compose(
    R.reduce((fields, key) => {
      if (key === "enable") return fields;

      const { name, type, options, tooltip } = TV_FONT_KEY_DATA[key];
      const keySuffix = toSnakeCase(name);

      const fieldProps = {
        label: capitalize(name),
        key: `${keyName}_${keySuffix}`,
        type,
        initial_value: defaults[key],
        ...conditionalField,
      };

      if (options) {
        fieldProps.options = options;
      }

      if (tooltip) {
        fieldProps.label_tooltip = tooltip;
      }

      fields.push(fieldProps);

      if (key === "dataKey") {
        fields.push({
          type: ZAPPIFEST_FIELDS.text_input,
          label: "Custom data key",
          key: `${keyName}_custom_data_key`,
          ...conditionalField,
        });
      }

      return fields;
    }, fields),
    R.keys
  )(defaults);
}

function fontKey(label, defaults, conditionalField = null) {
  const keyName = R.compose(toSnakeCase, R.toLower)(label);

  const fields = [];

  const enableField = getConditionalField(label, defaults);

  const conditional_field =
    conditionalField || enableField.conditionalField || {};

  if (enableField.fields) {
    fields.push(...enableField.fields);
  }

  fields.push({
    type: ZAPPIFEST_FIELDS.color_picker,
    label: `${label} font color`,
    key: `${keyName}_font_color`,
    initial_value: defaults.fontColor,
    ...conditional_field,
  });

  if (isDefined(defaults.focusedFontColor)) {
    fields.push({
      type: ZAPPIFEST_FIELDS.color_picker,
      label: `${label} focused font color`,
      key: `${keyName}_focused_font_color`,
      initial_value: defaults.focusedFontColor,
      ...conditional_field,
    });
  }

  fields.push(
    ...[
      {
        type: ZAPPIFEST_FIELDS.number_input,
        label: `${label} font size`,
        key: `${keyName}_font_size`,
        initial_value: defaults.fontSize,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.font_selector.ios,
        label: `${label} font iOS`,
        key: `${keyName}_ios_font_family`,
        initial_value: defaults.fontFamilyiOS,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.font_selector.android,
        label: `${label} font Android`,
        key: `${keyName}_android_font_family`,
        initial_value: defaults.fontFamilyAndroid,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.number_input,
        label: `${label} line height`,
        key: `${keyName}_line_height`,
        initial_value: defaults.lineHeight,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.number_input,
        label: `${label} letter spacing iOS`,
        key: `${keyName}_letter_spacing_ios`,
        initial_value: defaults.letterSpacingiOS,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.number_input,
        label: `${label} letter spacing android`,
        key: `${keyName}_letter_spacing_android`,
        initial_value: defaults.letterSpacingAndroid,
        ...conditional_field,
      },
      {
        type: ZAPPIFEST_FIELDS.select,
        label: `${label} text transform`,
        key: `${keyName}_text_transform`,
        options: [
          {
            text: "Default",
            value: "default",
          },
          {
            text: "Uppercase",
            value: "uppercase",
          },
          {
            text: "Lowercase",
            value: "lowercase",
          },
          {
            text: "Capitalize",
            value: "capitalize",
          },
        ],
        initial_value: defaults.textTransform,
        ...conditional_field,
      },
    ]
  );

  if (isDefined(defaults.textAlignement)) {
    fields.push({
      type: ZAPPIFEST_FIELDS.select,
      label: `${label} text alignment`,
      key: `${keyName}_text_alignement`,
      options: [
        { text: "center", value: "center" },
        { text: "left", value: "left" },
        { text: "right", value: "right" },
      ],
      initial_value: defaults.textAlignement,
      ...conditional_field,
    });
  }

  if (isDefined(defaults.numberOfLines)) {
    fields.push({
      type: ZAPPIFEST_FIELDS.number_input,
      label: `${label} number of lines`,
      key: `${keyName}_number_of_lines`,
      initial_value: defaults.numberOfLines,
      ...conditional_field,
    });
  }

  const spacingFields = spacingKey(label, defaults, conditional_field);
  fields.push(...spacingFields);

  if (isDefined(defaults.backgroundColor)) {
    fields.push({
      type: ZAPPIFEST_FIELDS.color_picker,
      label: `${label} background color`,
      key: `${keyName}_background_color`,
      initial_value: defaults.backgroundColor,
      ...conditional_field,
    });
  }

  if (isDefined(defaults.cornerRadius)) {
    fields.push({
      type: ZAPPIFEST_FIELDS.number_input,
      label: `${label} corner radius`,
      key: `${keyName}_corner_radius`,
      initial_value: defaults.cornerRadius,
      ...conditional_field,
    });
  }

  return fields;
}

function tvMenuLabel(label, description, defaults) {
  return fieldsGroup(
    label,
    description,
    generateFieldsFromDefaults(label, defaults, TV_MENU_LABEL_FIELDS)
  );
}

function mobileCellLabel(label, description, defaults, groupFolded) {
  return fieldsGroup(
    label,
    description,
    generateFieldsFromDefaults(label, defaults, MOBILE_CELL_LABEL_FIELDS),
    groupFolded
  );
}

function tvCellLabel({ label, description, defaults, groupFolded }) {
  return fieldsGroup(
    label,
    description,
    generateFieldsFromDefaults(
      label,
      { ...defaults, customDataKey: "" },
      TV_CELL_LABEL_FIELDS
    ),
    groupFolded
  );
}

module.exports = {
  fontKeyTV,
  fontKey,
  tvMenuLabel,
  tvCellLabel,
  mobileCellLabel,
};