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

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
-      href={`/inventory/product/detail?inventoryProductId=${props.row.original.id}`}
-      variant='ghost'
-      color='primary'
-      className='justify-start text-sm'
-    >
-      <Icon icon='mdi:eye-outline' width={16} height={16} />
-      Detail
-    </Button>
+    <RequirePermission permissions='lti.inventory.product_stock.detail'>
+      <Button
+        href={`/inventory/product/detail?inventoryProductId=${props.row.original.id}`}
+        variant='ghost'
+        color='primary'
+        className='justify-start text-sm'
+      >
+        <Icon icon='mdi:eye-outline' width={16} height={16} />
+        Detail
+      </Button>
+    </RequirePermission>
   </RowOptionsMenuWrapper>
 );