feat(FE-331): implement permission guard in purchase

This commit is contained in:
ValdiANS
2025-12-26 16:21:22 +07:00
parent 1152cd2bef
commit 4be719b9d8
3 changed files with 128 additions and 88 deletions
@@ -39,19 +39,22 @@ import { toast } from 'react-hot-toast';
import { useSearchParams } from 'next/navigation';
import { formatCurrency, formatNumber, formatDate } from '@/lib/helper';
import { PURCHASE_ORDER_APPROVAL_LINE } from '@/config/approval-line';
import RequirePermission from '@/components/helper/RequirePermission';
const ItemPembelianDropdown = ({ onEdit }: { onEdit: () => void }) => {
return (
<RowOptionsMenuWrapper type='dropdown'>
<Button
onClick={onEdit}
variant='ghost'
color='warning'
className='justify-start text-sm'
>
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
Edit
</Button>
<RequirePermission permissions='lti.purchase.update'>
<Button
onClick={onEdit}
variant='ghost'
color='warning'
className='justify-start text-sm'
>
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
Edit
</Button>
</RequirePermission>
</RowOptionsMenuWrapper>
);
};
@@ -59,15 +62,17 @@ const ItemPembelianDropdown = ({ onEdit }: { onEdit: () => void }) => {
const PenerimaanBarangDropdown = ({ onEdit }: { onEdit: () => void }) => {
return (
<RowOptionsMenuWrapper type='dropdown'>
<Button
onClick={onEdit}
variant='ghost'
color='warning'
className='justify-start text-sm'
>
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
Edit
</Button>
<RequirePermission permissions='lti.purchase.receive'>
<Button
onClick={onEdit}
variant='ghost'
color='warning'
className='justify-start text-sm'
>
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
Edit
</Button>
</RequirePermission>
</RowOptionsMenuWrapper>
);
};
@@ -496,14 +501,16 @@ const PurchaseOrderDetail = ({
};
return (
<Button
type='button'
color='error'
className='text-sm'
onClick={deleteClickHandler}
>
<Icon icon='mdi:trash-can' width={16} height={16} />
</Button>
<RequirePermission permissions='lti.purchase.delete.item'>
<Button
type='button'
color='error'
className='text-sm'
onClick={deleteClickHandler}
>
<Icon icon='mdi:trash-can' width={16} height={16} />
</Button>
</RequirePermission>
);
},
},
@@ -632,25 +639,45 @@ const PurchaseOrderDetail = ({
{showApprovalButton && (
<div className='flex flex-row gap-2'>
<Button
onClick={handleApprovalClick}
variant='outline'
color='success'
className='w-full sm:w-fit'
<RequirePermission
permissions={
approvalStep === 1
? 'lti.purchase.approve.staff'
: approvalStep === 2
? 'lti.purchase.approve.manager'
: 'lti.purchase.receive'
}
>
<Icon icon='material-symbols:check' width={24} height={24} />
Approve
</Button>
<Button
onClick={handleApprovalClick}
variant='outline'
color='success'
className='w-full sm:w-fit'
>
<Icon icon='material-symbols:check' width={24} height={24} />
Approve
</Button>
</RequirePermission>
<Button
variant='outline'
color='error'
className='w-full sm:w-fit'
onClick={handleRejectionClick}
<RequirePermission
permissions={
approvalStep === 1
? 'lti.purchase.approve.staff'
: approvalStep === 2
? 'lti.purchase.approve.manager'
: 'lti.purchase.receive'
}
>
<Icon icon='material-symbols:close' width={24} height={24} />
Reject
</Button>
<Button
variant='outline'
color='error'
className='w-full sm:w-fit'
onClick={handleRejectionClick}
>
<Icon icon='material-symbols:close' width={24} height={24} />
Reject
</Button>
</RequirePermission>
</div>
)}
</div>