feat: refactor column definitions to conditionally include action buttons based on user permissions

resources/js/pages/admin/finance/cash-account/columns.tsx

@@ -20,7 +20,7 @@ export function createCashAccountColumns(
 ): ColumnDef<CashAccount>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<CashAccount>[] = [
         {
             accessorKey: 'name',
             header: () => <span>Nama</span>,
@@ -39,7 +39,10 @@ export function createCashAccountColumns(
                 </span>
             ),
         },
-        {
+    ];
+
+    if (can('cash.update') || can('cash.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -70,6 +73,8 @@ export function createCashAccountColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/finance/cash-account/transaction-columns.tsx

@@ -47,7 +47,7 @@ export function createTransactionColumns(
 ): ColumnDef<CashTransaction>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<CashTransaction>[] = [
         {
             accessorKey: 'formatted_created_at',
             header: () => <span>Tanggal</span>,
@@ -136,7 +136,10 @@ export function createTransactionColumns(
                 return <span>{createdBy?.user_profile?.full_name ?? '-'}</span>;
             },
         },
-        {
+    ];
+
+    if (can('cash.update') || can('cash.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -174,6 +177,8 @@ export function createTransactionColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/finance/employee-advance/columns.tsx

@@ -91,7 +91,7 @@ export function createEmployeeAdvanceColumns(
     const { handleEdit, handleDeleteClick, handleApprove, handlePay, handleShowPayments, can, authUserId } =
         params;
 
-    return [
+    const columns: ColumnDef<EmployeeAdvance>[] = [
         {
             accessorKey: 'formatted_created_at',
             header: () => <span>Tanggal</span>,
@@ -162,7 +162,16 @@ export function createEmployeeAdvanceColumns(
                 <span>{getStatusBadge(row.getValue('status') as string)}</span>
             ),
         },
-        {
+    ];
+
+    if (
+        can('employee_advances.verify') ||
+        can('employee_advances.pay') ||
+        can('employee_advances.view_payments') ||
+        can('employee_advances.update') ||
+        can('employee_advances.delete')
+    ) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -226,6 +235,8 @@ export function createEmployeeAdvanceColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/finance/expense/columns.tsx

@@ -30,7 +30,7 @@ export function createExpenseColumns(
 ): ColumnDef<Expense>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<Expense>[] = [
         {
             accessorKey: 'formatted_created_at',
             header: () => <span>Tanggal</span>,
@@ -83,7 +83,10 @@ export function createExpenseColumns(
                 return <span>{createdBy?.user_profile?.full_name ?? '-'}</span>;
             },
         },
-        {
+    ];
+
+    if (can('expenses.update') || can('expenses.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -114,6 +117,8 @@ export function createExpenseColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/finance/payroll-period/columns.tsx

@@ -174,15 +174,15 @@ export function createPayrollPeriodColumns(
         });
     }
 
-    columns.push(
+    columns.push({
-        {
         accessorKey: 'status',
         header: () => <span>Status</span>,
         cell: ({ row }) => (
             <span>{getStatusBadge(row.getValue('status') as string)}</span>
         ),
-        },
+    });
-        {
+
+    columns.push({
         id: 'actions',
         header: () => <span className="block text-center">Aksi</span>,
         meta: {
@@ -224,8 +224,7 @@ export function createPayrollPeriodColumns(
                 />
             );
         },
-        },
+    });
-    );
 
     return columns;
 }

resources/js/pages/admin/hr/employee/columns.tsx

@@ -54,7 +54,7 @@ export function createEmployeeColumns(
         canViewAll,
     } = params;
 
-    return [
+    const columns: ColumnDef<Employee>[] = [
         {
             accessorKey: 'user_profile.full_name',
             id: 'full_name',
@@ -154,7 +154,14 @@ export function createEmployeeColumns(
                 );
             },
         },
-        {
+    ];
+
+    if (
+        can('employees.update') ||
+        can('employees.reset_password') ||
+        can('employees.delete')
+    ) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -193,6 +200,8 @@ export function createEmployeeColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/hr/leave-request/columns.tsx

@@ -64,7 +64,7 @@ export function createLeaveRequestColumns(
     const { handleEdit, handleDeleteClick, handleApprove, handleReject, can } =
         params;
 
-    return [
+    const columns: ColumnDef<LeaveRequest>[] = [
         {
             id: 'employee_name',
             header: () => <span>Oleh</span>,
@@ -112,7 +112,14 @@ export function createLeaveRequestColumns(
                 <span>{getStatusBadge(row.getValue('status') as string)}</span>
             ),
         },
-        {
+    ];
+
+    if (
+        can('leave_requests.verify') ||
+        can('leave_requests.update') ||
+        can('leave_requests.delete')
+    ) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -167,6 +174,8 @@ export function createLeaveRequestColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/manage/cutting/cutting-card.tsx

@@ -139,6 +139,7 @@ export function CuttingCardRow({
                             )}
                         </div>
 
+                        {(can('cuttings.update') || can('cuttings.delete')) && (
                             <RowActions
                                 actions={[
                                     {
@@ -158,6 +159,7 @@ export function CuttingCardRow({
                                 ]}
                                 wrapperClassName="flex shrink-0 items-center gap-1"
                             />
+                        )}
                     </div>
                 </CardContent>
             </Card>

resources/js/pages/admin/manage/purchase/purchase-card.tsx

@@ -126,6 +126,7 @@ export function PurchaseCardRow({
                             )}
                         </div>
 
+                        {(can('purchases.update') || can('purchases.delete')) && (
                             <RowActions
                                 actions={[
                                     {
@@ -145,6 +146,7 @@ export function PurchaseCardRow({
                                 ]}
                                 wrapperClassName="flex shrink-0 items-center gap-1"
                             />
+                        )}
                     </div>
                 </CardContent>
             </Card>

resources/js/pages/admin/manage/restock/restock-card.tsx

@@ -135,6 +135,7 @@ export function RestockCardRow({
                         </div>
                     </div>
 
+                    {(can('restocks.update') || can('restocks.delete')) && (
                         <RowActions
                             actions={[
                                 {
@@ -154,6 +155,7 @@ export function RestockCardRow({
                             ]}
                             wrapperClassName="flex shrink-0 items-center gap-1"
                         />
+                    )}
                 </div>
             </CardContent>
         </Card>

resources/js/pages/admin/manage/transaction/transaction-card.tsx

@@ -183,6 +183,7 @@ export function TransactionCardRow({
                         </div>
                     </div>
 
+                    {(can('orders.update') || can('orders.delete')) && (
                         <RowActions
                             actions={[
                                 ...(transaction.status === 'pending' && can('orders.update')
@@ -234,6 +235,7 @@ export function TransactionCardRow({
                             ]}
                             wrapperClassName="flex shrink-0 items-center gap-1"
                         />
+                    )}
                 </div>
             </CardContent>
         </Card>

resources/js/pages/admin/master/category/columns.tsx

@@ -18,7 +18,7 @@ export function createCategoryColumns(
 ): ColumnDef<Category>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<Category>[] = [
         {
             accessorKey: 'name',
             header: () => <span>Nama</span>,
@@ -28,7 +28,10 @@ export function createCategoryColumns(
                 </span>
             ),
         },
-        {
+    ];
+
+    if (can('categories.update') || can('categories.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -59,6 +62,8 @@ export function createCategoryColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/master/customer/columns.tsx

@@ -20,7 +20,7 @@ export function createCustomerColumns(
 ): ColumnDef<Customer>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<Customer>[] = [
         {
             accessorKey: 'name',
             header: () => <span>Nama</span>,
@@ -46,7 +46,10 @@ export function createCustomerColumns(
                 </span>
             ),
         },
-        {
+    ];
+
+    if (can('customers.update') || can('customers.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -77,6 +80,8 @@ export function createCustomerColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/master/product/columns.tsx

@@ -90,7 +90,7 @@ export function createProductColumns(
         can,
     } = params;
 
-    return [
+    const columns: ColumnDef<Product>[] = [
         {
             id: 'expand',
             header: '',
@@ -338,7 +338,10 @@ export function createProductColumns(
                 );
             },
         },
-        {
+    ];
+
+    if (can('products.update') || can('products.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -369,6 +372,8 @@ export function createProductColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/master/product/product-card.tsx

@@ -144,6 +144,7 @@ export function ProductCardRow({
                         </div>
                     </div>
 
+                    {(can('products.update') || can('products.delete')) && (
                         <RowActions
                             actions={[
                                 {
@@ -163,6 +164,7 @@ export function ProductCardRow({
                             ]}
                             wrapperClassName="flex shrink-0 items-center gap-1"
                         />
+                    )}
                 </div>
             </CardContent>
         </Card>

resources/js/pages/admin/master/product/variant/sub-row.tsx

@@ -34,6 +34,8 @@ export function VariantSubRow({
         variant: ProductVariant;
     } | null>(null);
 
+    const canAnyAction = can('products.transfer_stock') || can('products.view_stock_mutations') || can('products.update') || can('products.delete');
+
     return (
         <div className="overflow-x-auto">
             <Table>
@@ -52,16 +54,18 @@ export function VariantSubRow({
                         </TableHead>
                         <TableHead className="text-center">Stok Ecer</TableHead>
                         <TableHead>Harga</TableHead>
+                        {canAnyAction && (
                             <TableHead className="w-[120px] text-center">
                                 Aksi
                             </TableHead>
+                        )}
                     </TableRow>
                 </TableHeader>
                 <TableBody>
                     {variants.length === 0 ? (
                         <TableRow>
                             <TableCell
-                                colSpan={8}
+                                colSpan={canAnyAction ? 8 : 7}
                                 className="text-center text-muted-foreground"
                             >
                                 Tidak ada varian.
@@ -116,6 +120,7 @@ export function VariantSubRow({
                                         '-'
                                     )}
                                 </TableCell>
+                                {canAnyAction && (
                                     <TableCell>
                                         <RowActions
                                             actions={[
@@ -173,6 +178,7 @@ export function VariantSubRow({
                                             ]}
                                         />
                                     </TableCell>
+                                )}
                             </TableRow>
                         ))
                     )}

resources/js/pages/admin/master/raw-material/raw-material-card.tsx

@@ -94,6 +94,7 @@ export function RawMaterialCardRow({
                         </div>
                     </div>
 
+                    {(can('raw_materials.update') || can('raw_materials.delete')) && (
                         <RowActions
                             actions={[
                                 {
@@ -113,6 +114,7 @@ export function RawMaterialCardRow({
                             ]}
                             wrapperClassName="flex shrink-0 items-center gap-1"
                         />
+                    )}
                 </div>
             </CardContent>
         </Card>

resources/js/pages/admin/master/raw-material/variant/sub-row.tsx

@@ -47,6 +47,8 @@ export function RawMaterialVariantSubRow({
         );
     }
 
+    const canAnyAction = can('raw_materials.update') || can('raw_materials.delete');
+
     return (
         <div className="overflow-x-auto">
             <Table>
@@ -59,16 +61,18 @@ export function RawMaterialVariantSubRow({
                         <TableHead>Nama Varian</TableHead>
                         <TableHead>Harga</TableHead>
                         <TableHead className="text-center">Stok</TableHead>
+                        {canAnyAction && (
                             <TableHead className="w-[100px] text-center">
                                 Aksi
                             </TableHead>
+                        )}
                     </TableRow>
                 </TableHeader>
                 <TableBody>
                     {variants.length === 0 ? (
                         <TableRow>
                             <TableCell
-                                colSpan={6}
+                                colSpan={canAnyAction ? 6 : 5}
                                 className="text-center text-muted-foreground"
                             >
                                 Tidak ada varian.
@@ -101,6 +105,7 @@ export function RawMaterialVariantSubRow({
                                 <TableCell className="text-center">
                                     {formatNumber(variant.stock)}
                                 </TableCell>
+                                {canAnyAction && (
                                     <TableCell>
                                         <RowActions
                                             actions={[
@@ -132,6 +137,7 @@ export function RawMaterialVariantSubRow({
                                             ]}
                                         />
                                     </TableCell>
+                                )}
                             </TableRow>
                         ))
                     )}

resources/js/pages/admin/master/supplier/columns.tsx

@@ -20,7 +20,7 @@ export function createSupplierColumns(
 ): ColumnDef<Supplier>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<Supplier>[] = [
         {
             accessorKey: 'name',
             header: () => <span>Nama</span>,
@@ -46,7 +46,10 @@ export function createSupplierColumns(
                 </span>
             ),
         },
-        {
+    ];
+
+    if (can('suppliers.update') || can('suppliers.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -77,6 +80,8 @@ export function createSupplierColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }

resources/js/pages/admin/roles/columns.tsx

@@ -19,7 +19,7 @@ export function createRoleColumns(
 ): ColumnDef<Role>[] {
     const { handleEdit, handleDeleteClick, can } = params;
 
-    return [
+    const columns: ColumnDef<Role>[] = [
         {
             accessorKey: 'name',
             header: () => <span>Nama Role</span>,
@@ -44,7 +44,10 @@ export function createRoleColumns(
                 </span>
             ),
         },
-        {
+    ];
+
+    if (can('roles.update') || can('roles.delete')) {
+        columns.push({
             id: 'actions',
             header: () => <span className="block text-center">Aksi</span>,
             meta: {
@@ -75,6 +78,8 @@ export function createRoleColumns(
                     />
                 );
             },
-        },
+        });
-    ];
+    }
+
+    return columns;
 }