# Milestone: Flutter 콘솔 스켈레톤

## 위치

- Roadmap: `agent-roadmap/ROADMAP.md`
- Phase: `agent-roadmap/phase/control-plane-product-surface/PHASE.md`

## 목표

현재 endpoint 표시와 placeholder 중심인 Flutter client를 Control Plane 작업 표면의 스켈레톤으로 확장한다.
완료 후 사용자는 OTO Core 연결 상태와 선행 bootstrap 흐름에서 정의된 runner/node 연결 상태를 바탕으로 runner, pipeline/job, execution, log/artifact, settings 영역의 기본 화면 구조와 빈 상태를 확인할 수 있고, 후속 API 연동을 넣을 위치가 명확해야 한다.

## 상태

[완료]

## 승격 조건

- 없음

## 구현 잠금

- 상태: 해제
- SDD: 불필요
- SDD 문서: 없음
- SDD 사유: 기존 Core health/readiness와 Flutter shell 경계를 사용하는 UI 스켈레톤이며 별도 API/schema 계약 변경을 강제하지 않는다.
- 잠금 해제 조건: 없음
- 결정 필요: 없음

## 범위

- `apps/client` host app과 `packages/flutter/oto_console` 패키지의 현재 shell/contract 경계를 유지한다.
- Overview, Runners, Pipelines/Jobs, Executions, Artifacts, Settings 화면의 스켈레톤과 상태 표현을 만든다.
- OTO Core HTTP URL 설정값을 기준으로 health/readiness 연결 상태를 표시할 수 있는 최소 adapter 또는 port를 둔다.
- Runners 화면의 상태 모델은 선행 `Runner bootstrap, OTO binary, 노드 연결` Milestone에서 고정한 runner/node registration과 connectivity 기준을 따른다.
- 실제 API 데이터가 없거나 비어 있을 때의 empty/loading/error 상태를 제품 표면에 맞게 정리한다.

## 기능

### Epic: [ui-skeleton] Control Plane UI skeleton

OTO Console이 placeholder가 아니라 후속 기능을 얹을 수 있는 제품 화면 골격을 갖추도록 한다.

- [x] [overview-status] Overview가 `OTO_SERVER_HTTP_URL` 기준 Core health/readiness 상태를 보여줄 수 있는 구조를 갖춘다. 검증: `make client-test` 또는 `cd apps/client && flutter test`에서 상태 표시 위젯 테스트가 통과한다.
- [x] [section-surfaces] Runners, Pipelines/Jobs, Executions, Artifacts, Settings 섹션이 각각 독립 화면 스켈레톤과 빈 상태를 가진다. 검증: `cd packages/flutter/oto_console && flutter test`에서 navigation/section 렌더링 테스트가 통과한다.
- [x] [api-port] Flutter UI가 Core API를 직접 호출할 구현 위치를 contract/adapter로 분리하고, 브라우저 CORS 또는 same-origin proxy 필요성을 작업 컨텍스트에 드러낸다.
- [x] [preview-flow] 원격 preview 명령 `make client-run-web OTO_SERVER_HTTP_URL=http://toki-labs.com:18020` 기준으로 첫 화면이 Core API endpoint와 UI 스켈레톤을 안정적으로 렌더링한다. 검증: 원격 runner 또는 local smoke에서 Flutter web preview 접속 확인을 남긴다.

## 완료 리뷰

- 상태: 승인됨
- 요청일: 2026-06-17
- 완료 근거:
  - `agent-task/archive/2026/06/m-flutter-console-skeleton/01_preview_flow/complete.log`에 Overview health/readiness, section skeleton/empty state, remote preview smoke가 PASS로 기록되었다.
  - `apps/client`와 `packages/flutter/oto_console` 테스트/분석 PASS, Chrome DevTools Protocol screenshot evidence가 같은 complete log에 남아 있다.
  - 코드 확인 결과 Core connection adapter와 `OtoConsoleConfig` contract가 존재하며, Core HTTP route에 CORS/preflight 처리를 보강해 외부 preview에서 health/readiness 확인이 가능하다.
- 리뷰 필요:
  - [x] 사용자가 완료 결과를 확인했다
  - [x] archive 이동을 승인했다
- 리뷰 코멘트: 사용자 확인 후 코드레벨 리뷰에서 발견된 CORS 보강을 완료했고, 종료 가능한 상태로 판단한다.

## 범위 제외

- runner/job/execution 전체 CRUD와 고급 운영 정책을 한 번에 완성하지 않는다.
- auth, 권한, 감사 로그, durable persistence UI를 완성하지 않는다.
- production 정적 웹 배포 파이프라인은 이 Milestone의 필수 산출물이 아니다.

## 작업 컨텍스트

- 관련 경로: `apps/client/**`, `packages/flutter/oto_console/**`, `services/core/internal/httpserver/**`, `agent-test/local/**`
- 표준선(선택): 현재 `OtoConsoleShell`과 `OtoConsoleConfig`를 유지하고, 화면별 구현은 `oto_console` 패키지 안에 둔다.
- 표준선(선택): 현재 Core는 CORS 헤더를 제공하지 않으므로 브라우저 직접 API 호출을 붙일 때 CORS middleware 또는 same-origin proxy 정책을 함께 판단한다.
- 선행 작업: `Runner bootstrap, OTO binary, 노드 연결`, `oto_console 계약 경계 정리`, `워크스페이스 포트/환경 표준화`
- 후속 작업: 실제 runner/job/execution API 데이터 바인딩, 인증/권한, 운영 대시보드 고도화
- 확인 필요: 없음
