1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / chinawholesale-frontend-next / src / components / pages / dashboard /
Filename : DashboardComponent.js
back
'use client'
import React, { useMemo } from 'react'
import { useAuthMutation } from '@/api/auth'
import PageCardComponent from '@/components/mixed/PageCardComponent'
import DashboardCardItem from '@/components/pages/dashboard/includes/DashboardCardItem'
import DashboardRecentView from '@/components/pages/dashboard/includes/DashboardRecentView'
import { useWishList } from '@/api/wishList-api'
import { useCartData } from '@/api/cart-api'
import { useSettings } from '@/api/generale'
import {
    CartIcon,
    InvoiceIcon,
    LinkExternal,
    LocationIcon,
    LogOutIcon,
    LoveIcon,
    OrderList,
    UserIcon,
} from '@/components/icons'

// const dashboardURL = process.env.NEXT_PUBLIC_ADMIN_URL

const DashboardComponent = ({ user }) => {
    const { authLogout } = useAuthMutation()
    const settings = useSettings()

    const { data: wishList } = useWishList()
    const { data: cart } = useCartData()

    const cart_count = useMemo(() => cart?.cart_items?.filter((item) => item?.IsCart > 0)?.length || 0, [cart?.cart_items])
    const love_count = useMemo(() => wishList?.length || 0, [wishList])


    const authLogoutProcess = async (e) => {
        e.preventDefault()
        await authLogout.mutateAsync()
    }

    return (
        <>
            <PageCardComponent title={'Dashboard'}>
                <div className="max-w-[1100px] mt-8 mb-3">
                    <div className="grid grid-cols-3 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-2 lg:gap-4 ">
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                count={cart_count}
                                href={`/checkout`}
                                icon={<CartIcon className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px] " />}
                                text={'Cart'}
                            />
                        </div>
                        <div className={'col-span-1 mb-2 relative'}>
                            <DashboardCardItem
                                count={love_count}
                                href={`/dashboard/wishlist`}
                                icon={<LoveIcon className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Wishlist'}
                            />
                        </div>
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                href={`/dashboard/orders`}
                                icon={<OrderList
                                    className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Orders'}
                            />
                        </div>
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                href={`/dashboard/invoices`}
                                icon={<InvoiceIcon
                                    className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Invoices'}
                            />
                        </div>
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                href={`/dashboard/address`}
                                icon={<LocationIcon
                                    className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Address'}
                            />
                        </div>
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                href={`/dashboard/account`}
                                icon={<UserIcon className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Account'}
                            />
                        </div>
                        {
                            !!user?.is_backend &&
                            <div className={'col-span-1 mb-2'}>
                                <DashboardCardItem
                                    href={`/admin/dashboard`}
                                    icon={<LinkExternal
                                        className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                    text={'Admin'}
                                />
                            </div>
                        }
                        <div className={'col-span-1 mb-2'}>
                            <DashboardCardItem
                                href={`?logout=true`}
                                icon={<LogOutIcon
                                    className="text-[34px] sm:text-[72px] lg:text-[68px] xl:text-[74px]" />}
                                text={'Logout'}
                                onClick={authLogoutProcess}
                            />
                        </div>
                    </div>
                </div>


                <div>
                    <DashboardRecentView settings={settings} />
                </div>

            </PageCardComponent>
        </>
    )

}

export default DashboardComponent