브라우저에서 YAML 안 쓰고도 새 워크플로우 템플릿 만들기 + 즉시 등록. + /new.html / index.html / new-workflow.html / runs.html / conversation.html 의 nav·copy·empty-state 정비. A. /new.html UX: - 제목 "새 Run" → "워크플로우 실행 (고급)" - 상단 info-box: "자유 대화는 여기가 아닙니다 → 메인 페이지" - 모든 필드에 한 줄 hint - Persona 오버라이드 <details> 접힘 B. Nav 재정렬 (5 페이지): - "대화" nav-primary, 나머지 nav-secondary (작고 dim) C. 메인 안내 + CSS: - 메인 / 에 "👋 my-deepagent" info-box 추가 - .info-box / .nav-primary / .nav-secondary / .wf-* 신규 스타일 D. Workflow hot-reload: - api/deps.py get_workflows 가 매 요청 mtime 튜플 검사 후 변경 시 reload - lifespan 도 user dir 포함하도록 _load_workflows_combined E. Workflow generator: - POST /api/workflows: CreateWorkflowRequest → WorkflowTemplate validate → <data_dir>/workflows/<name>@<version>.yaml 저장. 중복 409, validation 422. - static/new-workflow.html: 기본 정보 / Roles / Phases / YAML preview - app.js bootstrapWorkflowGenerator: capability chip 토글, role select 동적, 실시간 YAML preview, XSS 정책 유지 테스트 (test_workflow_generator.py, 7 신규): - 페이지 200 + 마크업 - POST happy / 422 (empty roles) / 422 (unknown role) / 409 (dup) - GET hot-reload after POST - GET hot-reload after external file drop 게이트: - ruff / format / mypy: PASS (142 source files) - pytest -q --ignore=tests/integration/test_e2e_workflow.py --ignore=tests/integration/test_openrouter_smoke.py: 709 passed (+7 신규) - 라이브 smoke: / / new.html / new-workflow.html 모두 200, screenshot OK Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
100 lines
3.9 KiB
HTML
100 lines
3.9 KiB
HTML
<!doctype html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
|
<title>my-deepagent · 워크플로우 템플릿 만들기</title>
|
|
<link rel="stylesheet" href="/static/style.css" />
|
|
</head>
|
|
<body data-page="new-workflow">
|
|
<header>
|
|
<h1><a href="/">my-deepagent</a></h1>
|
|
<nav>
|
|
<a href="/" class="nav-primary">대화</a>
|
|
<a href="/runs.html" class="nav-secondary">Runs</a>
|
|
<a href="/new.html" class="nav-secondary">워크플로우 실행</a>
|
|
<a href="/new-workflow.html" class="active nav-secondary">+ 템플릿 만들기</a>
|
|
</nav>
|
|
</header>
|
|
<main>
|
|
<div id="error" class="error-banner" style="display:none"></div>
|
|
<div id="success" class="info-box" style="display:none"></div>
|
|
|
|
<div class="page-title">
|
|
<h2>워크플로우 템플릿 만들기</h2>
|
|
<span class="page-subtitle">phase 시퀀스 + role 정의 → YAML 저장</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<strong>📘 워크플로우 = phase 시퀀스</strong><br />
|
|
예: <code>"명세 작성" → "리뷰" → "검증"</code> 처럼 단계별로 어떤 role(역할)이 어떤
|
|
산출물을 만들지 정의하는 파일입니다. 저장 후엔 <a href="/new.html">워크플로우 실행</a>
|
|
페이지의 드롭다운에 자동으로 등장합니다 (서버 재시작 불필요).
|
|
</div>
|
|
|
|
<form id="wf-form" autocomplete="off">
|
|
|
|
<!-- 기본 메타 -->
|
|
<div class="card" style="padding: 20px;">
|
|
<h3 class="section-title" style="margin-top:0">기본 정보</h3>
|
|
<div class="form-grid">
|
|
<div class="form-row">
|
|
<label for="wf-name">
|
|
name
|
|
<span class="hint">— 영문 소문자/숫자/하이픈만. 예: <code>spec-and-review</code></span>
|
|
</label>
|
|
<input id="wf-name" type="text" required placeholder="my-workflow" />
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="wf-version">
|
|
version
|
|
<span class="hint">— 정수, 1부터</span>
|
|
</label>
|
|
<input id="wf-version" type="number" required value="1" min="1" />
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<label for="wf-description">
|
|
description
|
|
<span class="hint">— 한 줄 설명 (선택)</span>
|
|
</label>
|
|
<input id="wf-description" type="text" placeholder="이 워크플로우가 무엇을 하는지" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Roles -->
|
|
<div class="card" style="padding: 20px; margin-top: 16px;">
|
|
<h3 class="section-title" style="margin-top:0">
|
|
Roles <span class="hint" style="font-weight:400">— phase 가 참조할 역할 정의</span>
|
|
</h3>
|
|
<div id="roles-list"></div>
|
|
<button type="button" id="add-role" class="button">+ Role 추가</button>
|
|
</div>
|
|
|
|
<!-- Phases -->
|
|
<div class="card" style="padding: 20px; margin-top: 16px;">
|
|
<h3 class="section-title" style="margin-top:0">
|
|
Phases <span class="hint" style="font-weight:400">— 실제 실행되는 단계 순서</span>
|
|
</h3>
|
|
<div id="phases-list"></div>
|
|
<button type="button" id="add-phase" class="button">+ Phase 추가</button>
|
|
</div>
|
|
|
|
<!-- Preview -->
|
|
<details class="card" style="padding: 16px; margin-top: 16px;">
|
|
<summary style="cursor:pointer; font-weight:600;">
|
|
YAML 미리보기 <span class="hint" style="font-weight:400">— 저장될 파일 내용</span>
|
|
</summary>
|
|
<pre id="wf-preview" class="mono" style="margin-top:12px; white-space:pre-wrap; font-size:12.5px;"></pre>
|
|
</details>
|
|
|
|
<div class="action-bar">
|
|
<button type="submit" class="primary">💾 저장 + 등록</button>
|
|
<a class="button" href="/">취소</a>
|
|
</div>
|
|
</form>
|
|
</main>
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|