import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useState } from 'react';
import { Button } from '../../Button';
import { Typography } from '../../Typography';
import { useSecondsCountdown } from '../../useSecondsCountDown';
import { Wrapper } from './styles';
export const ResendCodeButton = ({ loading, disabled, resendTimeout, onResendCode, clearCodeValue, }) => {
    const { isActive, textTime: time, restart, } = useSecondsCountdown({
        seconds: resendTimeout,
    });
    const [resendCodeLoading, setResendCodeLoading] = useState(false);
    const isTimerActive = isActive && time !== '00:00';
    const showTimer = !disabled && !loading && !resendCodeLoading && isTimerActive;
    const disableButton = disabled || loading || resendCodeLoading || isTimerActive;
    useEffect(() => {
        restart(resendTimeout);
    }, [resendTimeout, resendCodeLoading]);
    const onClick = () => {
        setResendCodeLoading(true);
        if (onResendCode) {
            onResendCode()
                .then(() => {
                clearCodeValue();
            })
                .catch((error) => {
                // biome-ignore lint/suspicious/noConsole: Ошибка для интеграторов
                console.error(error);
            })
                .finally(() => setResendCodeLoading(false));
        }
    };
    return (_jsxs(Wrapper, { children: [_jsx(Button, { variant: "link", disabled: disableButton, onClick: onClick, children: "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C \u043A\u043E\u0434 \u043F\u043E\u0432\u0442\u043E\u0440\u043D\u043E" }), showTimer && (_jsx(Typography, { color: "grey", colorIntensity: "700", children: time }))] }));
};
