refactor: rename features to room-based directory structure

- Rename features/dashboard → features/front_hall
- Update routes: /, /control-room, /parlor, /settings
- Update navigation to 4 rooms (removed chat tab - will be omnipresent dock)
- Add docs/UI_LAYOUT.md with wireframes and responsive specs
- Update ARCHITECTURE.md and PLAN.md to reflect room structure

Directory structure now mirrors "Rooms of the Estate" UI navigation:
- front_hall/ (dashboard)
- control_room/ (infrastructure - containers, stacks, etc.)
- parlor/ (home automation)
- library/ (future)
- study/ (future, hidden)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2025-12-30 23:14:40 +01:00
co-authored by Claude Opus 4.5
parent adcb0e0427
commit a4aaea33b8
8 changed files with 505 additions and 126 deletions
+94 -66
View File
@@ -91,7 +91,8 @@ tatlock-ui/
│ ├── API_INTEGRATION.md # Core API and Tatlock API endpoints
│ ├── DEPLOYMENT.md # Docker, NPM, Portainer setup
│ ├── DATAGRID.md # DataGrid component API specification
│ └── THEMING.md # Theme system documentation
│ ├── THEMING.md # Theme system documentation
│ └── UI_LAYOUT.md # Wireframes, responsive breakpoints, room navigation
```
**Content for ARCHITECTURE.md** - Document:
@@ -165,32 +166,31 @@ lib/shared/components/data_grid/
└── core_api_source.dart # Core API data source adapter
```
### Phase 3: Dashboard (Organizr Replacement)
### Phase 3: Front Hall (Organizr Replacement)
**Goal**: Replace Organizr homepage with Tatlock UI dashboard.
**Features to match** (from portainer-ui.png):
- Sidebar navigation with grouped items
- System metrics gauges (CPU, Memory, Disk)
- Weather widget (optional - requires API)
- Air quality widget (optional)
- System metrics gauges (CPU, Memory, Disk, Containers)
- Service quick links grid
- Recent activity timeline
- Chat dock expanded by default
**Files to create**:
```
lib/features/dashboard/
lib/features/front_hall/
├── presentation/
│ ├── pages/dashboard_page.dart
│ ├── pages/front_hall_page.dart
│ └── widgets/
│ ├── metrics_gauge.dart
│ ├── stat_card.dart
│ ├── service_card.dart
│ ├── service_grid.dart
│ └── quick_actions.dart
│ └── activity_timeline.dart
├── domain/
│ ├── entities/system_metrics.dart
│ └── repositories/dashboard_repository.dart
│ └── repositories/front_hall_repository.dart
└── data/
├── datasources/core_api_dashboard_source.dart
└── repositories/dashboard_repository_impl.dart
├── datasources/core_api_front_hall_source.dart
└── repositories/front_hall_repository_impl.dart
```
**Core API endpoints used**:
@@ -198,35 +198,41 @@ lib/features/dashboard/
- `GET /infrastructure/widget-data` - Services + groups
- `GET /health` - Overall health status
### Phase 4: Container Management
### Phase 4: Control Room - Container Management
**Goal**: Full container CRUD and monitoring.
**Files to create**:
```
lib/features/containers/
├── presentation/
│ ├── pages/
│ │ ├── containers_list_page.dart
│ │ └── container_detail_page.dart
│ ├── widgets/
│ │ ├── container_status_badge.dart
│ │ ├── container_logs_viewer.dart
│ │ └── container_resource_chart.dart
│ └── providers/
│ └── containers_provider.dart
├── domain/
│ ├── entities/container.dart
│ ├── repositories/container_repository.dart
│ └── usecases/
│ ├── get_containers.dart
│ ├── start_container.dart
│ ├── stop_container.dart
│ ├── restart_container.dart
│ └── get_container_logs.dart
└── data/
├── models/container_model.dart
├── datasources/containers_datasource.dart
└── repositories/container_repository_impl.dart
lib/features/control_room/
├── shared/ # Shared within Control Room
│ └── widgets/
│ └── resource_chart.dart
├── containers/
│ ├── presentation/
│ │ ├── pages/
│ │ │ ├── containers_list_page.dart
│ │ │ └── container_detail_page.dart
│ │ ├── widgets/
│ │ │ ├── container_status_badge.dart
│ │ │ └── container_logs_viewer.dart
│ │ └── providers/
│ │ └── containers_provider.dart
│ ├── domain/
│ │ ├── entities/container.dart
│ │ ├── repositories/container_repository.dart
│ │ └── usecases/
│ │ ├── get_containers.dart
│ │ ├── start_container.dart
│ │ ├── stop_container.dart
│ │ ├── restart_container.dart
│ │ └── get_container_logs.dart
│ └── data/
│ ├── models/container_model.dart
│ ├── datasources/containers_datasource.dart
│ └── repositories/container_repository_impl.dart
├── stacks/ # Future
├── networks/ # Future
└── volumes/ # Future
```
**Core API endpoints used**:
@@ -236,17 +242,20 @@ lib/features/containers/
- `POST /infrastructure/containers/{id}/{action}`
- `GET /infrastructure/resources/containers`
### Phase 5: LLM Chat Interface
**Goal**: Custom chat UI for Tatlock agents with SSE streaming.
### Phase 5: Chat Dock (Omnipresent)
**Goal**: Custom chat UI for Tatlock agents with SSE streaming. Injected at layout level, not a room.
**Future requirement**: Expand-to-fullscreen option as secondary UI overlay.
**Files to create**:
```
lib/core/api/
└── sse_client.dart # Platform-aware SSE streaming
lib/features/chat/
lib/chat/ # Top-level, not under features/
├── presentation/
│ ├── pages/chat_page.dart
│ ├── chat_dock.dart # Collapsible dock widget
│ ├── chat_fullscreen.dart # Fullscreen overlay (future)
│ └── widgets/
│ ├── message_list.dart
│ ├── message_bubble.dart
@@ -280,15 +289,15 @@ lib/features/chat/
- Mobile/Desktop: eventsource or http package with stream parsing
- Handle `reasoning_content` field for think blocks (DeepSeek R1 format)
### Phase 6: Home Automation
### Phase 6: Parlor (Home Automation)
**Goal**: Control Home Assistant via Core API.
**Files to create**:
```
lib/features/housekeeping/
lib/features/parlor/
├── presentation/
│ ├── pages/
│ │ ├── housekeeping_page.dart
│ │ ├── parlor_page.dart
│ │ └── area_detail_page.dart
│ └── widgets/
│ ├── device_tile.dart
@@ -300,13 +309,13 @@ lib/features/housekeeping/
│ │ ├── device.dart
│ │ ├── area.dart
│ │ └── scene.dart
│ └── repositories/housekeeping_repository.dart
│ └── repositories/parlor_repository.dart
└── data/
├── models/
│ ├── device_model.dart
│ └── device_control_request.dart
├── datasources/housekeeping_datasource.dart
└── repositories/housekeeping_repository_impl.dart
├── datasources/parlor_datasource.dart
└── repositories/parlor_repository_impl.dart
```
**Core API endpoints used**:
@@ -608,6 +617,7 @@ dev_dependencies:
## Reference Documents
- **UI Layout Spec**: `docs/UI_LAYOUT.md` - Wireframes, breakpoints, responsive behavior
- **Infrastructure**: `/mnt/media/Projects/portainer-core/CONTAINERS.md`
- **Tatlock Philosophy**: `/mnt/media/Projects/tatlock/PHILOSOPHY.md`
- **Core API**: `http://192.168.86.149:8083/docs`
@@ -618,26 +628,44 @@ dev_dependencies:
---
## Navigation Structure (matching Organizr)
## Navigation Structure ("Rooms of the Estate")
> **See [docs/UI_LAYOUT.md](docs/UI_LAYOUT.md) for detailed wireframes and responsive specifications.**
The UI uses **tabbed room navigation** in the header rather than a traditional sidebar. Each room is a focused context with its own layout. The Tatlock chat assistant is omnipresent as a collapsible right dock.
```
├── Homepage (Dashboard)
├── Tatlock (Chat)
├── Jellyfin (external link)
├── SearXNG (external link)
├── AMP
│ └── AMP Home
├── Coding
│ ├── Cloud IDE (external)
│ └── Gitea (external)
├── Infrastructure
│ ├── Containers (main feature)
│ ├── Netdata (external link)
│ ├── Portainer (external link)
│ └── Proxy Manager (external link)
├── Housekeeping (Home Automation)
├── API Docs (external link to Core API)
└── Settings
Header Tabs:
┌─────────────────────────────────────────────────────────────────┐
│ Front Hall │ Control Room │ Parlor │ Library │ │
└─────────────────────────────────────────────────────────────────┘
Room Contents:
├── Front Hall (Dashboard)
│ ├── Stat cards (CPU, Memory, Disk, Containers)
│ ├── Quick access service grid (external links)
│ ├── Recent activity timeline
│ └── Chat dock EXPANDED by default
│
├── Control Room (Infrastructure)
│ ├── Context sidebar: Containers, Stacks, Networks, Volumes, Images
│ ├── External links: Netdata, Portainer, NPM
│ ├── DataGrid views for each section
│ └── Chat dock collapsed
│
├── Parlor (Housekeeping)
│ ├── Context sidebar: Areas, Scenes
│ ├── Device control tiles per area
│ ├── Scene activation buttons
│ └── Chat dock collapsed
│
├── Library (Future)
│ ├── Knowledge management
│ ├── Bookmarks, notes, docs
│ └── Chat dock collapsed
│
└── Study (Hidden - Future)
└── Secretarial: email, calendar
```
---