fix: UI overhaul — align all HTMX views with Lumina Design System (46 fixes)
- All 7 pages rewritten: Dashboard, Terminal, Snippets, Keychain, SFTP, Settings, Brief - Apply consistent Lumina glassmorphic theme (rounded-2xl, shadows, borders, tracking) - Fix SVG icons not rendering — return template.HTML instead of string - Fix Alpine x-data scoping: terminal tabs, SFTP modals, snippet tag buttons - Fix dashboard search sending literal ?q=... - Rebuild CSS with all new Tailwind classes (62KB) - Add .air.toml with hot-reload config, docs/PERBAIKANUI.md checklist - Remove unused backup partials
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
|
||||
> **Purpose**: Memungkinkan AI agent berikutnya melanjutkan development tanpa mengulang atau merusak.
|
||||
> **Last Updated**: 2026-07-07
|
||||
> **Current Phase**: Sprint 0—6 selesai (V2 HTMX feature complete)
|
||||
> **Current Phase**: UI Fix — memperbaiki 107 visual issue dari `docs/PERBAIKANUI.md`
|
||||
|
||||
---
|
||||
|
||||
@@ -35,7 +35,8 @@ hostkeeper/ (root — bersih untuk V2)
|
||||
│ ├── TIMELINE.md Timeline 3.5 minggu
|
||||
│ ├── PERFROMANCE.md Performance & stability
|
||||
│ ├── UI_TERMIUS_REFERENCE.md Termius visual reference
|
||||
│ └── PROGRESS.md Status tracker
|
||||
│ ├── PROGRESS.md Status tracker
|
||||
│ └── PERBAIKANUI.md UI fix checklist (107 task)
|
||||
├── AGENTS.md ← file ini (checkpoint AI)
|
||||
└── README.md
|
||||
|
||||
@@ -118,12 +119,11 @@ Alasan:
|
||||
- **Sprint 5**: Terminal + xterm.js + WebSocket mock shell, tab management
|
||||
- **Sprint 6**: JSON file persistence (store package), `go.mod replace` directive for V1 crypto+knownhosts, model SSH fields, real SSH client for terminal (falls back to mock), dynamic host list from server
|
||||
|
||||
### 🐛 Bug Template (dari template/src/ — catatan saat implementasi)
|
||||
1. **P0**: Missing CSS keyframes (fade-in, scale-up, slide-in) → tambah di `custom.css`
|
||||
2. **P1**: `w-4.5 h-4.5` → ganti `w-5 h-5`
|
||||
3. **P2**: Tidak ada Error Boundary → not applicable (HTML template)
|
||||
4. **P2**: `as any` casts → not applicable (Go typed)
|
||||
5. **P3**: Auto-focus loss → handle via JS `focus()` di Alpine
|
||||
### 🐛 UI Fix Checklist — Lihat `docs/PERBAIKANUI.md`
|
||||
- **107 task** teridentifikasi dari audit visual vs template React
|
||||
- Acuan utama: 7 file di `template/src/components/`
|
||||
- Setiap task dihapus dari checklist setelah selesai
|
||||
- Urutan: Dashboard (P0) → Terminal (P0) → Snippets (P0) → Keychain/SFTP/Settings/Brief (P1)
|
||||
|
||||
---
|
||||
|
||||
@@ -181,24 +181,12 @@ app/backend/
|
||||
|
||||
---
|
||||
|
||||
## 6. Yang Harus Dilakukan Selanjutnya (First Actions)
|
||||
## 6. Yang Harus Dilakukan Selanjutnya (UI Fix)
|
||||
|
||||
Urutan eksekusi saat development dimulai:
|
||||
|
||||
```
|
||||
Sprint 0 — Setup:
|
||||
Step 1: mkdir -p app/backend
|
||||
Step 2: cd app/backend && go mod init git.tukangketik.id/swanadiva/hostkeeper/v2
|
||||
Step 3: go get github.com/gofiber/fiber/v2
|
||||
Step 4: go get github.com/gofiber/template/html/v2
|
||||
Step 5: Buat main.go (Fiber app skeleton + static + template engine)
|
||||
Step 6: Download htmx.min.js, alpine.min.js ke static/js/
|
||||
Step 7: Setup TailwindCSS v4: input.css → npx @tailwindcss/cli
|
||||
Step 8: Buat custom.css (dot-grid, glassmorphism, keyframes)
|
||||
Step 9: Buat views/layout.html + views/index.html + nav.html
|
||||
Step 10: Buat handler/health.go + handler/dashboard.go
|
||||
Step 11: Verify: buka http://localhost:1947 — layout terlihat
|
||||
```
|
||||
1. Baca `docs/PERBAIKANUI.md` — 107 task teridentifikasi
|
||||
2. Urutan: Dashboard (P0) → Terminal (P0) → Snippets (P0) → Keychain (P1) → SFTP (P1) → Settings (P1) → Brief (P1) → Global (P1)
|
||||
3. Setiap selesai satu task, hapus dari checklist `docs/PERBAIKANUI.md`
|
||||
4. Verify: `cd app/backend && go build && ./backend` lalu buka http://localhost:1947
|
||||
|
||||
---
|
||||
|
||||
@@ -214,6 +202,7 @@ Step 11: Verify: buka http://localhost:1947 — layout terlihat
|
||||
| Timeline 3.5 minggu | `docs/TIMELINE.md` |
|
||||
| Build system | `docs/BUILD_SYSTEM.md` |
|
||||
| Status tracker | `docs/PROGRESS.md` |
|
||||
| UI fix checklist | `docs/PERBAIKANUI.md` |
|
||||
| Template desain (React) | `template/AGENTS.md` (Lumina System) |
|
||||
| Template komponen (referensi) | `template/src/components/` |
|
||||
| V1 shared packages | `v1/pkg/ssh/`, `v1/pkg/crypto/`, `v1/pkg/storage/`, `v1/pkg/config/`, `v1/pkg/knownhosts/` |
|
||||
|
||||
Reference in New Issue
Block a user