import CartSummary from '@/components/CartSummary'
import withLayout from '@/hoc/withLayout'
import { NextPage } from 'next'
import TitleBack from '../components/TitleBack'
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
import DiscountCard from '../components/DiscountCard'

const CartPayment: NextPage = () => {
    return (
        <div className="mt-14 px-20">

            <div className="mt-6 flex gap-6">
                <div className='flex-1'>
                    <TitleBack title='پرداخت' />
                    <DiscountCard
                    />
                    <div className='mt-5 border border-border rounded-2xl p-6 font-light'>
                        <div>انتخاب روش پرداخت</div>

                        <div className='mt-10 text-[#333333] font-light'>
                            <RadioGroup defaultValue="option-one">
                                <div className="flex items-center gap-2">
                                    <RadioGroupItem value="option-one" id="option-one" />
                                    <div className='text-sm'>زین پال</div>
                                </div>
                                <div className="flex items-center gap-2">
                                    <RadioGroupItem value="option-one" id="option-one" />
                                    <div className='text-sm'>زین پال</div>
                                </div>
                            </RadioGroup>
                        </div>
                    </div>
                </div>
                <CartSummary
                    itemsCount={3}
                    itemsPrice={580000}
                    discount={580000}
                    total={80580000}
                    confirmHref="/cart/payment"
                    confirmLabel="پرداخت"
                    className="w-[360px]"
                />
            </div>
        </div>
    )
}

export default withLayout(CartPayment)