Daily review 2026-07-05

[NghaReformer]

OhadaLearn Daily Review — 2026-07-05

Automated review of the main branch against CLAUDE.md constraints.
npm run i18n:check → PASSED (1331 keys, EN/FR parity confirmed).

---

1. Bugs & Issues

Critical

None found.

---

High

H1 — $lib/server/db/types imported in a client component
src/lib/components/feedback/FeedbackForm.svelte:7

import type { FeedbackType, FeedbackSeverity } from '$lib/server/db/types';

SvelteKit enforces the $lib/server/ boundary at the module-resolution level. Although TypeScript erases import type at transpile time, the boundary check can fire before stripping depending on the adapter/Vite version, and it is explicitly prohibited by CLAUDE.md. The two types are plain string unions with no server-only dependencies.
Fix: Move FeedbackType and FeedbackSeverity to a new src/lib/types/feedback.ts and update imports in both the component and the server handler.

---

H2 — --orange design token is missing; KpiStrip always falls back to hardcoded hex
src/lib/components/playground/KpiStrip.svelte:76

color: var(--orange, #f59e0b);

--orange is never defined in src/lib/theme/tokens.ts (only --amber and --amber-glow exist). The CSS fallback is always used — a hardcoded colour that bypasses the theme system.
Fix: Rename to var(--amber) or add an orange token to tokens.ts and wire it through css-generator.ts.

---

Medium

M1 — Repeated hardcoded rgba(255, 255, 255, 0.02) throughout CVP playground

• src/lib/playgrounds/cvp/Playground.svelte:331, 367
• src/lib/playgrounds/cvp/components/WhatIfPanel.svelte:318
• src/lib/playgrounds/cvp/components/IndifferencePanel.svelte:155, 201
• src/lib/playgrounds/cvp/components/MultiProductForm.svelte:261, 365, 412
• src/lib/playgrounds/cvp/components/SensitivityTable.svelte:272, 328, 355
• src/lib/playgrounds/cvp/components/GoalSeekPanel.svelte:198

All use background: rgba(255, 255, 255, 0.02) — hardcoded colour outside the theme system.
Fix: Add --surface-raise: rgba(255,255,255,.02) to tokens.ts and reference var(--surface-raise).

---

M2 — CategoryBreakdownDonut hardcodes 9 hex colours that diverge from theme tokens
src/lib/playgrounds/bank-reconciliation/components/CategoryBreakdownDonut.svelte:31–39
The hex strings don't match token values (e.g. #6ea8fe used for accent vs. token #7c7fff; #22c55e for green vs. #34d399), making the donut palette visually inconsistent.
Fix: Use CSS custom properties (var(--accent), var(--green), var(--error), var(--amber)) and add tokens for the remaining unique colours.

---

M3 — bank-reconciliation components use wrong fallback hex values in CSS vars
ReconciliationFlow.svelte, ScenarioWalkthrough.svelte, BankStatementPanel.svelte

var(--accent, #6ea8fe)   /* token: #7c7fff */
var(--green,  #22c55e)   /* token: #34d399 */
var(--error,  #ef4444)   /* token: #f06070 */

Fix: Remove hex fallbacks or update them to match actual token values.

---

M4 — Hardcoded #fff on active interactive elements

• src/routes/[lang]/learn/+page.svelte:202
• src/routes/[lang]/chart-of-accounts/+page.svelte:423, 458
• src/lib/playgrounds/journal-entry/components/EntryHistory.svelte:400

Fix: Replace #fff with var(--bg).

---

M5 — Inline style="..." on WaitlistForm honeypot
src/lib/components/WaitlistForm.svelte:55
CLAUDE.md: "No inline styles." The FeedbackForm honeypot already uses a .hp CSS class.
Fix: Extract to a CSS class in the component <style> block.

---

M6 — requestFullscreen() result not awaited; isFullscreen can become stale
src/routes/[lang]/playgrounds/[slug]/+page.svelte:47–48

target.requestFullscreen();  // Promise — not awaited
isFullscreen = true;         // set unconditionally before promise resolves

If the browser rejects fullscreen, isFullscreen stays true and the fullscreenchange event never fires to correct it.
Fix: Remove the manual isFullscreen = true/false assignments and let the existing fullscreenchange $effect be the sole source of truth. Add .catch(() => {}) on both calls.

---

Low

L1 — SVG chart in RegimeComparison has role="img" but no accessible name
src/lib/playgrounds/interest/components/RegimeComparison.svelte:121
Screen readers announce "image" with no context.
Fix: Add aria-label={translate('int.compare.title')} to the <svg> element.

---

L2 — Emoji playground icons violate CLAUDE.md ("No emoji icons")
src/lib/data/playgrounds.ts:19–73
Every PlaygroundMeta entry uses emoji as its icon value.
Fix: Replace with inline-SVG path strings or a named icon registry.

---

L3 — GoalSeekPopover uses style:left / style:top (inline styles)
src/lib/playgrounds/interest/components/GoalSeekPopover.svelte:125–126
Fix: Use CSS custom properties (--pop-x, --pop-y) set on a wrapper and consumed in the scoped style, or add a code comment documenting the exception.

---

L4 — WaitlistForm uses placeholder translation key as label text
src/lib/components/WaitlistForm.svelte:60
Label and placeholder resolve to the same string. Labels persist; placeholders don't.
Fix: Add dedicated waitlist.*.label keys to EN/FR namespaces for the three form fields.

---

2. New Playground Ideas

Existing playgrounds confirmed: TVM, CVP, Journal Entries, Loan Amortization, Asset Depreciation, Bank Reconciliation, Interest Lab.

---

P1 — Balance Sheet Builder / Constructeur de bilan

Target learner: Licence 2, Licence 3
Pedagogical objective: Students produce journal entries but struggle to map the trial balance to the SYSCOHADA balance sheet structure (Actif / Passif). Closes the loop between the Journal Entries playground and the final financial statement.
Core interaction: Learner receives a pre-seeded trial balance (SYSCOHADA class codes) and drags accounts into the correct balance sheet sections. A live balance indicator shows whether Actif = Passif.
Inputs / outputs: Editable trial balance → formatted SYSCOHADA balance sheet with class subtotals and balance check.
Complements existing: Downstream of Journal Entries; completes the accounting cycle (entry → ledger → balance sheet).

---

P2 — Inventory Valuation / Valorisation des stocks (PMP & FIFO)

Target learner: Licence 2
Pedagogical objective: PMP (Prix Moyen Pondéré) is mandatory under SYSCOHADA for Classe 3 goods. Students confuse perpetual vs. periodic PMP recalculation and mix it up with FIFO.
Core interaction: Learner enters a purchase/sale transaction sequence. A real-time fiche de stock renders in PMP and FIFO side-by-side showing how unit cost and total value diverge. Clicking a row explains the step.
Inputs / outputs: Transaction log (date, type, qty, unit price), method selector → stock card with running unit cost, stock value, and COGS per transaction.
Complements existing: Feeds Classe 3 account values into the Journal Entries playground; bridges the two playgrounds directly.

---

P3 — Payroll Calculator / Calculateur de fiche de paie

Target learner: Licence 3, practicing professional
Pedagogical objective: Gross→net salary computation involving CNSS employee/employer shares and IRPP is routinely miscalculated; rates differ by OHADA country.
Core interaction: Learner enters gross salary and selects a country (Cameroon, Senegal, Ivory Coast). A waterfall chart shows CNSS and IRPP deductions to net pay. A second pane auto-generates the SYSCOHADA payroll journal entry (compte 661, 4311–4321, 5211).
Inputs / outputs: Gross salary, country, category, period → pay slip, IRPP/CNSS breakdown, journal entry.
Complements existing: No existing playground covers statutory deductions; connects directly to Journal Entries for compte 66x content.

---

P4 — VAT Accounting / Comptabilité TVA

Target learner: Licence 3, Master 1, practicing professional
Pedagogical objective: Students mis-classify TVA collectée vs. TVA déductible and mis-time the declaration. Core misconception: treating TVA as income/expense rather than a tax liability/asset wash-through.
Core interaction: Learner enters purchase/sale invoices with TVA rates (0 %, 10 %, 19.25 % for Cameroon). The playground builds the TVA ledger (compte 4455/4456/4457), computes net payable or credit, and renders accounting entries plus a monthly declaration form. Toggle: "invoice method" vs. "cash method."
Inputs / outputs: Invoice table, declaration period, TVA method → TVA ledger, net payable/credit, journal entries, declaration form.
Complements existing: No existing playground models indirect tax; TVA positions feed into Bank Reconciliation and the Balance Sheet Builder.

---

P5 — TAFIRE — Working Capital Flow / Tableau de Financement

Target learner: Master 1, Master 2, practicing professional
Pedagogical objective: TAFIRE (Tableau Financier des Ressources et des Emplois) is unique to SYSCOHADA — it has no IFRS/US-GAAP equivalent. Students at Licence level confuse it with a cash flow statement; the playground clarifies the FRNG/BFR two-part structure.
Core interaction: Learner receives two consecutive SYSCOHADA balance sheets (N-1, N). The playground auto-computes FRNG and BFR changes and classifies each movement into Ressources / Emplois stables vs. BFR variations. Learner can override assignments; a cash-flow waterfall confirms the tableau balances.
Inputs / outputs: Balance sheet line items for year N and N-1, net income → completed TAFIRE with FRNG Δ, BFR Δ, and cash balance verification.
Complements existing: Logical capstone of the Balance Sheet Builder (P1). The trio Journal Entries → Balance Sheet Builder → TAFIRE forms a complete SYSCOHADA accounting cycle simulation.

---

Generated by Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
ohadalearn	Ready	Preview, Comment	Jul 5, 2026 11:18pm