import React from "react";
import {Checkbox, Space} from "antd";
import {DeliveryOptions} from "@/types/appSetting";
import {useTranslations} from "next-intl";

const DeliveryOptionsCheckbox = ({
                                     deliveryOptions,
                                 }: {
    deliveryOptions: DeliveryOptions;
}) => {
    const t = useTranslations("Form")
    if (!deliveryOptions || Object.keys(deliveryOptions).length === 0) {
        return <p style={{color: "gray"}}>No delivery options available</p>;
    }

    const options = Object.entries(deliveryOptions).map(([key, value]) => ({
        label: key.charAt(0).toUpperCase() + key.slice(1),
        value: key,
        checked: Boolean(value),
    }));

    return (
        <Space>
            {options.map((option) => (
                <Checkbox
                    key={option.value}
                    checked={option.checked}
                    disabled={!option.checked}
                    style={{
                        color: option.checked ? "black" : "gray",
                        fontWeight: option.checked ? "normal" : "normal",
                    }}
                >
                    {t(option.value)}
                </Checkbox>
            ))}
        </Space>
    );
};

export default DeliveryOptionsCheckbox;