
import Price from './Price'
import { Button } from '../ui/button'
import { Spinner } from '../ui/spinner'
import { cn } from '@/lib/utils'


type Props = {
    buttonTitle: string,
    price: number
    title?: string
    subTitle: string
    onClick: () => void,
    disabled?: boolean,
    hide?: boolean,
    loading?: boolean,
    className?: string
}

export default function UiCardFooter({ title = 'Total Price', subTitle, price, buttonTitle, onClick, disabled, hide, loading, className }: Props) {
    return <div className={cn('justify-between items-end pt-3 flex flex-row border-t w-full ease-in', className)}>
        <div>
            <p className="text-xs text-neutral-500">{title}</p>
            <h2 className="text-xl font-bold text-neutral-900">
                <span><Price value={price} /></span>
                <span className="text-sm font-normal text-neutral-500"> / {subTitle}</span>
            </h2>
        </div>
        <Button disabled={disabled} className={`w-fit  cursor-pointer rounded-full bg-main px-5 hover:bg-main hover:scale-[1.005] active:scale-99 ring-4 ring-main/40 ${hide && 'hidden'}`} onClick={onClick} > {loading ? <><Spinner /> Please Wait</> : buttonTitle} </Button>
    </div >
}
