61 lines
2.4 KiB
TypeScript
61 lines
2.4 KiB
TypeScript
import { FC } from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import StatusWithText from '../../components/StatusWithText'
|
|
import { useNavigate, useParams } from 'react-router-dom'
|
|
import { ArrowLeft2 } from 'iconsax-react'
|
|
import { useGetAnnoncementDetail } from './hooks/useAnnoncementData'
|
|
import PageLoading from '../../components/PageLoading'
|
|
|
|
const AnnouncementDetail: FC = () => {
|
|
|
|
const { id } = useParams()
|
|
const { t } = useTranslation('global')
|
|
const navigate = useNavigate()
|
|
const getDetail = useGetAnnoncementDetail(id ? id : '')
|
|
|
|
return (
|
|
<div className='mt-4'>
|
|
<div className='flex justify-between'>
|
|
<div>
|
|
{t('announcement.text_announcement')}
|
|
</div>
|
|
<div onClick={() => navigate(-1)} className='text-xs cursor-pointer flex gap-0.5 items-center font-extralight'>
|
|
{t('back')}
|
|
<ArrowLeft2 size={12} color='black' />
|
|
</div>
|
|
</div>
|
|
|
|
{
|
|
getDetail.isPending ?
|
|
<PageLoading />
|
|
:
|
|
<div className='flex-1 mt-4 bg-white py-6 px-4 rounded-2xl'>
|
|
<div className='flex justify-between items-start'>
|
|
<div className='text-sm max-w-[70%] leading-67'>
|
|
{getDetail.data?.data?.announcement?.title}
|
|
</div>
|
|
<div className='flex gap-1'>
|
|
{
|
|
getDetail.data?.data?.announcement.isImportant &&
|
|
<StatusWithText
|
|
variant='error'
|
|
text={t('announcement.important')}
|
|
/>
|
|
}
|
|
|
|
<StatusWithText
|
|
variant='success'
|
|
text={t('announcement.new')}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div dangerouslySetInnerHTML={{ __html: getDetail.data?.data?.announcement?.content }} className='mt-5 leading-7 text-xs font-light'>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default AnnouncementDetail |