Forward backend Step 9 `unit.application_candidates[]` (application_mode /
auto_applicable / delegated_to) onto FrameCandidate and surface the
application_mode as a Korean consequence phrase in the FramePanel V4-label
inline badge tooltip. Deterministic frontend-only refactor; no LLM call,
no V4-label color change, no outer composedTitle change.
u1: types/designAgent.ts — add optional applicationMode / autoApplicable /
delegatedTo on FrameCandidate (legacy fixtures keep undefined).
u2: services/applicationMode.ts (new) — pure helper exporting
ApplicationMode union, APPLICATION_MODE_TOOLTIP_KR (keyed by backend
mode VALUE, NOT V4 label), buildBadgeTitle, mergeApplicationCandidates.
u3: tests/imp41_application_mode.test.ts (new) — 13 Vitest cases pinning
composite output per mode, undefined/unknown→legacy fallback, merge by
template_id, skip missing/empty/non-string keys, first-wins on dupes,
empty/null/non-array input.
u4: services/designAgentApi.ts — bridge consumes mergeApplicationCandidates
and forwards three fields onto FrameCandidate while preserving
LABEL_PRIORITY sort and TOP_N_FRAMES slicing.
u5: components/FramePanel.tsx — V4-label badge `title` now calls
`buildBadgeTitle(candidate.label, candidate.applicationMode)`;
badge color className map preserved verbatim; outer composedTitle
untouched.
Scope-qualified verification (5 files, IMP-41 axis only):
- Vitest: client/tests/imp41_application_mode.test.ts — 13/13 PASS.
- Diff↔Plan parity: 5 files match Stage 2 plan, no scope creep.
- AI-isolation contract honored: tooltip values originate from backend
enum; no frontend re-derivation from V4 label.
- No spacing/font shrink; clipping resolution stays at layout/zone/frame
layer (feedback_phase_z_spacing_direction).
Pre-existing unrelated diagnostics (BottomActions.tsx,
imp47b_human_review_toast.test.tsx) remain open on their own axes and are
not gated by this commit.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Design Agent Frontend
React + Vite + TypeScript frontend.
위치
Front/— 이 폴더- 원본 작업 위치 =
D:\ad-hoc\kei\design_agent_front\design-agent\(로컬 dev)
실행
cd Front/
pnpm install
pnpm dev
http://localhost:3000 에서 확인. DESIGN_AGENT_ROOT env 로 backend 경로 지정 가능.
구조
Front/
├── client/ React frontend (Vite root)
│ └── src/
│ ├── pages/
│ ├── components/
│ ├── services/
│ └── ...
├── server/ production express
├── vite.config.ts dev plugin + backend 연결
└── ...
Backend 연결 (vite.config.ts)
Vite dev plugin 이 다음 endpoint 등록 :
| Endpoint | 동작 |
|---|---|
POST /api/run |
MDX + overrides → backend pipeline spawn → run_id 반환 |
GET /api/sample-mdx?mdx=... |
sample MDX serve |
GET /frame-preview/{n} |
frame thumbnail |
GET /data/runs/{run_id}/{path} |
pipeline 산출물 serve |