import React from 'react';
import {
  type StyleProp,
  StyleSheet,
  Text,
  type TextProps,
  type TextStyle,
  I18nManager,
} from 'react-native';
import { moderateScale } from 'react-native-size-matters';
import { fontFamilies } from '../../constants/fontFamilies';
import { TextAlignment, TypographyVariant } from './TTypographyEnum';
import { defaultScale } from '../../utils/Common';
import { withTheme, useTheme } from '../../core/theming';
import type { Theme } from '../../utils/types';
interface OwnProps {
  variant?: TypographyVariant;
  color?: string;
  style?: StyleProp<TextStyle>;
  textAlign?: TextAlignment;
  fontSize?: number;
  theme: Theme;
  allowFontScaling?: boolean;
}

const defaultFontSize = moderateScale(14, defaultScale);

type Props = OwnProps & TextProps;
const TTypography: React.FC<Props> = ({
  variant = TypographyVariant.PRIMARY,
  color,
  style,
  textAlign = TextAlignment.Left,
  children,
  fontSize = defaultFontSize,
  allowFontScaling = true,
  ...otherProps
}): any => {
  const { colors } = useTheme();
  return (
    <Text
      style={[
        styles({
          fontSize,
        })[variant],
        { color: color ? color : colors.textColor },
        { textAlign },
        style,
      ]}
      allowFontScaling={allowFontScaling}
      {...otherProps}
    >
      {children}
    </Text>
  );
};

export default withTheme(TTypography);

const styles = (props: { fontSize: number }) =>
  StyleSheet.create({
    primary: {
      fontFamily: I18nManager.isRTL
        ? `${fontFamilies.Fonts.primaryArabic}`
        : `${fontFamilies.Fonts.primary}-Regular`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    primarySemiBold: {
      fontFamily: `${fontFamilies.Fonts.primary}-SemiBold`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    primaryBold: {
      fontFamily: I18nManager.isRTL
        ? `${fontFamilies.Fonts.primaryArabic}-Bold`
        : `${fontFamilies.Fonts.primary}-Bold`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    secondary: {
      fontFamily: I18nManager.isRTL
        ? `${fontFamilies.Fonts.primaryArabic}`
        : `${fontFamilies.Fonts.secondary}-Regular`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    secondaryDemi: {
      fontFamily: `${fontFamilies.Fonts.secondary}-Demi`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    secondaryBold: {
      fontFamily: I18nManager.isRTL
        ? `${fontFamilies.Fonts.primaryArabic}-Bold`
        : `${fontFamilies.Fonts.secondary}-Bold`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    primaryArabic: {
      fontFamily: `${fontFamilies.Fonts.primaryArabic}`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
    primaryArabicBold: {
      fontFamily: `${fontFamilies.Fonts.primaryArabic}-Bold`,
      fontSize: moderateScale(props.fontSize, defaultScale),
    },
  });