first commit

docs/ADMIN_PANEL_PLAN.md

@@ -0,0 +1,75 @@
+# Admin Panel Baslangic Plani
+
+Bu plan `AGENTS.md`, `ADMIN_PANEL_PROMPT.md` ve `RULES.md` uyumunda hazirlandi.
+
+## 1) Onerilen Klasor Yapisi
+
+- `admin-panel/src/api`
+- `admin-panel/src/components`
+- `admin-panel/src/pages`
+- `admin-panel/src/stores`
+- `admin-panel/src/types`
+- `admin-panel/src/utils`
+
+## 2) Teknoloji Onerisi
+
+- React + TypeScript + Vite
+- React Router (route guard)
+- TanStack Query (server state)
+- Zustand (auth/UI state)
+
+## 3) Ekran Akislari
+
+- `GET /login` -> basarili login -> `/dashboard`
+- `GET /dashboard` -> ozet kartlar + son image bilgisi
+- `GET /images` -> liste + detay linki
+- `GET /images/:id` -> variant stream preview
+- `GET /health` -> backend durum gostergesi
+- `GET /settings` -> altyapi/TODO
+
+## 4) Auth ve API Client Mimarisi
+
+- Merkezi `apiRequest` fonksiyonu ile tum cagrilar
+- `Authorization: Bearer <access_token>` otomatik ekleme
+- 401 durumunda tekil refresh (deduplicate)
+- Refresh basarisizsa logout + login sayfasina yonlendirme
+- Backend'in global JSON error formatinin normalize edilmesi
+
+## 5) Component Listesi
+
+- `AppShell`
+- `ProtectedRoute`
+- `QueryState`
+- sayfa bazli form ve tablo bilesenleri
+
+## 6) State Management Yaklasimi
+
+- `stores/auth-store.ts`: user + token + hydrate + clear
+- server state: React Query ile cache/refetch
+
+## 7) Route Guard Yaklasimi
+
+- Public: `/login`
+- Private: `/dashboard`, `/images`, `/images/:id`, `/health`, `/settings`
+- Token yoksa `/login` redirect
+
+## 8) UI/UX Prensipleri
+
+- Sidebar + topbar layout
+- Loading / empty / error state ayrimi
+- Basit responsive duzen
+
+## 9) Guvenlik Onlemleri
+
+- Tokenlar central store + storage ile yonetilir
+- 401/403 ayrimi API error code ile gorunur
+- Hassas veriler UI'da loglanmaz
+
+## 10) Gelistirme Roadmap
+
+1. MVP auth + dashboard + images list/detay (tamamlandi)
+2. Pagination/filter/sort + detay metadata (arama/format filtresi + client pagination tamamlandi)
+3. Role-based guard + kullanici yonetimi (`/users`)
+4. UI sertlestirme (skeleton, toast, empty state varyasyonlari)
+5. Testler (auth flow, route guard, api error handling)
+