import { Platform } from 'react-native';
import type { GlobalTheme } from '../global';

const getBadgeTheme = (theme: GlobalTheme) => {
  const colors = {
    primary: theme.colors.primary,
    danger: theme.colors.onErrorSurface,
    info: theme.colors.onInfoSurface,
    success: theme.colors.onSuccessSurface,
    warning: theme.colors.onWarningSurface,
    archived: theme.colors.onArchivedSurface,
    neutral: theme.colors.mutedOnDefaultGlobalSurface,
    text: theme.colors.onDarkGlobalSurface,
    border: theme.colors.defaultGlobalSurface,
    countText: theme.colors.onDarkGlobalSurface,
    stringBackground: {
      primary: theme.colors.highlightedSurface,
      danger: theme.colors.errorSurface,
      info: theme.colors.infoSurface,
      success: theme.colors.successSurface,
      warning: theme.colors.warningSurface,
      archived: theme.colors.archivedSurface,
      neutral: theme.colors.neutralGlobalSurface,
    },
    stringText: {
      primary: theme.colors.primary,
      danger: theme.colors.onErrorSurface,
      info: theme.colors.onInfoSurface,
      success: theme.colors.onSuccessSurface,
      warning: theme.colors.onWarningSurface,
      archived: theme.colors.onArchivedSurface,
      neutral: theme.colors.onDefaultGlobalSurface,
    },
  };

  const fonts = {
    medium: theme.fonts.neutral.medium,
    small: theme.fonts.neutral.medium,
  };

  const fontSizes = {
    medium: theme.fontSizes.small,
    small: 8,
    icon: {
      medium: theme.fontSizes.small,
      small: 8,
    },
    count: 8,
  };

  const lineHeights = {
    medium: theme.lineHeights.small,
    small: 10,
    count: Platform.select({
      android: 14, // vertical alignment
      default: theme.lineHeights.small,
    }),
  };

  const radii = {
    count: theme.radii.rounded,
  };

  const sizes = {
    medium: {
      height: theme.sizes.large,
      minWidth: theme.sizes.large,
    },
    small: {
      height: theme.sizes.medium,
      minWidth: theme.sizes.medium,
    },
    statusHeight: theme.sizes.small,
    statusWidth: theme.sizes.small,
    count: {
      width: theme.sizes.medium,
      height: theme.sizes.medium,
    },
  };

  const borderWidths = {
    default: theme.borderWidths.medium,
  };

  const space = {
    medium: {
      horizontalPadding: theme.space.small,
    },
    small: {
      horizontalPadding: theme.space.xsmall,
    },
    statusPositionTop: -theme.space.xxsmall,
    statusPositionRight: -theme.space.xxsmall,
    countPositionTop: -theme.space.xsmall,
    countPositionRight: -theme.space.xsmall,
    countPaddingHorizontal: theme.space.xxsmall,
  };

  return {
    colors,
    fonts,
    fontSizes,
    sizes,
    space,
    lineHeights,
    borderWidths,
    radii,
  };
};

export type BadgeThemeType = ReturnType<typeof getBadgeTheme>;
export default getBadgeTheme;