oto/agent-ui/definition/components/index.md

65 lines
5.5 KiB
Markdown

---
ui_doc_type: components-index
components:
- console-shell
- console-rail
- section-surface
- state-panel
- status-badge
- endpoint-tile
- connection-status-grid
- auth-token-reference
- record-list
- action-feedback
- runner-self-update-form
- job-create-form
- execution-action-toolbar
- authorization-state
- audit-action-summary
- log-preview
- artifact-list
- agent-chat-panel
---
# Component Definitions
## Component List
| Component ID | Status | Evidence | Description |
|--------------|--------|----------|-------------|
| `console-shell` | 구현됨 | `oto_console_shell.dart` + Jenkins IA shell/jobs gate | overall console scaffold with integrated header, breadcrumb, action slot, left menu, and selected section content. |
| `console-rail` | 계획 | `oto_console_shell.dart` + Jenkins IA gate | section navigation rail. `New Item`/`Build History`와 job context menu는 구현됨. `Nodes`, `Manage OTO`, run context menu는 03 후속 구현 대기. |
| `section-surface` | 구현됨 | `oto_console_shell.dart` + Jenkins IA executions/ops gate | generic titled empty/detail section shell. `Manage OTO` 관리 category grouping과 `System`/`Security`/`Browser policy` primitive가 widget 테스트로 확인됨. |
| `state-panel` | 구현됨 | surface files + Jenkins reference baseline | loading, empty, error state blocks. Jenkins monitor/banner-style state 반영 |
| `status-badge` | 구현됨 | overview/runners/jobs/executions surface files + Jenkins reference baseline | compact status label badge. Jenkins result/severity vocabulary 정렬 반영 |
| `endpoint-tile` | 구현됨 | `oto_console_overview.dart` | endpoint or config value tile |
| `connection-status-grid` | 구현됨 | `oto_console_overview.dart` | health/readiness status grid |
| `auth-token-reference` | 구현됨 | `oto_console_overview.dart` | display-only auth token reference |
| `record-list` | 구현됨 | jobs/runners/executions/artifacts surface files + Jenkins IA shell/jobs/executions/ops gate | repeated entity list rows. Pipelines job table, Build History run detail, Nodes/Agents runner row density가 widget 테스트로 확인됨. |
| `action-feedback` | 구현됨 | runners/jobs/executions surface files + Jenkins reference baseline | success/deferred/failed action message. Jenkins action outcome 정렬 반영 |
| `runner-self-update-form` | 구현됨 | `oto_runners_surface.dart` + Jenkins reference baseline | runner self-update draft form. Jenkins update action density 정렬 반영 |
| `job-create-form` | 구현됨 | `oto_jobs_surface.dart` + Jenkins reference baseline | job create draft form. Jenkins New Item flow 정렬 반영 |
| `execution-action-toolbar` | 구현됨 | `oto_executions_surface.dart` + Jenkins IA executions/ops gate | cancel/report/log/artifact execution actions. run detail의 `Pipeline Overview`/`Stage Graph`, `Console Output`, `Artifacts` 연결 primitive가 widget 테스트로 확인됨. |
| `authorization-state` | 계획 | security/audit SDD | operator/admin allow/deny, disabled, and error state rules for write actions |
| `audit-action-summary` | 계획 | security/audit SDD | display-safe action metadata summary for audit-oriented UI exposure |
| `log-preview` | 구현됨 | `oto_executions_surface.dart` + Jenkins reference baseline | bounded execution log preview. Jenkins Console Output/live log pane 정렬 반영 |
| `artifact-list` | 구현됨 | `oto_artifacts_surface.dart`, `oto_executions_surface.dart` + Jenkins reference baseline | artifact records in tab and execution detail. Jenkins artifact browser 정렬 반영 |
| `agent-chat-panel` | 구현됨 | `oto_agent_panel.dart` | agent-shell backed OTO assistant panel |
## Rules
- component 정의는 구현 API가 아니라 UI 사용 규칙을 다룬다.
- view별 변형이 필요하면 `<component-id>/<variant>.md` 또는 하위 디렉터리를 사용한다.
- 실제 구현체 이름과 다를 수 있지만, view 정의서에서 참조하는 component id는 이 목록에 있어야 한다.
## Jenkins IA Required Primitives
아래 primitive는 러프 참조가 아니라 Jenkins IA gate 필수 항목이다. `Widget assertion target`은 후속 구현(02/03)의 widget 테스트가 고정 label로 확인해야 할 대상이고, `Menu target`은 대응하는 Jenkins 메뉴 모델 항목이다.
| Pattern | OTO Components | Widget assertion target | Menu target |
|---------|----------------|-------------------------|-------------|
| Navigation and app context | `console-shell`, `console-rail`, `section-surface` | 통합 header, breadcrumb, global menu(`New Item`, `Build History`, `Nodes`, `Artifacts`, `Manage OTO`), job/run context menu 분리 | Global: `New Item`, `Build History`, `Nodes`, `Artifacts`, `Manage OTO` |
| Entity status scanning | `record-list`, `status-badge`, `state-panel` | Dashboard job table / `Build History` / `Nodes` dense row와 primary id/status | Global: `Jobs`, `Build History`, `Nodes` |
| Write action outcome | `action-feedback`, `authorization-state`, `audit-action-summary` | build/abort/config action 결과와 권한 실패 display-safe message | Run action outcome |
| Pipeline/run detail | `execution-action-toolbar`, `log-preview`, `artifact-list` | `Pipeline Overview`, `Stage Graph`, `Console Output`, `Artifacts` | Run: `Pipeline Overview`, `Console Output`, `Artifacts` |
| Creation/config forms | `job-create-form`, `runner-self-update-form`, `endpoint-tile`, `auth-token-reference` | `New Item` create form, `Manage OTO` 관리 form density | Global: `New Item`, `Manage OTO` |