<!-- task=m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views plan=0 tag=LAYOUT -->

# Code Review Reference - LAYOUT

> **[IMPLEMENTING AGENT — READ FIRST] Filling in this file is the mandatory final step of implementation.**
> The task is NOT complete until every implementation-owned section below is filled in.
> Complete the `구현 체크리스트`; the final checklist item is mandatory before saving.
> Fill implementation-owned sections, then stop with active files in place and report ready for review.
> If implementation is blocked by a selected Milestone `구현 잠금 > 결정 필요` item, fill `사용자 리뷰 요청` with linked evidence and stop with active files in place; code-review decides whether to write `USER_REVIEW.md`. Environment/secret/service blockers, generic scope changes, repeated failures, and evidence gaps that a follow-up agent can close are normal follow-up issues, not user-review blockers by themselves.
> Do not ask the user directly, present choices in chat, or call `request_user_input` during implementation; record only Milestone lock decisions in `사용자 리뷰 요청` and stop for code-review.
> Finalization (`코드리뷰 결과`, log rename, `complete.log`, archive moves, `코드리뷰 전용 체크리스트`) is review-agent-only, even after compaction/resume.
> Follow the ownership table at the bottom of this file for which sections you own.

## 개요

date=2026-07-02
task=m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views, plan=0, tag=LAYOUT

## Roadmap Targets

- Milestone: `agent-roadmap/phase/control-plane-product-surface/milestones/control-plane-jenkins-aligned-layout-pass.md`
- Task ids:
  - `view-layout`: `overview`, `runners`, `pipelines`, `executions`, `artifacts`, `settings`를 Target Layout Delta에 맞춰 재배치
  - `component-layout`: `record-list`, `state-panel`, `status-badge`, `action-feedback`, `execution-action-toolbar`, `log-preview`, `artifact-list`, create/update form의 reusable layout pattern 정리
- Completion mode: check-on-pass

## 이 파일을 읽는 리뷰 에이전트에게

> **[REVIEW AGENT ONLY]** 아래 종결 절차는 코드리뷰 에이전트 전용이다. 구현 에이전트는 이 섹션을 실행하지 않는다.

각 항목의 구현을 실제 소스 파일과 대조하고, `검증 결과` 섹션의 출력이 코드와 일치하는지 확인하세요.
리뷰 완료는 아래 순서까지 끝난 상태를 의미합니다.

1. 판정을 append한다.
2. `CODE_REVIEW-local-G07.md` → `code_review_local_G07_0.log`, `PLAN-local-G07.md` → `plan_local_G07_0.log`로 아카이브한다.
3. PASS이면 `complete.log` 작성 후 active task 디렉터리를 `agent-task/archive/YYYY/MM/m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views/`로 이동한다. WARN/FAIL이면 user-review gate를 확인한 뒤 다음 active plan/review 파일 또는 `USER_REVIEW.md`를 작성한다.
4. PASS이고 task group이 `m-<milestone-slug>`이면 완료 이벤트 메타데이터를 보고한다. roadmap 상태 체크와 `update-roadmap` 호출은 런타임 책임이다.
5. 적용 가능한 `코드리뷰 전용 체크리스트` 항목을 최종 `.log` 위치에서 체크한 뒤 보고한다.

---

## 구현 항목별 완료 여부

| 항목 | 완료 여부 |
|------|---------|
| [LAYOUT-1] Execution List And Selected Detail | [x] |
| [LAYOUT-2] Execution Action Toolbar And Feedback | [x] |
| [LAYOUT-3] Log And Artifact Panes | [x] |
| [LAYOUT-4] Artifacts Browser Anatomy | [x] |

## 구현 체크리스트

- [x] `01_definition_shell_foundation`과 `02+01_primary_views`의 `complete.log`가 active/archive predecessor로 존재하는지 확인하고 없으면 구현하지 않고 dependency missing을 기록한다.
- [x] `OtoExecutionsSurface`를 execution list + selected run detail 관계로 재배치하고, run header/action toolbar/summary placeholder/log pane/artifact pane 순서를 구현한다.
- [x] execution action toolbar에서 cancel/report/log/artifact guard, confirmation dialog, callback payload, submitting/success/failed feedback을 유지한다.
- [x] logs preview를 selected execution detail의 독립 bounded pane으로 재배치하고 loading/empty/error/data states를 유지한다.
- [x] artifacts preview와 artifacts tab을 같은 artifact-list anatomy로 정리하고 name/path ellipsis, empty/error/data states를 유지한다.
- [x] record-list/status-badge/state-panel/action-feedback private reusable pattern을 surface 간 충돌 없이 정리한다.
- [x] package/app widget tests를 갱신해 executions/artifacts state, action, navigation, detail preview를 검증한다.
- [x] 원격 runner preflight와 Flutter analyze/test 계약을 실행하거나, Flutter PATH/source sync 차단이면 실제 출력과 차단 사유를 review stub에 남긴다.
- [x] CODE_REVIEW-*-G??.md의 구현 에이전트 소유 섹션을 실제 구현 내용과 검증 출력으로 채운다. 이 항목이 완료되기 전에는 구현이 완료된 것이 아니다.

