From 279124d9530a830ccfff8fe94cd09ce379f41439 Mon Sep 17 00:00:00 2001 From: hyungi Date: Mon, 8 Jun 2026 07:22:08 +0900 Subject: [PATCH] =?UTF-8?q?feat(ui):=20=ED=95=99=EC=8A=B5=20=EC=A7=84?= =?UTF-8?q?=EB=8B=A8(=EC=9D=B4=EB=93=9C=20=EC=BD=94=EC=B9=98)=20=ED=97=88?= =?UTF-8?q?=EB=B8=8C=20=EC=A7=84=EC=9E=85=EC=A0=90=20+=20/study/diagnosis?= =?UTF-8?q?=20=EC=A0=84=EC=9A=A9=20=EB=9D=BC=EC=9A=B0=ED=8A=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit diagnosis는 cross-topic(사용자 단위) 코칭 표면인데 기존엔 /study/topics 상단에만 노출돼 발견성이 낮았다. 허브(/study)에 '학습 진단' 카드 추가 + 전용 라우트 /study/diagnosis 신설(향후 weekly_recap·review_set_draft 코치 표면의 정식 홈). 패널은 StudyDiagnosisPanel 공유 컴포넌트로 추출 — topics·diagnosis 양쪽이 단일 청크 참조(복붙 drift 0). 백엔드 무변경(기존 POST /diagnosis/generate 재사용). 검증: vite build OK, lint:tokens 내 파일 위반 0, 새 라우트·허브 링크·공유 청크 번들 반영 확인. Co-Authored-By: Claude Opus 4.8 (1M context) --- .../lib/components/StudyDiagnosisPanel.svelte | 78 +++++++++++++++++++ frontend/src/routes/study/+page.svelte | 13 +++- .../src/routes/study/diagnosis/+page.svelte | 31 ++++++++ frontend/src/routes/study/topics/+page.svelte | 70 +---------------- 4 files changed, 125 insertions(+), 67 deletions(-) create mode 100644 frontend/src/lib/components/StudyDiagnosisPanel.svelte create mode 100644 frontend/src/routes/study/diagnosis/+page.svelte diff --git a/frontend/src/lib/components/StudyDiagnosisPanel.svelte b/frontend/src/lib/components/StudyDiagnosisPanel.svelte new file mode 100644 index 0000000..4c99cb9 --- /dev/null +++ b/frontend/src/lib/components/StudyDiagnosisPanel.svelte @@ -0,0 +1,78 @@ + + + + {#snippet children()} +
+
+
+ + 학습 진단 + +
+ +
+ + {#if diagLoading} +
+ +
+ {:else if diag && diag.status === 'ready'} +
{@html renderMathMarkdown(diag.content)}
+ {#if diag.review_set_draft_id} +
+ 권장 복습세트 초안 #{diag.review_set_draft_id} — 복습함에서 1클릭 확인 후 편성 +
+ {/if} +
+ {#if diag.snapshot_at}스냅샷 {fmtDiagTime(diag.snapshot_at)}{/if}{#if diag.generated_at} · 생성 {fmtDiagTime(diag.generated_at)}{/if}{#if diag.model} · {diag.model}{/if} +
+ {:else if diag && diag.status === 'none'} +

+ 아직 진단할 약점 데이터가 없습니다. 학습 주제를 공부중으로 표시하면 매일 새벽 누적 풀이에서 약점·태도 스냅샷이 만들어지고, 여기서 진단 코치를 받을 수 있습니다. +

+ {:else} +

+ 누적 학습 이력을 근거로 약점 토픽과 학습 태도를 진단합니다. 진단 생성을 눌러보세요. +

+ {/if} +
+ {/snippet} + diff --git a/frontend/src/routes/study/+page.svelte b/frontend/src/routes/study/+page.svelte index 7346a59..12fa5c5 100644 --- a/frontend/src/routes/study/+page.svelte +++ b/frontend/src/routes/study/+page.svelte @@ -3,7 +3,7 @@ // 주제로 보기(퀴즈·복습·통계) / 자료 학습 / 필사 세션 / 암기카드 검수. import { onMount } from 'svelte'; import { api } from '$lib/api'; - import { BookOpen, PenLine, GraduationCap, FolderKanban, Layers, Repeat, Flag, Inbox } from 'lucide-svelte'; + import { BookOpen, PenLine, GraduationCap, FolderKanban, Layers, Repeat, Flag, Inbox, Activity } from 'lucide-svelte'; let cardReviewCount = $state(0); let questionFlagCount = $state(0); @@ -38,6 +38,17 @@

"가스기사" 같은 학습 주제 아래에 필기 세션과 자료를 함께 묶어 본다. 한 주제 안에서 필기·자료를 한눈에.

+ +
+ +

학습 진단

+
+

누적 풀이 이력에서 약점 토픽과 학습 태도를 코치(이드)가 진단합니다. 매일 새벽 약점 스냅샷을 만들고, 권장 복습세트 초안까지 제안.

+ +
+ /** + * /study/diagnosis — 학습 진단(이드 코치) 전용 페이지. + * + * 누적 풀이 약점·학습 태도를 코치 언어로 진단하는 cross-topic 표면. 허브(/study)에서 진입. + * 패널 본체는 공유 컴포넌트 StudyDiagnosisPanel (/study/topics 상단에도 동일 노출). + */ + import { ArrowLeft, Activity } from 'lucide-svelte'; + import StudyDiagnosisPanel from '$lib/components/StudyDiagnosisPanel.svelte'; + + +학습 진단 — 공부 + +
+
+ + 공부 + + / + + 학습 진단 + +
+ +
+

학습 진단

+

누적 풀이 이력을 근거로 약점 토픽과 학습 태도를 코치가 진단합니다. 약점·수치는 매일 새벽 약점 스냅샷에서만 인용되며, 스냅샷에 없는 토픽은 만들지 않습니다.

+
+ + +
diff --git a/frontend/src/routes/study/topics/+page.svelte b/frontend/src/routes/study/topics/+page.svelte index 0b4704c..be6902b 100644 --- a/frontend/src/routes/study/topics/+page.svelte +++ b/frontend/src/routes/study/topics/+page.svelte @@ -13,7 +13,7 @@ import { goto } from '$app/navigation'; import { api } from '$lib/api'; import { addToast } from '$lib/stores/toast'; - import { Plus, ArrowLeft, FolderKanban, Trash2, Pencil, Activity } from 'lucide-svelte'; + import { Plus, ArrowLeft, FolderKanban, Trash2, Pencil } from 'lucide-svelte'; import Button from '$lib/components/ui/Button.svelte'; import Card from '$lib/components/ui/Card.svelte'; import EmptyState from '$lib/components/ui/EmptyState.svelte'; @@ -21,7 +21,7 @@ import TextInput from '$lib/components/ui/TextInput.svelte'; import Select from '$lib/components/ui/Select.svelte'; import Textarea from '$lib/components/ui/Textarea.svelte'; - import { renderMathMarkdown } from '$lib/utils/mathMarkdown'; + import StudyDiagnosisPanel from '$lib/components/StudyDiagnosisPanel.svelte'; const STUDY_TYPE_OPTIONS = [ { value: '', label: '미지정' }, @@ -36,29 +36,6 @@ let total = $state(0); let loading = $state(true); - // ─── 이드 학습 진단 (study_diagnosis surface) ─── - // 워커(study_weakness)가 산출한 최신 약점 스냅샷을 코치 언어로 번역. 데이터 없으면 status='none'. - // LLM 호출이라 버튼 트리거(자동 호출 X). - let diag = $state(null); // StudyDiagnosisResponse | null - let diagLoading = $state(false); - async function generateDiagnosis() { - if (diagLoading) return; - diagLoading = true; - try { - diag = await api('/study-topics/diagnosis/generate', { method: 'POST' }); - } catch { - addToast('error', '진단 생성 실패'); - } finally { - diagLoading = false; - } - } - function fmtDiagTime(s) { - if (!s) return ''; - const d = new Date(s); - if (isNaN(d.getTime())) return ''; - return d.toLocaleString('ko-KR', { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }); - } - // 생성 폼 let formOpen = $state(false); let f_name = $state(''); @@ -229,47 +206,8 @@

한 주제 아래에 필기 세션과 자료를 묶어 보고 진도 관리. 향후 단어장·오디오·문제세트도 같은 묶음으로 연결됩니다.

- - - {#snippet children()} -
-
-
- - 학습 진단 - -
- -
- - {#if diagLoading} -
- -
- {:else if diag && diag.status === 'ready'} -
{@html renderMathMarkdown(diag.content)}
- {#if diag.review_set_draft_id} -
- 권장 복습세트 초안 #{diag.review_set_draft_id} — 복습함에서 1클릭 확인 후 편성 -
- {/if} -
- {#if diag.snapshot_at}스냅샷 {fmtDiagTime(diag.snapshot_at)}{/if}{#if diag.generated_at} · 생성 {fmtDiagTime(diag.generated_at)}{/if}{#if diag.model} · {diag.model}{/if} -
- {:else if diag && diag.status === 'none'} -

- 아직 진단할 약점 데이터가 없습니다. 학습 주제를 공부중으로 표시하면 매일 새벽 누적 풀이에서 약점·태도 스냅샷이 만들어지고, 여기서 진단 코치를 받을 수 있습니다. -

- {:else} -

- 누적 학습 이력을 근거로 약점 토픽과 학습 태도를 진단합니다. 진단 생성을 눌러보세요. -

- {/if} -
- {/snippet} - + +