geocrop-platform./apps/nextgen/.harness/changelogs/2026-07-18-p1-4-finance-com...

2.4 KiB

2026-07-18 — P1-4 modal migration: finance/* complete + new <Drawer> component

Branch: feat/p1-4-modals-finance Worktree: .worktrees/feat-p1-4-modals-finance

Why

Closes the remaining finance/* modals that the prior partial PR couldn't reach because they needed either a centered modal or a side drawer.

Changes

client/src/components/ui/Drawer.tsx (new)

Right-side slide-in panel component. Symmetric to <Modal>:

  • open, onClose, title, icon, maxWidth, zIndex, footer, children — same shape as <Modal> props.
  • Body uses <DrawerHeader> (sticky top) and <DrawerFooter> (sticky bottom) slots.
  • Default maxWidth is max-w-2xl (vs Modal's max-w-xl).
  • Default zIndex is 110 (same as Modal).
  • Backdrop click-outside + Escape-to-close + scroll-lock behaviour matches Modal.

client/src/pages/finance/StudentGroups.tsx (3 modals migrated)

  • Delete group? (confirm) — red destructive dialog.
  • New student group / Edit X — name + description + type + colour form.
  • Add members to X — mode dropdown (all / by class / by IDs) with conditional UID input.

client/src/pages/finance/StudentGroupDetail.tsx (1 modal migrated)

  • Remove member? — confirm dialog.

client/src/pages/finance/Invoices.tsx (1 drawer migrated)

  • Invoice detail (right-side drawer, max-w-2xl) — replaced the inline fixed inset-0 ... slide-in-from-right pattern with <Drawer>.

client/src/pages/finance/Payslips.tsx (1 drawer migrated)

  • Payslip detail (right-side drawer, max-w-md) — summary tile + Earnings/Deductions rows + "Open full payslip view" footer action.

Housekeeping

  • Cleaned up an orphan </div>);} left over from the previous Discounts.tsx migration (commit 4f8c33f) — that dangling closure was a pre-existing TS error and is now fixed.

Verification

  • node scripts/lint-no-inline-modals.jsfinance/*: 6 → 0 (StudentGroups, StudentGroupDetail, Invoices, Payslips all clean).
  • Whole-tree lint: only Messages.tsx and other out-of-scope files remain (already covered by other PRs).
  • npx tsc --noEmit for finance/* is clean except for two pre-existing errors that are not introduced by this PR: StudentGroup is exported from the store via a different path (consistency fix, deferred), and Trips.tsx:118 references Wallet without importing it (one-line import, deferred).