# Dashboard Quick & Medium Improvements

> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.

**Goal:** Improve reliability, performance, and code quality of the HiHala Dashboard.

**Architecture:** Focused improvements across data layer (timeout, retry), UI (error handling, loading skeletons, code splitting), config (VAT rate), and DX (TypeScript strict, dead code removal).

**Tech Stack:** React 19, Vite 7, TypeScript 5, Chart.js

---

### Task 1: Fetch Timeout + Retry Logic

**Files:**
- Modify: `src/services/dataService.ts`

- [ ] Add `fetchWithTimeout` wrapper (10s timeout) around all fetch calls
- [ ] Add retry with exponential backoff (3 attempts, 1s/2s/4s) to `fetchNocoDBTable` and `discoverTableIds`
- [ ] Commit

### Task 2: Friendly Error Handling

**Files:**
- Modify: `src/App.tsx` (error display)
- Modify: `src/services/dataService.ts` (error classification)

- [ ] Add error classification in dataService (network, auth, config, unknown)
- [ ] Replace raw error message in App.tsx with user-friendly messages using i18n keys
- [ ] Add error keys to `src/locales/en.json` and `src/locales/ar.json`
- [ ] Commit

### Task 3: Remove Dead Code

**Files:**
- Delete: `src/hooks/useUrlState.ts`
- Delete: `src/services/sallaService.ts`

- [ ] Delete unused files
- [ ] Verify no imports reference them
- [ ] Commit

### Task 4: Route-Based Code Splitting

**Files:**
- Modify: `src/App.tsx`

- [ ] Lazy-load Dashboard, Comparison, Slides with `React.lazy` + `Suspense`
- [ ] Commit

### Task 5: Loading Skeletons

**Files:**
- Create: `src/components/shared/LoadingSkeleton.tsx`
- Modify: `src/App.tsx` (replace spinner with skeleton)
- Modify: `src/App.css` (skeleton styles)

- [ ] Create skeleton component (stat cards + chart placeholders)
- [ ] Use as Suspense fallback and initial loading state
- [ ] Commit

### Task 6: VAT Rate from Config

**Files:**
- Modify: `src/services/dataService.ts`

- [ ] Extract VAT_RATE to a named constant at top of file
- [ ] Commit

### Task 7: TypeScript Strict Mode

**Files:**
- Modify: `tsconfig.json`
- Modify: various files as needed to fix type errors

- [ ] Enable `strict: true`, `noImplicitAny: true`, `strictNullChecks: true`
- [ ] Fix all resulting type errors
- [ ] Verify build passes
- [ ] Commit