tududi/frontend/components/Task/TaskRecurrenceBadge.tsx

import React from 'react';
import { RecurrenceType } from '../../entities/Task';
import { useTranslation } from 'react-i18next';
import { ArrowPathIcon } from '@heroicons/react/24/outline';

interface TaskRecurrenceBadgeProps {
    recurrenceType: RecurrenceType;
}

const TaskRecurrenceBadge: React.FC<TaskRecurrenceBadgeProps> = ({
    recurrenceType,
}) => {
    const { t } = useTranslation();

    if (!recurrenceType || recurrenceType === 'none') {
        return null;
    }

    const getRecurrenceIcon = () => {
        return <ArrowPathIcon className="w-3 h-3 mr-1" />;
    };

    const getRecurrenceLabel = (type: RecurrenceType) => {
        switch (type) {
            case 'daily':
                return t('recurrence.daily', 'DAILY');
            case 'weekly':
                return t('recurrence.weekly', 'WEEKLY');
            case 'monthly':
                return t('recurrence.monthly', 'MONTHLY');
            case 'monthly_weekday':
                return t('recurrence.monthlyWeekday', 'MONTHLY');
            case 'monthly_last_day':
                return t('recurrence.monthlyLastDay', 'MONTHLY');
            default:
                return t('recurrence.recurring', 'RECURRING');
        }
    };

    return (
        <span className="inline-flex items-center px-2 py-1 rounded text-xs font-medium bg-purple-100 text-purple-800 dark:bg-purple-800 dark:text-purple-100">
            {getRecurrenceIcon()}
            {getRecurrenceLabel(recurrenceType)}
        </span>
    );
};

export default TaskRecurrenceBadge;