import React from 'react';
import { View, Text, ViewStyle } from 'react-native';
import { useAppTheme } from '@theme';
import { getStyles } from './badge.styles';

interface BadgeProps {
  count: number;
  color?: string;
  style?: ViewStyle;
}

export const Badge: React.FC<BadgeProps> = ({ count, color, style }) => {
  const { colors } = useAppTheme();
  const styles = getStyles(colors);

  if (count <= 0) return null;

  return (
    <View
      style={[
        styles.container,
        color ? { backgroundColor: color } : null,
        style,
      ]}
    >
      <Text style={styles.text}>{count > 99 ? '99+' : count}</Text>
    </View>
  );
};
export default Badge;