--- ui_doc_type: view view_id: overview status: 구현됨 frame: null source_evidence: - type: code path: packages/flutter/iop_console/lib/src/iop_console_overview.dart notes: IopConsoleOverview renders endpoint cards, connection status, auth reference, and refresh action. - type: code path: apps/client/lib/client_home_page.dart notes: ClientHomePage injects IopConsoleOverview as the overview section. - type: docs path: apps/client/README.md notes: Client config is injected with Control Plane HTTP and WebSocket URLs. - type: user path: null notes: Initial scaffold requested by user. regions: - overview.header - overview.connection-status - overview.endpoints - overview.health-summary - overview.auth - overview.refresh --- # Overview View ID: `overview` Frame: - 없음 Status: `구현됨` ## Source Evidence | Type | Path | Notes | |------|------|-------| | code | `packages/flutter/iop_console/lib/src/iop_console_overview.dart` | `IopConsoleOverview`가 endpoint card, connection badge, auth reference, refresh action을 렌더링한다. | | code | `apps/client/lib/client_home_page.dart` | `ClientHomePage`가 overview section에 `IopConsoleOverview`를 주입한다. | | docs | `apps/client/README.md` | Control Plane HTTP/WS URL을 build-time config로 주입하는 client 표면을 설명한다. | | user | 없음 | 초기 agent-ui 생성을 요청했다. | ## Purpose 운영자가 Control Plane 연결 상태와 client endpoint 구성을 가장 먼저 확인하는 landing view다. ## Primary Users - IOP operator - 개발 환경에서 Control Plane wire 연결을 확인하는 engineer ## Primary Tasks - Control Plane HTTP/WS endpoint 확인 - wire connection 상태 확인 - auth token reference 존재 여부 확인 - connection refresh 실행 ## Information Priority 1. Control Plane wire connection status 2. HTTP and WebSocket endpoint values 3. protocol, auth reference, refresh action ## Regions | Region ID | Purpose | Component | Priority | Notes | |-----------|---------|-----------|----------|-------| | `overview.header` | view title과 Control Plane context 표시 | 없음 | high | `Operations Overview` heading을 포함한다. | | `overview.connection-status` | wire 연결 상태를 badge로 표시 | `status-badge` | high | `Connected`, `Disconnected`, `Connecting`, `Error` 상태를 상위 색상으로 보여준다. | | `overview.endpoints` | HTTP REST API와 WebSocket wire endpoint 표시 | `endpoint-card` | high | build-time config 값을 그대로 보여준다. | | `overview.health-summary` | protocol과 active wire 요약 | `status-badge` | medium | 현재 구현은 stat tile 형태다. | | `overview.auth` | auth token reference 표시 | `endpoint-card` | medium | 값이 없으면 unauthenticated/public으로 표시한다. | | `overview.refresh` | connection refresh action 제공 | 없음 | medium | `onRefresh`가 있으면 버튼을 보여준다. | ## Actions | Action ID | Trigger | Result | Guard | |-----------|---------|--------|-------| | `overview.refresh` | Refresh Connection button | wire connect와 Edge fetch를 다시 시도한다. | 없음 | ## States - loading: wire status가 `Connecting`이거나 refresh가 진행 중인 상태 - empty: endpoint config는 항상 표시되므로 별도 empty state는 없다. - error: wire status가 `Error`로 표시된다. - permission-denied: 현재 구현 근거 없음 ## Open Questions - 없음 ## Decision History - 2026-06-25: `IopConsoleOverview` 구현을 기준으로 overview view를 정의했다.