Skip to content

feat: Phase 1 — Design System & Database Layer#116

Open
dplakon wants to merge 1 commit intofeature/agentos-tauri-appfrom
worker-2/phase1-design-system-db
Open

feat: Phase 1 — Design System & Database Layer#116
dplakon wants to merge 1 commit intofeature/agentos-tauri-appfrom
worker-2/phase1-design-system-db

Conversation

@dplakon
Copy link
Collaborator

@dplakon dplakon commented Feb 28, 2026

Phase 1: Design System & Database Layer

What

Implements the full design token system, core UI component library, SQLite database with schema, Rust CRUD commands, and typed frontend API layer for the AgentOS desktop app.

Design System

  • Tailwind config updated with correct design spec colors: #0A0A0B base, #141415 raised, #1C1C1E elevated, #6E56CF violet accent
  • Typography: Inter for UI, JetBrains Mono for code (loaded from Google Fonts)
  • Spacing: 4px base grid with all multiples
  • Agent status colors: running (green), error (red), deploying (amber), paused (violet), idle (gray) — each with muted variants
  • Animations: fade-in/out, slide-in/out, scale-in with proper easing
  • globals.css: Dark theme scrollbar, violet selection, focus-visible ring, font smoothing

UI Components (Radix UI + Tailwind)

All components use class-variance-authority for variant management and the cn() utility for class merging:

  • Button — primary, secondary, ghost, destructive, outline variants; sm/md/lg/icon sizes; supports asChild via Radix Slot
  • Input — styled with focus ring, disabled states, placeholder color
  • Badge — status-aware variants (running/error/deploying/paused/idle) with optional pulsing dot indicator
  • Tooltip — Radix portal with fade animation
  • Dialog — overlay with blur, close button, header/footer/title/description sub-components
  • DropdownMenu — full Radix menu with items, checkbox items, radio items, labels, separators, keyboard shortcut display
  • Tabs — underline active indicator with violet accent border

Database (SQLite via rusqlite)

  • WAL mode enabled for better concurrent read performance
  • Auto-migrations on startup
  • 6 tables: agents, files, schedules, environments, api_keys, audit_log
  • All tables use agent_id foreign keys (CASCADE on delete, SET NULL for audit_log)
  • Indexes on all foreign keys and audit_log.created_at

Rust Backend Commands (21 total)

  • Agents: list, get, create, update, delete
  • Files: list, create, update, delete
  • Schedules: list, create, update, delete
  • Environments: list, create, update, delete
  • API Keys: list, create, revoke, delete
  • Audit Log: list (with optional agent_id filter and limit)
  • All mutations automatically log to audit_log

Frontend API Layer (src/lib/api.ts)

  • Fully typed TypeScript wrappers around all 21 Tauri commands
  • Namespaced API objects: agentsApi, filesApi, schedulesApi, environmentsApi, apiKeysApi, auditLogApi
  • Generic call<T>() helper with error handling
  • All entity types, input types, and response types exported

Notes

  • Pre-existing TypeScript errors in mockData.ts are from worker-1's branch (not introduced by this PR)
  • The agent.rs and storage.rs modules are preserved for backward compatibility but the new commands.rs + db.rs are the primary backend

This PR was generated with Oz.

…ped API layer

Phase 1: Design System & Database Layer

Design System:
- Updated Tailwind config with correct design spec colors (#0A0A0B base, #141415 raised, #1C1C1E elevated, #6E56CF violet accent)
- Inter + JetBrains Mono typography, 4px spacing grid
- Agent status colors (running/error/deploying/paused/idle with muted variants)
- Animation tokens (fade, slide, scale) and box shadow system
- Updated globals.css with dark theme scrollbar, selection color, focus ring

UI Components (Radix UI + Tailwind):
- Button (primary/secondary/ghost/destructive/outline variants, sm/md/lg/icon sizes)
- Input with focus ring and disabled states
- Badge with agent status color variants and optional pulsing dot
- Tooltip with Radix portal and fade animation
- Dialog/Modal with overlay, header/footer/title/description
- DropdownMenu with items, checkboxes, radio, labels, separators, shortcuts
- Tabs with underline active indicator

Database Layer:
- Added rusqlite (bundled) to Cargo.toml for SQLite support
- Created db.rs with auto-migrations and WAL mode
- Schema: agents, files, schedules, environments, api_keys, audit_log
- All tables have agent_id foreign keys with CASCADE/SET NULL
- Indexes on all foreign keys and audit_log.created_at

Backend Commands:
- Full CRUD for agents, files, schedules, environments, api_keys
- Audit logging on all mutations
- Dynamic update queries with optional field support
- revoke_api_key for soft-delete of API keys
- list_audit_log with optional agent_id filter and limit

Frontend API Layer:
- Typed TypeScript API module (src/lib/api.ts)
- All entity types, input types, and response types
- Async invoke wrappers for all 21 Tauri commands
- Namespaced API objects: agentsApi, filesApi, schedulesApi, environmentsApi, apiKeysApi, auditLogApi

Co-Authored-By: Oz <oz-agent@warp.dev>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant