import { View, Text, StyleSheet } from 'react-native';
import { Colors, Spacing } from '../constants/theme';

type StatusType = 'success' | 'warning' | 'danger';

type StatusBadgeProps = {
  label: string;
  type?: StatusType;
};

export default function StatusBadge({
  label,
  type = 'success',
}: StatusBadgeProps) {

  const theme = Colors.light;

  const getColor = () => {
    switch (type) {
      case 'success':
        return '#22C55E';
      case 'warning':
        return '#FACC15';
      case 'danger':
        return '#EF4444';
      default:
        return theme.textSecondary;
    }
  };

  return (
    <View style={[styles.badge, { backgroundColor: getColor() }]}>
      <Text style={styles.text}>{label}</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  badge: {
    paddingHorizontal: Spacing.two,
    paddingVertical: 4,
    borderRadius: 20,
    alignSelf: 'flex-start',
  },
  text: {
    color: '#fff',
    fontSize: 12,
    fontWeight: '600',
  },
});