refactor(FE-438): Add icon position/size and subtitle to modal

This commit is contained in:
rstubryan
2025-12-28 16:44:01 +07:00
parent c0a818af7e
commit b1ccad081d
2 changed files with 238 additions and 40 deletions
@@ -420,6 +420,8 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
<ConfirmationModal
ref={singleDeleteModal.ref}
type='error'
iconPosition='left'
iconSize={32}
text={`Apakah anda yakin ingin menghapus data Uniformity ini?`}
secondaryButton={{
text: 'Tidak',
@@ -430,11 +432,71 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
isLoading: isDeleteLoading,
onClick: singleDeleteHandler,
}}
/>
className={{
modalBox: 'rounded-2xl',
}}
>
{' '}
<div className='flex flex-col gap-4 mt-4'>
<Table
data={[
{
id: 'tanggal',
label: 'Tanggal',
value: '28 Desember 2025',
},
{
id: 'lokasi-farm',
label: 'Lokasi Farm',
value: 'Farm A',
},
{
id: 'project-flock',
label: 'Project Flock',
value: 'Flock 2025-01',
},
{
id: 'kandang',
label: 'Kandang',
value: 'Kandang 1',
},
{
id: 'file-uniformity',
label: 'File Uniformity',
value: 'uniformity_data.xlsx',
},
{
id: 'status',
label: 'Status',
value: 'Disetujui',
},
]}
columns={[
{
accessorKey: 'label',
header: 'Label',
cell: (props) => props.row.original.label,
},
{
accessorKey: 'value',
header: 'Value',
cell: (props) => <span>{props.row.original.value}</span>,
},
]}
pageSize={6}
className={{
containerClassName: 'mb-0',
paginationClassName: 'hidden',
}}
/>
</div>
</ConfirmationModal>
<ConfirmationModal
ref={bulkDeleteModal.ref}
type='error'
iconPosition='left'
iconSize={32}
text={`Apakah anda yakin ingin menghapus ${selectedRowIds.length} data Uniformity yang dipilih?`}
secondaryButton={{
text: 'Tidak',
@@ -445,18 +507,81 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
isLoading: isBulkActionLoading,
onClick: bulkDeleteHandler,
}}
/>
className={{
modalBox: 'rounded-2xl',
}}
>
<div className='flex flex-col gap-4 mt-4'>
<Table
data={[
{
id: 'tanggal',
label: 'Tanggal',
value: '28 Desember 2025',
},
{
id: 'lokasi-farm',
label: 'Lokasi Farm',
value: 'Farm A',
},
{
id: 'project-flock',
label: 'Project Flock',
value: 'Flock 2025-01',
},
{
id: 'kandang',
label: 'Kandang',
value: 'Kandang 1',
},
{
id: 'file-uniformity',
label: 'File Uniformity',
value: 'uniformity_data.xlsx',
},
{
id: 'status',
label: 'Status',
value: 'Disetujui',
},
]}
columns={[
{
accessorKey: 'label',
header: 'Label',
cell: (props) => props.row.original.label,
},
{
accessorKey: 'value',
header: 'Value',
cell: (props) => <span>{props.row.original.value}</span>,
},
]}
pageSize={6}
className={{
containerClassName: 'mb-0',
paginationClassName: 'hidden',
}}
/>
</div>
</ConfirmationModal>
<ConfirmationModal
ref={successModal.ref}
type='success'
iconPosition='left'
iconSize={32}
text='Data Berhasil Ditambahkan'
subtitleText='Data uniformity telah berhasil disimpan.'
closeOnBackdrop={false}
primaryButton={{
text: 'Ok',
color: 'primary',
onClick: handleSuccessModalClose,
}}
className={{
modalBox: 'rounded-2xl',
}}
>
<div className='flex flex-col gap-4 mt-4'>
<Table