import GridWrapper from '@/components/GridWrapper'
import { Paths } from '@/config/Paths'
import { COLORS } from '@/constants/colors'
import { useGetHomeStats } from '@/pages/dashboard/hooks/useDashboardData'
import { ProformaInvoiceStatusEnum } from '@/pages/invoice/enum/InvoiceEnum'
import { TabOrderListEnum } from '@/pages/order/enum/OrderEnum'
import { t } from '@/locale'
import { BoxTick, BoxTime, People, ReceiptText, TruckTick } from 'iconsax-react'
import { type FC } from 'react'
import StatCard from './StatCard'

const Stats: FC = () => {
    const { data } = useGetHomeStats()
    const stats = data?.data

    return (
        <GridWrapper
            desktop={5}
            mobile={2}
            gapDesktop={24}
            gapMobile={12}
            className='mt-5'
        >
            <StatCard
                count={stats?.requestsCount}
                description={t('home.requestCount')}
                to={Paths.requests.list}
                icon={<BoxTime
                    size={27}
                    color={COLORS.primary}
                />}
            />
            <StatCard
                count={stats?.unconfirmedInvoicesCount}
                description={t('home.factureCount')}
                to={`${Paths.perfomaInvoice.list}?tab=${ProformaInvoiceStatusEnum.PENDING}`}
                icon={<ReceiptText
                    size={27}
                    color={COLORS.primary}
                />}
            />
            <StatCard
                count={stats?.inProgressOrdersCount}
                description={t('home.orderCount')}
                to={`${Paths.order.list}?tab=${TabOrderListEnum.IN_PROGRESS}`}
                icon={<BoxTick
                    size={27}
                    color={COLORS.primary}
                />}
            />
            <StatCard
                count={stats?.completedOrdersCount}
                description={t('home.orderDoneCount')}
                to={`${Paths.order.list}?tab=${TabOrderListEnum.FINISHED}`}
                icon={<TruckTick
                    size={27}
                    color={COLORS.primary}
                />}
            />
            <StatCard
                count={stats?.customersCount}
                description={t('home.customerCount')}
                to={Paths.users.list}
                icon={<People
                    size={27}
                    color={COLORS.primary}
                />}
            />
        </GridWrapper>
    )
}

export default Stats