## 코드리뷰 전용 체크리스트

> **[REVIEW AGENT ONLY]** 이 체크리스트는 코드리뷰 에이전트만 사용한다.
> 구현 에이전트는 이 섹션을 수정하거나 체크하지 않는다.

- [x] `코드리뷰 결과`에 `PASS`, `WARN`, `FAIL` 중 하나의 판정을 append한다.
- [x] 판정과 `차원별 평가`, Required/Suggested/Nit 분류가 서로 일치한다.
- [x] active `CODE_REVIEW-*-G??.md`를 `code_review_local_G07_0.log`로 아카이브한다.
- [x] active `PLAN-*-G??.md`를 `plan_local_G07_0.log`로 아카이브한다.
- [x] `.gitignore`의 Agent-Ops 관리 block이 `agent-task/**/*.md`와 `agent-task/**/*.log`를 unignore하고 `agent-roadmap/current.md`를 ignore하는지 확인한다.
- [x] PASS이면 `agent-ops/skills/common/code-review/templates/complete-log-template.md` 기준으로 `complete.log`를 작성하고 active `.md` 파일을 남기지 않는다.
- [x] PASS이면 active task 디렉터리 `agent-task/m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views/`를 `agent-task/archive/YYYY/MM/m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views/`로 이동하고 최종 archive 경로에서 이 체크리스트를 갱신한다.
- [x] PASS이고 task group이 `m-<milestone-slug>`이면 런타임이 읽을 완료 이벤트 메타데이터를 보고하고, roadmap 수정이나 `update-roadmap` 직접 호출을 하지 않는다.
- [x] PASS split 작업이면 이동 후 빈 active parent `agent-task/m-control-plane-jenkins-aligned-layout-pass/`를 제거하거나, 남은 sibling/file이 있어 유지했다고 확인한다.
- [ ] WARN/FAIL이고 user-review gate가 트리거되지 않았으면 다음 active `PLAN-local-G07.md`와 `CODE_REVIEW-local-G07.md`를 작성하고 `complete.log`를 작성하지 않는다.
- [ ] USER_REVIEW이면 `agent-ops/skills/common/code-review/templates/user-review-template.md` 기준으로 `USER_REVIEW.md`를 작성하고 active `PLAN-*.md`, `CODE_REVIEW-*.md`, `complete.log`를 남기지 않는다.
- [ ] USER_REVIEW가 연결된 Milestone 결정으로 완료/PASS 해소되면 `USER_REVIEW.md`를 해소 상태로 갱신하고 `complete.log`를 작성한 뒤 task directory를 archive로 이동한다.

## 계획 대비 변경 사항

- 검증 환경: 계획 최종 검증은 원격 runner(`toki@toki-labs.com:/Users/toki/agent-work/oto`)에서 `flutter analyze && flutter test`를 실행하는 계약이었다. preflight에서 checkout은 접근되나 원격 `command -v flutter`와 `which dart`가 모두 실패했다(FLUTTER_NOT_FOUND / DART_NOT_FOUND). 또한 원격 HEAD(`7e51ef9`)는 본 브랜치와 다르고 unrelated dirty 상태라 source sync가 정렬되지 않았다. 대신 로컬 환경에 Flutter 3.41.5(`/sdk/flutter`)가 있어 동일한 `flutter analyze`/`flutter test`를 `packages/flutter/oto_console`와 `apps/client`에서 실행했고 모두 PASS했다. 원격 Flutter PATH/source sync 준비 시 동일 계약 재실행이 필요하다(환경 blocker, 사용자 리뷰 대상 아님).
- 상세 detail 헤더 라벨: `_buildExecutionDetail`의 run header는 계획의 "run header"를 `Run <executionID>`로 구현했다. list row가 `Exec ID: <id>`를 유지하고, 앱 위젯 테스트가 `find.text('Exec ID: <id>')` 탭으로 selected run을 collapse하므로, detail 헤더가 같은 문자열을 중복 렌더링하면 tap이 다중 매칭으로 실패한다. 이를 피하기 위해 헤더는 별도 라벨(`Run <id>`, meta는 `Job <id> · Runner <id>`)을 사용한다.
- list/detail 배치: 계획 After 의사코드(`_ExecutionWorkspace(list:, detail:)`)의 의미를 유지하되, 기존 `OtoConsoleShell` surface가 단일 세로 Column(maxWidth 820) 안에 놓이므로 좌우 2-pane 대신 위(run list)/아래(selected run detail) 세로 split으로 구현했다. 선택 없음일 때는 `_RunDetailPlaceholder`("Select a run to view details.")를, 선택 시 `SingleChildScrollView` detail을 `Expanded`로 둔다. 공개 계약(`expandedExecutionID`/`onExpandExecution` 토글)은 그대로 유지했다.

