import { platformSelect } from "../reactUtils";
import { toCamelCase } from "@applicaster/zapp-react-native-utils/stringUtils";

const currentPlatform = platformSelect({
  ios: "ios",
  tvos: "tvos",
  samsung_tv: "samsung",
  lg_tv: "lg",
  web: "samsung",
  android: "android",
  android_tv: "android",
});

// Do not change the order, focused_selected should be first
const states = ["focused_selected", "pressed", "focused", "selected"];

const platformSuffixes = ["ios", "tvos", "samsung", "lg", "android"];
type StateKey = (typeof states)[number] | "default";

export type GetAllSpecificStylesProps = {
  componentName: string;
  subComponentName: string;
  configuration: Record<string, any>;
  outStyles: Record<string, any>;
};

/*
 * Style name format: <component_name>_style_<sub_component_name>_[platform_][state_]<style_name>
 * Platform: ios, tvos, samsung, lg, android. Declared in platformKeyMapper.tsx
 * State: missing (default state), pressed, focused
 * Example: player_controls_style_button_background_color
 * */
export const getAllSpecificStyles = ({
  configuration,
  componentName,
  subComponentName,
  outStyles,
}: GetAllSpecificStylesProps) => {
  if (!outStyles) throw new Error("outStyles is required");
  if (!componentName) throw new Error("componentName is required");

  const prefix =
    subComponentName?.length > 0
      ? `${componentName}_style_${subComponentName}_`
      : `${componentName}_style_`;

  const defaultKey = "default";

  if (!outStyles[defaultKey]) outStyles[defaultKey] = {};

  const tmpGenericDict: Record<StateKey, Record<string, any>> = {};
  const tmpPlatformDict: Record<StateKey, Record<string, any>> = {};

  const parseKey = (key: string, value: any) => {
    if (!key.startsWith(prefix)) {
      return;
    }

    let styleName = key.slice(prefix.length);
    if (!styleName || styleName.startsWith("_")) return;

    const platform = platformSuffixes.find((prefix) =>
      styleName.startsWith(prefix)
    );

    let tmpDict = tmpGenericDict;

    if (platform) {
      if (currentPlatform !== platform) {
        return;
      }

      tmpDict = tmpPlatformDict;
      styleName = styleName.slice(platform.length + 1);
    }

    let state = states.find((prefix) => styleName.startsWith(prefix)) as
      | StateKey
      | undefined;

    if (state) {
      styleName = styleName.slice(state.length + 1);
    } else {
      state = defaultKey;
    }

    if (!styleName) return;

    const camelCaseKey = toCamelCase(styleName);

    if (!tmpDict[state]) tmpDict[state] = {};
    tmpDict[state][camelCaseKey] = value;
  };

  for (const [key, value] of Object.entries(configuration)) {
    parseKey(key, value);
  }

  const allStates = Array.from(
    new Set<StateKey>([
      defaultKey,
      ...(Object.keys(tmpGenericDict) as StateKey[]),
      ...(Object.keys(tmpPlatformDict) as StateKey[]),
      ...(Object.keys(outStyles) as StateKey[]),
    ])
  );

  for (const state of allStates) {
    outStyles[state] = Object.assign(
      {},
      outStyles[state] || {},
      tmpGenericDict[state] || {},
      tmpPlatformDict[state] || {}
    );
  }

  // Merge default styles with state specific styles
  for (const state of Object.keys(outStyles)) {
    if (state === defaultKey) continue;

    outStyles[state] = Object.assign(
      {},
      outStyles[defaultKey],
      outStyles[state]
    );
  }
};