phptits
0d6cd37579
- Monorepo: NestJS API (Fastify) + React web (antd/ProComponents) + shared packages - PostgreSQL/Prisma (unified resources, relations graph, audit, events, jobs) - Auth/RBAC/workspace isolation, credential vault (AES-256-GCM) - Servers/SSH, Docker discovery & lifecycle, Job Center - Websites & deployments (git provider credential clone, env, health verification) - Domains/DNS (Cloudflare adapter), certificates (TLS probe), monitoring - Automation (cron/event/webhook HMAC + notifications), AI Gateway, MCP (29 tools) - AI chat window (LLM function-calling + rules fallback, SSE streaming, approvals) - Notes: Vditor WYSIWYG markdown editor, non-blocking autosave - Tests: 35 unit/security tests; UI audit clean (desktop+mobile, deep links)
72 lines
1.4 KiB
Markdown
72 lines
1.4 KiB
Markdown
# DevOS v1 Frontend Architecture
|
|
|
|
## 1. Stack
|
|
React + TypeScript + Ant Design + ProComponents + TanStack Query + Zustand + React Router + TipTap.
|
|
|
|
## 2. Application Layout
|
|
|
|
```text
|
|
apps/web
|
|
├── app
|
|
├── routes
|
|
├── layouts
|
|
├── features
|
|
│ ├── auth
|
|
│ ├── dashboard
|
|
│ ├── resources
|
|
│ ├── servers
|
|
│ ├── websites
|
|
│ ├── deployments
|
|
│ ├── domains
|
|
│ ├── monitoring
|
|
│ ├── automation
|
|
│ └── ai
|
|
├── components
|
|
└── services
|
|
```
|
|
|
|
Shared packages:
|
|
|
|
```text
|
|
packages/
|
|
├── ui/
|
|
├── api-client/
|
|
├── types/
|
|
└── auth/
|
|
```
|
|
|
|
## 3. UI Principle
|
|
Use Ant Design and ProComponents instead of building common enterprise controls from scratch.
|
|
|
|
Primary components:
|
|
- ProLayout
|
|
- ProTable
|
|
- ProForm
|
|
- ProDescriptions
|
|
- ProCard
|
|
- ProList
|
|
|
|
## 4. State
|
|
- Server state: TanStack Query
|
|
- Local UI state: Zustand / React state
|
|
- Do not duplicate server state into global stores without a clear reason.
|
|
|
|
## 5. Dashboard
|
|
The home page should prioritize:
|
|
- AI command entry
|
|
- Infrastructure health
|
|
- Projects
|
|
- Recent activity
|
|
- Deployment/monitoring warnings
|
|
|
|
## 6. Resource UI
|
|
Resource detail pages should expose:
|
|
- Overview
|
|
- Relations
|
|
- Actions
|
|
- Activity/Audit
|
|
- Logs where applicable
|
|
- Related resources
|
|
|
|
Dangerous actions require explicit confirmation and risk presentation.
|