import { TextInput } from "@mantine/core";
import { BaseFormInputProps } from "../../../../types/utils.ts";
import { FC } from "react";
import { BaseMarketplaceSchema } from "../../../../client";
import { BaseMarketplaceType } from "../../../../shared/enums/BaseMarketplaceType.ts";

type RestProps = {
    baseMarketplace: BaseMarketplaceSchema;
};
type Props = BaseFormInputProps<Record<string, string>> & RestProps;

const MarketplaceAuthDataInput: FC<Props> = (props: Props) => {
    console.log(props.baseMarketplace);
    const getWildberriesInputs = () => {
        // return input that sets record "Authorization" to value
        return (
            <TextInput
                {...props}
                label={"Ключ авторизации"}
                placeholder={"Введите ключ авторизации"}
                value={props.value["Authorization"] || ""}
                onChange={value =>
                    props.onChange({
                        ...props.value,
                        Authorization: value.target.value,
                    })
                }
            />
        );
    };
    const getOzonInputs = () => {
        return (
            <>
                <TextInput
                    {...props}
                    label={"Client-Id"}
                    placeholder={"Введите Client-Id"}
                    value={props.value["Client-Id"] || ""}
                    onChange={value =>
                        props.onChange({
                            ...props.value,
                            "Client-Id": value.target.value,
                        })
                    }
                />
                <TextInput
                    {...props}
                    label={"Api-Key"}
                    placeholder={"Введите Api-Key"}
                    value={props.value["Api-Key"] || ""}
                    onChange={value =>
                        props.onChange({
                            ...props.value,
                            "Api-Key": value.target.value,
                        })
                    }
                />
            </>
        );
    };
    const getYandexMarketInputs = () => {};

    const getInputs = () => {
        if (props.baseMarketplace.key === BaseMarketplaceType.WILDBERRIES) {
            return getWildberriesInputs();
        }
        if (props.baseMarketplace.key === BaseMarketplaceType.OZON) {
            return getOzonInputs();
        }
        if (props.baseMarketplace.key === BaseMarketplaceType.YANDEX_MARKET) {
            return getYandexMarketInputs();
        }
        return <></>;
    };

    return <>{getInputs()}</>;
};

export default MarketplaceAuthDataInput;