Source: docs-content/04-gaps-and-fixes.mdEdit this page

Nutqi β€” Gap Analysis, Fixes & Recommendations

Every gap found while deep-navigating the Figma. Severity: πŸ”΄ blocks a core journey Β· 🟠 degrades a journey Β· 🟑 polish/consistency. Each entry: Gap β†’ Fix (what we implement) β†’ Status in build.

A. Missing screens / dead ends#

G01 πŸ”΄ The guardian "Payments" screen is empty. The sidebar links to payments, the frame exists (node 1202-31659) but its body is blank; the design system only contains the specialist wallet ("Main" / "Transactions"). β†’ Fix: build the guardian payments page: per-booking payment history (date, specialist, session, amount, method, status, receipt download) reusing the transactions-row pattern; totals card row ("Total paid", "Being collected"). Payment execution itself is manual/at-center in v1 (see D-10); the page is a ledger. β†’ Implemented in apps/web route /(guardian)/payments.

G02 🟠 The login field is labeled "Name" with a person icon while signup and forgot-password use email β€” a user typing their display name will always fail. β†’ Fix: label it "Email address" with a mail icon, type=email, and email-format validation; error copy mentions email specifically.

G03 πŸ”΄ Center signup collects only personal fields. No center name, license, tax ID, address or branches β€” a center account cannot actually be provisioned from the designed form. β†’ Fix: keep step 1 as designed (owner's personal account), add step 2 "Center details": center name (ar/en), license number + document upload, phone, governorate/city, first branch; feeds the same activation-review pipeline specialists use.

G04 🟠 Booking modal ambiguity. Slot grid uses checkboxes (implies multi-select), shows no session type, duration, price or specialist confirmation, and the flow has no success screen. β†’ Fix: single-select slot chips; add session-type selector (Speech therapy / Skills development / Visual communication / Consultation) with duration+price pulled from the specialist's schedule config; add a summary + success step ("Your booking is pending confirmation").

G05 🟠 No OTP failure/expiry states. Only the happy path + countdown exist. β†’ Fix: wrong-code inline error, expired-code state with resend, attempt throttling (5 tries β†’ cooldown), and resend-channel choice (SMS/WhatsApp) aligned with notification channels.

G06 🟑 No empty states anywhere (bookings, programs, reviews, jobs, staff lists all designed full). β†’ Fix: empty-state kit (illustration + one-line hint + primary CTA) per list; e.g. bookings empty β†’ "Book your first session" CTA to search.

G07 🟑 No loading/skeleton/error page states. β†’ Fix: skeleton components for tables/cards/charts; global error boundary + bilingual 404/500 pages.

G08 🟠 Specialists can see jobs they applied to but have nowhere to discover jobs. Centers publish ("Post a job opening") but no browse/apply surface exists specialist-side. β†’ Fix: jobs marketplace tab inside "Jobs": open positions (filter by governorate/specialty/branch), job detail, apply with CV snapshot from profile; application then appears in the applied list with "Accepted"/"Pending"/"Rejected".

G09 🟠 Multi-child guardians have no child switcher. Frames exist for "Child info 2" but navigation between children is undesigned. β†’ Fix: child selector chip-row on top of "Profile" + "Add child" action; bookings/plans get a child filter.

G10 🟠 Online sessions have no meeting-link surface. Bookings can be online but nothing carries the call link. β†’ Fix: meetingUrl on confirmed online bookings; "Join session" button appears 15 min before start (guardian + specialist sides). Actual video provider is out of v1 scope β€” the field accepts any URL (Meet/Zoom).

G11 🟠 Notification bell exists in every topbar but there is no notifications panel/screen. β†’ Fix: dropdown (last 10) + full page with filters; wired to the events listed in the user guide; respects channel settings.

G12 🟠 Global search bar exists but no results page; guardians have no specialist-discovery screen at all (profiles are reachable only via direct link in the design). β†’ Fix: search/directory page: specialists (+centers) with filters β€” governorate, specialty (speech therapy/autism/skills development), session type, price range, rating; card grid β†’ profile.

G13 🟑 The "Languages" settings screen conflates UI language with spoken languages (language + level + add). β†’ Fix: split into (a) "App language": Arabic/English toggle (RTL/LTR switch, instant), and (b) "Spoken languages" (kept as designed, feeds child/specialist profile matching).

G14 🟠 No terms/privacy consent at signup and no legal pages. β†’ Fix: consent checkbox linking to bilingual Terms + Privacy pages (docs app hosts the content; web app renders them).

G15 🟑 No account lockout / too-many-attempts state on login (only wrong-password). β†’ Fix: backend throttling (5 fails β†’ 15 min lock) + designed lockout message with reset-password CTA.

G16 🟠 Center public identity missing. Guardians can view specialist profiles; centers (with branches, staff specialists) have no public profile despite being bookable businesses. β†’ Fix (recommended, v1.1): public center page: branches, specialists roster, reviews rollup. v1 keeps specialist-centric booking; documented as roadmap.

G17 🟑 Review moderation absent. Reviews post directly; specialist can only like/comment. β†’ Fix: report action + admin-side flag queue (API-level in v1, UI later).

G18 🟑 Delete confirmations exist ("Delete") but no undo. β†’ Fix: soft-delete + 10s undo toast for notes, plans (drafts), work-info entries; hard delete stays behind the designed red confirm modal.

G19 🟠 Specialist payments exist as wallet but there is no withdrawal-request flow (only a log of past withdrawals). β†’ Fix: "Request withdrawal" action with amount + payout method (bank/wallet number), request states ("Under review"/"Transferred"/"Rejected"); admin approves manually in v1.

G20 🟑 Attendance clock-in has no context/constraints (who presses it, where). β†’ Fix: clock in/out from staff dashboard with timestamp + optional branch selector; audit trail visible to owner/manager. Geofencing explicitly out of scope (documented).

B. Consistency & bilingual/RTL#

G21 🟑 Status vocabulary drift β€” booking uses Ω…ΨΉΩ„Ω‚/Ψ§Ω†ΨͺΨΈΨ§Ψ±/ΨͺΨ£Ψ¬ΩŠΩ„/ΨͺΩ…; jobs use مُعلق/ΨͺΩ… Ψ§Ω„Ω‚Ψ¨ΩˆΩ„/ΨͺΩ… الرفآ; plans use Ω„Ω… يΨͺΩ…/ΨͺΩ…. β†’ Fix: single status enum table in docs + shared <StatusChip> mapping enumβ†’color/icon/label(ar,en); color-blind-safe (icon + text, never color alone).

G22 🟠 English/LTR is entirely undesigned. All frames are Arabic RTL. β†’ Fix: full i18n from day one: next-intl with ar (default, RTL) + en (LTR); logical CSS properties (ps/pe, start/end) everywhere; direction-aware icons (arrows, chevrons flipped); numerals: Latin digits in both locales for data (dates/prices), Arabic-Indic optional later.

G23 🟑 Dates shown as 25\12\2025 with backslashes and mixed direction risk. β†’ Fix: locale-aware formatter (Intl.DateTimeFormat ar-EG/en-GB) wrapped in <bdi>; one formatDate/formatMoney util pair used everywhere (EGP currency).

G24 🟑 Egyptian-dialect microcopy mixed with MSA (Ψ§Ω„Ω„ΩŠ Ω„Ψ³Ψ© Ω…Ψ¬Ψ§ΩˆΨ¨Ψ΄ ΨΉΩ†Ω‡Ψ§ vs formal labels). β†’ Fix: keep the warm Egyptian tone deliberately (brand voice) but normalize per surface: dialect for guidance/toasts, MSA for labels/tables; documented in copy guide; English mirrors tone-neutral.

C. UX enhancements beyond the design (requested)#

Implemented as part of the build:

  • E01 Questionnaire autosave β€” plans are up to 3,650px of questions; answers autosave (debounced, per-question) with a "Saved automatically" indicator; resume where you left off. (Biggest UX win; long forms + mobile networks.)
  • E02 Progress bar in plan answering β€” sticky header with % answered + required-remaining count; page dots for multi-page diagnosis form.
  • E03 Toast system β€” success/error/undo toasts (RTL-aware, bottom-start).
  • E04 Optimistic UI β€” booking status chips, review like/comment, notification read-state update instantly with rollback on failure.
  • E05 Skeletons + shimmer for tables, cards, charts; no layout shift.
  • E06 Command palette (⌘K) in dashboards β€” jump to patient/booking/screen; Arabic + English fuzzy search.
  • E07 Slot picker upgrades β€” disabled past slots, "today/tomorrow" quick chips, timezone-safe rendering.
  • E08 File upload UX β€” drag&drop, image preview, progress bar, type/size validation, avatar crop.
  • E09 Animated stat counters + chart tooltips on dashboards (respects prefers-reduced-motion).
  • E10 Session reminder banner β€” next upcoming booking surfaces on guardian/specialist home with join/directions action.
  • E11 Table power-ups β€” column sort, sticky header, CSV/Excel/PDF export (as designed) done client-side.
  • E12 Form validation β€” inline, on-blur, bilingual messages; national-ID checksum (Egyptian 14-digit) validation.
  • E13 Notification badge realtime β€” SSE stream updates bell badge without refresh.
  • E14 Keyboard & a11y β€” focus rings, skip links, aria on chips/tabs/modals, contrast-checked palette.
  • E15 Draft persistence for center job postings ("Save as draft" as designed) + restore banner.

D. Decision log pointer#

Every choice made while implementing (framework versions, folder shapes, naming, scope cuts) is recorded conversation-style in 05-decisions.md per the product owner's instruction to auto-accept recommended options and document them.