## 주요 설계 결정

- 공유 artifact anatomy는 Dart의 파일 단위 privacy 때문에 언더스코어 private 클래스로 두 파일에서 공유할 수 없어, 비-export 내부 파일 `lib/src/oto_artifact_record_row.dart`에 `ArtifactRecordRow`(+`ArtifactRowDensity`)를 두고 executions/artifacts 두 surface가 import해서 재사용한다. barrel(`oto_console.dart`)에 export하지 않아 패키지 public API는 늘어나지 않는다(심볼 참조 계약 유지). full density는 Artifacts 탭, compact density는 execution detail preview가 쓰며 둘 다 name + `Path: <path>` ellipsis 유지.
- action toolbar는 콜백/guard/confirmation/feedback을 그대로 두고 layout만 `_ExecutionActionToolbar(destructive/reporting/append)`로 그룹화했다. 'Actions' 헤딩과 4개 버튼 라벨/아이콘(`Cancel`/`Report`/`Log`/`Artifact`)은 기존 테스트 계약 그대로 유지한다.
- log/artifact preview는 `_DetailPane(title, action?)` + `_LogPreviewBox`(bounded 180 monospace)로 재배치했다. Artifacts pane의 `View Artifacts Tab` 이동 버튼은 pane action slot으로 옮겼고, log pane action slot은 향후 full console용으로 비워뒀다. stage graph 데이터 모델이 없으므로 `_buildStageSummaryPlaceholder`("Stage summary unavailable")만 두고 full stage graph/artifact download/content preview는 범위에서 제외했다.
- 삭제/rename된 public symbol 없음. `OtoExecutionsSurface`, `OtoArtifactsSurface`, `OtoActionViewState`, `OtoExecution*Draft`, `OtoArtifactViewModel` 계약과 호출부(`apps/client/lib/src/app/oto_client_app.dart`)는 그대로다. agent-ui `구현됨` status 전환은 하지 않았다(milestone completion review 대상).

## 사용자 리뷰 요청

_기본값은 `없음`이다. 구현 중 새 결정이 필요해 보여도 직접 질문하거나 선택지를 제시하거나 `request_user_input`을 호출하지 않는다. 이 섹션은 선택된 Milestone `구현 잠금 > 결정 필요` 항목이 실구현을 차단할 때만 채운다. 외부 환경/secret/서비스 준비, 검증 증거 공백, 반복 실패, 일반 범위 조정은 사용자 리뷰 요청이 아니며 `검증 결과`, `계획 대비 변경 사항`, 또는 code-review의 일반 follow-up plan으로 처리한다._

- 상태: 없음
- 사유 유형: 없음
- 연결 대상: 없음
- 결정 필요: 없음
- 차단 근거: 없음
- 실행한 검증/명령: 없음
- 자동 후속 불가 이유: 없음
- 재개 조건: 없음

## 리뷰어를 위한 체크포인트

- `01`과 `02` predecessor completion이 확인되었는지 본다.
- Execution row tap/selected detail behavior와 callback payload가 유지되는지 확인한다.
- Cancel confirmation, disabled unknown runner, success refresh/failure no-refresh behavior가 보존되는지 확인한다.
- Logs/artifacts empty/error/data strings가 기존 tests와 의미상 일치하는지 확인한다.
- Artifact path가 과도하게 노출되거나 download/content preview가 scope creep으로 들어오지 않았는지 확인한다.
- Roadmap Targets가 `view-layout`, `component-layout`만 주장하며 agent-ui status 전환을 하지 않는지 확인한다.

## 검증 결과

_구현 에이전트가 각 중간 검증 및 최종 검증 명령 실행 후 출력을 여기에 붙여 넣는다._

필수 규칙:
- 검증 명령은 고정된 계약이다. 임의로 대체하지 않는다.
- 대체가 필요하면 `계획 대비 변경 사항`에 이유와 대체 명령을 기록한다.
- `검증 결과`에는 실제 stdout/stderr를 붙여 넣는다.

