import { useChangeEmail, useGetProfile } from '@/app/profile/hooks/useProfileData'
import DefaulModal from '@/components/DefaulModal'
import Input from '@/components/Input'
import { Button } from '@/components/ui/button'
import { Notification, Send2 } from 'iconsax-react'
import { useState, type FC, FormEvent } from 'react'
import { toast } from '@/components/Toast'
import { extractErrorMessage } from '@/helpers/errorUtils'

const ChangePrice: FC = () => {

    const [open, setOpen] = useState(false)
    const [email, setEmail] = useState('')
    const [isLoading, setIsLoading] = useState(false)
    const { data } = useGetProfile()
    const { mutateAsync: changeEmail } = useChangeEmail()
    const hasEmail = data?.results?.info?.email

    const handleSubmit = async (e: FormEvent) => {
        e.preventDefault()

        const emailToSend = hasEmail || email
        if (!emailToSend) {
            toast('لطفا ایمیل خود را وارد کنید')
            return
        }

        setIsLoading(true)

        try {
            // اگر ایمیل وجود ندارد، ابتدا با changeEmail ذخیره کن
            if (!hasEmail && email) {
                await changeEmail(email, {
                    onError: (error) => {
                        toast(extractErrorMessage(error), 'error')
                    }
                })
            }

            // TODO: Add API call for price change notification
            // await axios.post('/product/price-change-notification', {
            //     email: emailToSend,
            //     productId: productId // از context یا props دریافت شود
            // })

            toast('درخواست شما با موفقیت ثبت شد')
            setOpen(false)
            setEmail('')
        } catch {
            toast('خطا در ارسال درخواست')
        } finally {
            setIsLoading(false)
        }
    }

    return (
        <div>
            <button
                onClick={() => setOpen(true)}
                className='p-2 rounded-full bg-white/80 backdrop-blur-sm hover:bg-white transition-colors'
                title='تغییر قیمت'
            >
                <Notification size={20} color='#333333' />

            </button>

            <DefaulModal
                open={open}
                close={() => setOpen(false)}
                title_header='تغییر قیمت'
                isHeader
            >
                <form onSubmit={handleSubmit} className='space-y-4'>
                    <p className='text-sm text-black font-light'>
                        قیمت های شگفت انگیز برای این کالا از طریق ایمیل به شما اطلاع رسانی شود؟
                    </p>

                    {hasEmail ? (
                        <div className='p-3 bg-gray-50 rounded-lg'>
                            <p className='text-sm text-gray-600'>ایمیل شما:</p>
                            <p className='font-medium'>{data?.results?.info?.email}</p>
                        </div>
                    ) : (
                        <Input
                            label='ایمیل'
                            type='email'
                            placeholder='ایمیل خود را وارد کنید'
                            value={email}
                            onChange={(e) => setEmail(e.target.value)}
                            required
                        />
                    )}

                    <div className='flex gap-2 pt-4'>
                        <Button
                            type='submit'
                            className='flex-1'
                            isLoading={isLoading}
                        >
                            <Send2 size={16} />
                            ارسال درخواست
                        </Button>
                        <Button
                            type='button'
                            variant='outline'
                            onClick={() => setOpen(false)}
                            className='flex-1'
                        >
                            انصراف
                        </Button>
                    </div>
                </form>
            </DefaulModal>
        </div>
    )
}

export default ChangePrice