feat: conditionally render payroll card grid only when data is available

This commit is contained in:
Yoga Pangestu 2026-04-30 13:41:43 +07:00
parent 917e60c013
commit 7fbf5dc6c2

View File

@ -76,6 +76,7 @@ export default function PayrollIndex({
)} )}
</div> </div>
{currentMonthPayrolls.length > 0 && (
<div className="flex flex-col gap-3"> <div className="flex flex-col gap-3">
<div className="grid gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4"> <div className="grid gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
{currentMonthPayrolls.map((payroll) => ( {currentMonthPayrolls.map((payroll) => (
@ -83,7 +84,9 @@ export default function PayrollIndex({
key={payroll.id} key={payroll.id}
payroll={payroll} payroll={payroll}
onClick={() => { onClick={() => {
if (hasPermission('Edit:PayrollAdjustment')) { if (
hasPermission('Edit:PayrollAdjustment')
) {
onEdit(payroll); onEdit(payroll);
} }
}} }}
@ -91,6 +94,7 @@ export default function PayrollIndex({
))} ))}
</div> </div>
</div> </div>
)}
<PayrollFormModal <PayrollFormModal
isOpen={isFormOpen} isOpen={isFormOpen}