> 참고: 계획의 중간/최종 검증은 원격 runner `flutter analyze && flutter test` 계약이나, 원격 Flutter/Dart가 PATH에 없어(FLUTTER_NOT_FOUND / DART_NOT_FOUND) 차단됨. 로컬 Flutter 3.41.5로 동일 명령을 실행해 evidence를 남긴다(아래 원격 preflight 블록 참조).

### LAYOUT-1 중간 검증
```
$ cd packages/flutter/oto_console && flutter test
00:01 +9: OtoExecutionsSurface renders loading/empty/error/data states and expanded detail
00:01 +11: OtoExecutionsSurface renders execution action states
00:01 +12: OtoExecutionsSurface shows Actions section when expanded
00:01 +14: All tests passed!
```

### LAYOUT-2 중간 검증
```
$ cd apps/client && flutter test
00:01 +11: OtoClientApp wires execution actions and refresh
00:01 +12: OtoClientApp execution action success triggers refresh with real runner id
00:02 +13: OtoClientApp unknown runner id keeps action disabled
00:03 +27: All tests passed!
```

### LAYOUT-3 중간 검증
```
$ cd packages/flutter/oto_console && flutter test
00:01 +9: OtoExecutionsSurface renders loading/empty/error/data states and expanded detail
00:01 +14: All tests passed!
```

### LAYOUT-4 중간 검증
```
$ cd apps/client && flutter test
00:03 +23: OtoClientApp wires jobs, executions and artifacts data state on API success
00:03 +26: OtoClientApp wires expanded execution detail logs and artifacts empty/error states
00:03 +27: All tests passed!
```

### 최종 검증
```
$ git diff --check
PASS: no whitespace errors
```

```
$ python3 - <<'PY'
from pathlib import Path
targets = [
  'agent-ui/definition/views/overview/index.md',
  'agent-ui/definition/views/runners/index.md',
  'agent-ui/definition/views/pipelines/index.md',
  'agent-ui/definition/views/executions/index.md',
  'agent-ui/definition/views/artifacts/index.md',
  'agent-ui/definition/views/settings/index.md',
  'agent-ui/definition/components/record-list/index.md',
  'agent-ui/definition/components/state-panel/index.md',
  'agent-ui/definition/components/status-badge/index.md',
  'agent-ui/definition/components/action-feedback/index.md',
  'agent-ui/definition/components/execution-action-toolbar/index.md',
  'agent-ui/definition/components/log-preview/index.md',
  'agent-ui/definition/components/artifact-list/index.md',
]
for p in targets:
    text = Path(p).read_text()
    if 'status: 계획' not in text and 'Status: `계획`' not in text:
        raise SystemExit(f'agent-ui status should remain 계획 until milestone completion review: {p}')
print('agent-ui implementation targets remain plan-state for milestone review')
PY
agent-ui implementation targets remain plan-state for milestone review
```

```
$ ssh -o BatchMode=yes -o ConnectTimeout=10 toki@toki-labs.com 'cd /Users/toki/agent-work/oto && printf "workdir=%s\n" "$PWD" && printf "branch=" && git rev-parse --abbrev-ref HEAD && printf "head=" && git rev-parse --short HEAD && printf "status-start\n" && git status --short && printf "status-end\n" && command -v flutter && flutter --version | head -n 1'
workdir=/Users/toki/agent-work/oto
branch=master
head=7e51ef9
status-start
 M apps/runner/assets/script/powershell/oto_agent_bootstrap.ps1
 M apps/runner/assets/script/shell/oto_agent_bootstrap.sh
 M apps/runner/test/oto_agent_bootstrap_ps1_test.dart
 M apps/runner/test/oto_agent_bootstrap_script_test.dart
 M apps/runner/test/oto_server_connection_smoke_test.dart
 M services/core/internal/httpserver/oto_agent_bootstrap.ps1
 M services/core/internal/httpserver/oto_agent_bootstrap.sh
 M services/core/internal/httpserver/routes.go
 M services/core/internal/httpserver/runner_handlers.go
 M services/core/internal/httpserver/server_test.go
 M services/core/internal/runnerregistry/registry.go
 M services/core/internal/runnerregistry/registry_test.go
?? .tmp/
status-end
# command -v flutter -> 비어 있음(exit 1)로 이후 flutter --version 미실행
# 확인 재실행: $ ssh ... 'command -v flutter || echo FLUTTER_NOT_FOUND; which dart || echo DART_NOT_FOUND'
FLUTTER_NOT_FOUND
DART_NOT_FOUND
# BLOCKER: 원격 runner에 flutter/dart 미설치(PATH 없음). 원격 HEAD 7e51ef9는 본 브랜치와 다르고 unrelated dirty 상태로 source sync도 미정렬.
```

