Task #301: Custom editor fonts + Tab quick-add for attendees

Curated 22 font files from the user's uploaded zip into
artifacts/tx-os/public/fonts/ and exposed five families in the
in-place editor's font dropdown:
  - DIN Next LT Arabic (5 weights)
  - Tajawal (7 weights)
  - Helvetica Neue LT Arabic (3 weights)
  - Helvetica Neue (5 weights)
  - Majalla (2 weights)
Declared via @font-face in artifacts/tx-os/src/custom-fonts.css with
font-display: swap so weights are only fetched on demand. Each
<option> in the toolbar dropdown now previews itself in its own
family.

Tab quick-add: pressing Tab inside an attendee name's EditableCell
commits the current value and immediately opens a new pending
attendee row right after it, so users can type names continuously
without mousing. Implemented via:
  - new optional `onTabNext` prop on EditableCell, captured into a
    ref so the handler (created once via useEditor with [] deps)
    always fires the latest callback;
  - new `chainStartAdd` shared prop on AttendeeFlow that bypasses
    the parent's `hasAnyPending` UI gate (the state-level guard in
    `setPendingAttendee(prev => prev ? prev : new)` still prevents
    truly overlapping pendings);
  - wiring on both existing-attendee and pending-attendee cells.

Drift from plan:
- The plan also mentioned Shift+Tab to focus the previous person.
  Scoped out — focus-from-outside isn't supported by EditableCell
  today, and the user only asked for forward Tab. Shift+Tab now
  falls through to default browser focus behaviour.

E2E test (testing skill) passed for both features. Architect review
returned a Pass with one minor note that IBM Plex Sans Arabic has
no @font-face entry in custom-fonts.css — that family is already
loaded via the existing Google Fonts <link> in index.html (it is
the app's default --app-font-sans), so the dropdown option works
as expected.

Pre-existing api-server test failures are unrelated and predate
this task.
This commit is contained in:
riyadhafraa
2026-05-01 19:10:25 +00:00
parent a79e1e125a
commit adf70e4f28
27 changed files with 264 additions and 5 deletions
+2
View File
@@ -43,6 +43,8 @@ The project is structured as a pnpm monorepo.
- **Executive Meetings Module**: A comprehensive module with scheduling, CRUD operations for meetings, change requests, approvals, tasks, notifications, and an audit log. RBAC is enforced via five role sets (READ/MUTATE/APPROVE/REQUEST/ADMIN_AUDIT). All mutations are wrapped in database transactions to ensure data consistency and atomic audit logging.
- **Optimistic Locking**: Implemented for Executive Meeting postponements to prevent concurrent updates from silently overwriting changes, using `expectedUpdatedAt` and returning a 409 conflict on mismatch.
- **Upcoming Meeting Alert**: A global, draggable alert component appears when an Executive Meeting is within five minutes of starting, providing options to postpone, reschedule, or cancel the meeting.
- **Custom Editor Fonts**: The in-place rich-text cell editor (attendee names, meeting titles, etc.) ships a curated set of self-hosted Arabic + Latin font families (DIN Next LT Arabic, Tajawal, Helvetica Neue LT Arabic, Helvetica Neue, Majalla) declared in `artifacts/tx-os/src/custom-fonts.css` with `font-display: swap`. Files live under `artifacts/tx-os/public/fonts/`.
- **Tab Quick-Add Attendees**: Pressing Tab inside an attendee name cell commits the current value and immediately opens a new pending attendee row right after, so users can keep typing names without using the mouse. Implemented via an `onTabNext` prop on `EditableCell` and a `chainStartAdd` prop on `AttendeeFlow` that bypasses the single-pending UI gate (the parent's state-level guard still prevents truly overlapping pendings).
### Feature Specifications
- **خدماتي (My Services)**: Displays a grid of service cards with availability status.