import { type FC } from 'react'
import { useLocation } from 'react-router-dom'
import { DocumentText } from 'iconsax-react'
import SubMenuItem from './SubMenuItem'
import { Pages } from '../../config/Pages'

const PagesSubMenu: FC = () => {
    const location = useLocation()
    const isActive = (name: string) => {
        return location.pathname.includes(name)
    }

    return (
        <div className='py-12'>
            <div className='flex gap-3 items-center border-b border-border pb-10 px-6'>
                <DocumentText
                    size={24}
                    color='#da2129'
                    variant='Bold'
                />
                <div className='text-xs'>
                    مدیریت صفحات
                </div>
            </div>

            <div className='flex flex-col mt-10 gap-4'>
                <SubMenuItem
                    title={'درباره ما'}
                    isActive={isActive('about-us')}
                    link={Pages.pages.aboutUs}
                />
                <SubMenuItem
                    title={'سوالات متداول'}
                    isActive={isActive('faq')}
                    link={Pages.pages.faq}
                />
                <SubMenuItem
                    title={'صفحه روش های ارسال'}
                    isActive={isActive('shipment')}
                    link={Pages.pages.shipment}
                />
                <SubMenuItem
                    title={'حریم خصوصی'}
                    isActive={isActive('privacy')}
                    link={Pages.pages.privacy}
                />
                <SubMenuItem
                    title={'قوانین مرجوعی'}
                    isActive={isActive('return-policy')}
                    link={Pages.pages.returnPolicy}
                />
                <SubMenuItem
                    title={'مشاغل'}
                    isActive={isActive('jobs')}
                    link={Pages.pages.jobs}
                />
                <SubMenuItem
                    title={'اسناد'}
                    isActive={isActive('documents')}
                    link={Pages.pages.documents}
                />
                <SubMenuItem
                    title={'تعرفه درآمد'}
                    isActive={isActive('income-tariff')}
                    link={Pages.pages.incomeTariff}
                />
            </div>
        </div>
    )
}

export default PagesSubMenu