```
$ ssh -o BatchMode=yes -o ConnectTimeout=10 toki@toki-labs.com 'cd /Users/toki/agent-work/oto/packages/flutter/oto_console && flutter analyze && flutter test'
# BLOCKED: 원격 Flutter PATH 없음. 로컬 대체 실행(Flutter 3.41.5):
$ cd packages/flutter/oto_console && flutter analyze
Analyzing oto_console...
No issues found! (ran in 4.5s)
$ cd packages/flutter/oto_console && flutter test
00:01 +14: All tests passed!
```

```
$ ssh -o BatchMode=yes -o ConnectTimeout=10 toki@toki-labs.com 'cd /Users/toki/agent-work/oto/apps/client && flutter analyze && flutter test'
# BLOCKED: 원격 Flutter PATH 없음. 로컬 대체 실행(Flutter 3.41.5):
$ cd apps/client && flutter analyze
Analyzing client...
No issues found! (ran in 2.6s)
$ cd apps/client && flutter test
00:03 +27: All tests passed!
```

---

> **[IMPLEMENTING AGENT — BEFORE SAVING] Have you filled in every implementation-owned section: completion table, implementation checklist, changes from plan, design decisions, and verification output?**
> If anything is blank, go back and fill it in before saving this file.
> Leave review-agent-only sections unchanged.

## Ownership

| Section | Owner | Note |
|---------|-------|------|
| Header comment, 개요, 리뷰 에이전트 지시 | Fixed at stub creation | Implementing agent must not modify or execute archive/finalization steps |
| Roadmap Targets | Fixed at stub creation from plan | Implementing agent must not modify |
| 구현 항목별 완료 여부 | Implementing agent | Check `[ ]` to `[x]` only |
| 구현 체크리스트 | Implementing agent | Check `[ ]` to `[x]` only |
| 코드리뷰 전용 체크리스트 | Review agent only | Implementing agent must not modify |
| 계획 대비 변경 사항, 주요 설계 결정 | Implementing agent | Replace placeholder text with actual content |
| 사용자 리뷰 요청 | Implementing agent | Keep `상태: 없음` unless selected Milestone lock decision blocks implementation |
| 리뷰어를 위한 체크포인트 | Fixed at stub creation | Review focus |
| 검증 결과 | Implementing agent | Fill command output only |

## 코드리뷰 결과

- 리뷰 일시: 2026-07-03
- 종합 판정: PASS
- 차원별 평가:
  - Correctness: Pass
  - Completeness: Pass
  - Test coverage: Pass
  - API contract: Pass
  - Code quality: Pass
  - Implementation deviation: Pass
  - Verification trust: Pass
  - Roadmap target conformance: Pass
- 발견된 문제: 없음
- 리뷰 중 정리:
  - `dart format`을 적용해 `packages/flutter/oto_console/lib/src/oto_executions_surface.dart`와 `packages/flutter/oto_console/test/oto_console_test.dart` 포맷 drift를 정리했다.
- 검증:
  - `dart format --output=none --set-exit-if-changed packages/flutter/oto_console/lib/src/oto_artifact_record_row.dart packages/flutter/oto_console/lib/src/oto_artifacts_surface.dart packages/flutter/oto_console/lib/src/oto_executions_surface.dart packages/flutter/oto_console/test/oto_console_test.dart apps/client/test/widget_test.dart`: PASS, `Formatted 5 files (0 changed)`.
  - `cd packages/flutter/oto_console && flutter analyze`: PASS, `No issues found!`.
  - `cd packages/flutter/oto_console && flutter test`: PASS, `+14: All tests passed!`.
  - `cd apps/client && flutter analyze`: PASS, `No issues found!`.
  - `cd apps/client && flutter test`: PASS, `+27: All tests passed!`.
  - `git diff --check`: PASS.
  - agent-ui status guard script: PASS, 대상 view/component가 milestone completion review 전 `계획` 상태로 유지됨.
  - 원격 runner preflight: BLOCKED as expected, `/Users/toki/agent-work/oto`는 접근되지만 `FLUTTER_NOT_FOUND` / `DART_NOT_FOUND`이고 원격 checkout은 `master@7e51ef9` dirty 상태라 원격 Flutter 계약은 실행 불가.
- 다음 단계: PASS 종결 처리. `complete.log` 작성 후 task directory를 `agent-task/archive/2026/07/m-control-plane-jenkins-aligned-layout-pass/03+01,02_execution_artifact_views/`로 이동한다.
