47 lines
1.3 KiB
TypeScript
47 lines
1.3 KiB
TypeScript
import { useState, type FC } from 'react'
|
|
import { useGetIcons } from './hooks/useIconData'
|
|
import { useTranslation } from 'react-i18next'
|
|
import Button from '../../components/Button'
|
|
import { Add } from 'iconsax-react'
|
|
import CreateIcon from './components/CreateIcon'
|
|
|
|
const IconsList: FC = () => {
|
|
|
|
const { t } = useTranslation('global')
|
|
const [showModal, setShowModal] = useState<boolean>(false)
|
|
const { refetch } = useGetIcons()
|
|
|
|
const handleCloseModal = () => {
|
|
setShowModal(false)
|
|
refetch()
|
|
}
|
|
|
|
return (
|
|
<div className='mt-4'>
|
|
<div className='flex justify-between items-center'>
|
|
<div>
|
|
{t('icon.list_icon')}
|
|
</div>
|
|
|
|
<Button
|
|
className='w-[172px]'
|
|
onClick={() => setShowModal(true)}
|
|
>
|
|
<div className='flex gap-2 items-center'>
|
|
<Add size={20} color='white' />
|
|
<div>
|
|
{t('icon.add_new_icon')}
|
|
</div>
|
|
</div>
|
|
</Button>
|
|
</div>
|
|
|
|
<CreateIcon
|
|
open={showModal}
|
|
close={handleCloseModal}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default IconsList |