import { FC } from 'react'
import Skeleton from 'react-loading-skeleton'
import TitleLine from '../../../components/TitleLine'
import { useTranslation } from 'react-i18next'
import ServiceItemSkeleton from './ServiceItemSkeleton'

const OtherServiceSkeleton: FC = () => {

    const { t } = useTranslation('global')

    return (
        <div>
            <Skeleton
                height={300}
                className='!rounded-3xl'
            />

            <div className='w-full mt-8'>
                <TitleLine title={t('service.selected_danak')} />
            </div>

            <div className='flex flex-wrap xl:gap-6 gap-4 items-center mt-8'>
                <ServiceItemSkeleton />
                <ServiceItemSkeleton />
                <ServiceItemSkeleton />
                <ServiceItemSkeleton />
            </div>
        </div>
    )
}

export default OtherServiceSkeleton