hamid zarghami
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import Button from '@/components/Button'
|
||
import ProgressBar from '@/components/ProgressBar'
|
||
import { useGetSpace } from '@/pages/setting/domain/hooks/useDomainData'
|
||
import { useSharedStore } from '@/shared/store/sharedStore'
|
||
import { Cloud } from 'iconsax-react'
|
||
import { FC } from 'react'
|
||
import { useTranslation } from 'react-i18next'
|
||
|
||
const Storage: FC = () => {
|
||
|
||
const { t } = useTranslation()
|
||
const { setOpenBuySpace } = useSharedStore()
|
||
const { data } = useGetSpace()
|
||
return (
|
||
<div className='px-10 pb-5'>
|
||
<div className='flex gap-2 items-center'>
|
||
<Cloud size={20} color='#8C90A3' />
|
||
<div className='text-xs text-description'>
|
||
{t('sidebar.storage')}
|
||
</div>
|
||
</div>
|
||
|
||
<div className='mt-5'>
|
||
<ProgressBar
|
||
percentage={
|
||
data?.data?.quota?.totalInGB
|
||
? Math.round(
|
||
(data?.data?.quota?.usedInGB / data?.data?.quota?.totalInGB) * 100
|
||
)
|
||
: 0
|
||
}
|
||
/>
|
||
</div>
|
||
|
||
<div className='mt-5 text-xs'>
|
||
{data?.data?.quota?.usedInGB} گیگابایت از {data?.data?.quota?.totalInGB} گیگابایت استفاده شده است
|
||
</div>
|
||
|
||
<div className='mt-5'>
|
||
<Button
|
||
variant='secondary'
|
||
label={t('sidebar.add_space')}
|
||
onClick={() => setOpenBuySpace(true)}
|
||
/>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default Storage |