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

src/components/pages/inventory/adjustment/InventoryAdjustmentTable.tsx

@@ -4,6 +4,7 @@ import Badge from '@/components/Badge';
 import Button from '@/components/Button';
 import SelectInput, { OptionType } from '@/components/input/SelectInput';
 import Table from '@/components/Table';
+import RequirePermission from '@/components/helper/RequirePermission';
 import { ROWS_OPTIONS } from '@/config/constant';
 import { isResponseSuccess } from '@/lib/api-helper';
 import { cn } from '@/lib/helper';
@@ -175,15 +176,17 @@ const InventoryAdjustmentTable = () => {
         <div className='flex flex-col gap-2 mb-4'>
           <div className='w-full flex flex-col sm:flex-row justify-between items-end sm:items-center gap-2'>
             <div className='w-full flex flex-row'>
-              <Button
+              <RequirePermission permissions='lti.inventory.create'>
-                href='/inventory/adjustment/add'
+                <Button
-                variant='outline'
+                  href='/inventory/adjustment/add'
-                color='primary'
+                  variant='outline'
-                className='w-full sm:w-fit'
+                  color='primary'
-              >
+                  className='w-full sm:w-fit'
-                <Icon icon='ic:round-plus' width={24} height={24} />
+                >
-                Tambah
+                  <Icon icon='ic:round-plus' width={24} height={24} />
-              </Button>
+                  Tambah
+                </Button>
+              </RequirePermission>
 
               {/* <DebouncedTextInput
                 name='search'

src/components/pages/inventory/movement/MovementTable.tsx

@@ -19,6 +19,7 @@ import SelectInput from '@/components/input/SelectInput';
 import RowDropdownOptions from '@/components/table/RowDropdownOptions';
 import RowCollapseOptions from '@/components/table/RowCollapseOptions';
 import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
+import RequirePermission from '@/components/helper/RequirePermission';
 
 const RowOptionsMenu = ({
   type = 'dropdown',
@@ -28,15 +29,17 @@ const RowOptionsMenu = ({
   props: CellContext<Movement, unknown>;
 }) => (
   <RowOptionsMenuWrapper type={type}>
-    <Button
+    <RequirePermission permissions='lti.inventory.transfer.detail'>
-      href={`/inventory/movement/detail/?movementId=${props.row.original.id}`}
+      <Button
-      variant='ghost'
+        href={`/inventory/movement/detail/?movementId=${props.row.original.id}`}
-      color='primary'
+        variant='ghost'
-      className='justify-start text-sm'
+        color='primary'
-    >
+        className='justify-start text-sm'
-      <Icon icon='mdi:eye-outline' width={16} height={16} />
+      >
-      Detail
+        <Icon icon='mdi:eye-outline' width={16} height={16} />
-    </Button>
+        Detail
+      </Button>
+    </RequirePermission>
   </RowOptionsMenuWrapper>
 );
 
@@ -145,15 +148,17 @@ const MovementTable = () => {
         <div className='flex flex-col gap-2 mb-4'>
           <div className='w-full flex flex-col sm:flex-row justify-between items-end sm:items-center gap-2'>
             <div className='w-full flex flex-row gap-2'>
-              <Button
+              <RequirePermission permissions='lti.inventory.transfer.create'>
-                href='/inventory/movement/add'
+                <Button
-                variant='outline'
+                  href='/inventory/movement/add'
-                color='primary'
+                  variant='outline'
-                className='w-full sm:w-fit'
+                  color='primary'
-              >
+                  className='w-full sm:w-fit'
-                <Icon icon='ic:round-plus' width={24} height={24} />
+                >
-                Tambah
+                  <Icon icon='ic:round-plus' width={24} height={24} />
-              </Button>
+                  Tambah
+                </Button>
+              </RequirePermission>
             </div>
 
             <DebouncedTextInput

src/components/pages/inventory/product/InventoryProductTable.tsx

@@ -7,6 +7,7 @@ import Table from '@/components/Table';
 import RowCollapseOptions from '@/components/table/RowCollapseOptions';
 import RowDropdownOptions from '@/components/table/RowDropdownOptions';
 import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
+import RequirePermission from '@/components/helper/RequirePermission';
 import { ROWS_OPTIONS } from '@/config/constant';
 import { isResponseSuccess } from '@/lib/api-helper';
 import { cn, formatCurrency, formatNumber } from '@/lib/helper';
@@ -31,15 +32,17 @@ const RowOptionsMenu = ({
   props: CellContext<InventoryProduct, unknown>;
 }) => (
   <RowOptionsMenuWrapper type={type}>
-    <Button
+    <RequirePermission permissions='lti.inventory.product_stock.detail'>
-      href={`/inventory/product/detail?inventoryProductId=${props.row.original.id}`}
+      <Button
-      variant='ghost'
+        href={`/inventory/product/detail?inventoryProductId=${props.row.original.id}`}
-      color='primary'
+        variant='ghost'
-      className='justify-start text-sm'
+        color='primary'
-    >
+        className='justify-start text-sm'
-      <Icon icon='mdi:eye-outline' width={16} height={16} />
+      >
-      Detail
+        <Icon icon='mdi:eye-outline' width={16} height={16} />
-    </Button>
+        Detail
+      </Button>
+    </RequirePermission>
   </RowOptionsMenuWrapper>
 );