import { useDispatch, useSelector } from 'react-redux';
import styles from './styles.module.scss';
import WWithdrawalInfo from "@widgets/WWithdrawalInfo";
import { getWDPayoutStatus } from '@features/paySlice';
import { reqWithdrawPayout } from '@features/api';
import { REQ_STATUS } from '@api/config';


const WFixedWithdraw = ({ score}) => {
    score = parseFloat(score || 0);
    const payoutStatus = useSelector(getWDPayoutStatus);
    const dispatch = useDispatch()


    const onConfirm = () => {
        if (payoutStatus === REQ_STATUS.LOADING) return;
        if (score == 0) return;
        dispatch(reqWithdrawPayout({
            score: score
        }))
    }


    return (
        <div className={styles.container}>
            <span>${(score / global.CASH_BASE).toFixed(2)}</span>
            <WWithdrawalInfo
                onConfirm={onConfirm}
                loading={payoutStatus === REQ_STATUS.LOADING} />
        </div>
    )
}

export default WFixedWithdraw;