import React, {FC} from "react";
import {__} from "../../globals";
import {Button} from "./Button";
import {useSetAtom} from "jotai/index";
import {BuyXGetYSpecificProductWindowStateAtom, GetYProductDataToSave} from "../atoms";

export type GetYAddProductToDiscountButtonProps = {
    onSuccess: (newData: GetYProductDataToSave) => void,
    primary?: boolean,
    small?: boolean
}

export const GetYAddProductToDiscountButton: FC<GetYAddProductToDiscountButtonProps> = ({
                                                                                            onSuccess,
                                                                                            primary = true,
                                                                                            small = false
                                                                                        }) => {
    const openProductSettingsWindow = useSetAtom(BuyXGetYSpecificProductWindowStateAtom)

    return <Button size={small? 'small' : 'medium'} preset={primary ? 'blue' : 'gray'} onClick={() => openProductSettingsWindow({
        onClose: (status, data) => {
            if (status === 'success') {
                onSuccess(data)
            }
        }
    })}>
        <div className="flex items-center justify-center gap-1 w-full">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" className="min-w-4 min-h-4 max-w-4 max-h-4">
                <path fillRule="evenodd" d="M12 2.25c-5.385 0-9.75 4.365-9.75 9.75s4.365 9.75 9.75 9.75 9.75-4.365 9.75-9.75S17.385 2.25 12 2.25ZM12.75 9a.75.75 0 0 0-1.5 0v2.25H9a.75.75 0 0 0 0 1.5h2.25V15a.75.75 0 0 0 1.5 0v-2.25H15a.75.75 0 0 0 0-1.5h-2.25V9Z" clipRule="evenodd" />
            </svg>
            <span>{__('Add another product to discount')}</span></div>
    </Button>
};