// All react native style properties that can be a dimension
const RNDimensionStyleUnits = {
  width: 'width',
  height: 'height',
  minWidth: 'minWidth',
  maxWidth: 'maxWidth',
  minHeight: 'minHeight',
  maxHeight: 'maxHeight',
  gap: 'gap',
  rowGap: 'rowGap',
  columnGap: 'columnGap',
  padding: 'padding',
  margin: 'margin',
  paddingLeft: 'paddingLeft',
  paddingRight: 'paddingRight',
  paddingTop: 'paddingTop',
  paddingBottom: 'paddingBottom',
  paddingHorizontal: 'paddingHorizontal',
  paddingVertical: 'paddingVertical',
  marginLeft: 'marginLeft',
  marginRight: 'marginRight',
  marginTop: 'marginTop',
  marginBottom: 'marginBottom',
  marginHorizontal: 'marginHorizontal',
  marginVertical: 'marginVertical',
  borderRadius: 'borderRadius',
  borderWidth: 'borderWidth',
  borderLeftWidth: 'borderLeftWidth',
  borderRightWidth: 'borderRightWidth',
  borderTopWidth: 'borderTopWidth',
  borderBottomWidth: 'borderBottomWidth',
  top: 'top',
  left: 'left',
  right: 'right',
  bottom: 'bottom',
  flex: 'flex',
  lineHeight: 'lineHeight',
};

export function getDimensionValue(value: string | number | undefined) {
  if (!value) {
    return undefined;
  }
  if (typeof value === 'string' && value.includes('%')) {
    return value;
  }
  // check if can be parsed to number
  if (isNaN(Number(value))) {
    return value;
  }
  return parseInt(value.toString(), 10);
}

export const dimensionHandler = (styles: Record<string, any>) => {
  return Object.keys(styles).map((key: string) => {
    if (RNDimensionStyleUnits[key as keyof typeof RNDimensionStyleUnits]) {
      return getDimensionValue(styles[key]);
    }
    return styles[key];
  });
};