Files
AI/UI_REBUILD_PLAN.md

161 lines
7.1 KiB
Markdown
Raw Normal View History

Phase 1.3: 시드 크롤 — by-project 엔드포인트 + CrawlPage 폼/폴링/취소 세션 영구화: UI_REBUILD_PLAN.md 신설 - 사용자 비전 5가지 흐름 + Phase 보드 + 작업 재개 가이드 - 세션이 끊겨도 이 파일 + git log로 어디까지 했는지 즉시 복원 백엔드 (crawler_platform/app/api/): - routes.py: POST /crawl-site/by-project 추가 — config_path 의존 제거 - SiteCrawlByProjectRequest: project_name 기반, DB project.config 재구성 - run_site_crawl_job이 __config_dict 메타키 인식하도록 최소 변경 - config/loader.py: project_config_from_dict() 헬퍼 추출 (DB dict ↔ ProjectConfig) 프론트엔드 API (src/lib/api/): - crawl.ts: crawlApi.startByProject/getJob/cancel + Zod 스키마 - 종료 상태 판정 헬퍼 isCrawlTerminal() TanStack Query 훅 (src/hooks/): - useCrawl.ts: useStartSiteCrawl, useCrawlJob (2초 폴링, 종료 시 자동 중단), useCancelCrawl - queryKeys에 crawl.job 키 UI 프리미티브 (src/components/ui/): - select.tsx, progress.tsx, badge.tsx (success/warning/destructive variants 포함) CrawlPage 완전 교체 (src/pages/): - 2열 레이아웃: 좌측 크롤 설정 폼 + 우측 진행 상태 - 폼: 소스 선택 (드롭다운, 비어있으면 소스 추가 안내) + 시드 URL + max_depth/max_pages + same_domain_only - react-hook-form + zod 검증 - 진행 상태: 상태 배지, 진행률 바, visited/queued/analyzed 카운터, 최근 페이지, 에러 details - 크롤 종료시 폴링 자동 중단, 완료시 "결과 검토" 버튼 - 취소 버튼 → /crawl-site/jobs/{id}/cancel - sonner 토스트 i18n: crawl.* 키 (한/영) 다음 단계: Phase 1.4 — 자율 연구 (POST /research/run by-project 마이그레이션 + ResearchPage) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 15:04:41 +09:00
# React UI 재구축 작업 계획
> **목적**: 기존 vanilla JS UI를 React + TypeScript + TanStack Query + shadcn으로 재구축.
> 세션이 끊겨도 이 파일을 보고 이어서 작업할 수 있도록 단일 진실 소스(single source of truth).
## 사용자 비전 (전체 흐름)
1. **프로젝트 생성** — 어떤 종류의 온톨로지를 구축할지 도메인을 정하고 프로젝트별로 구분
2. **온톨로지 기본 요소 입력** — 엔티티, 클레임 등을 직접 입력 또는 참고 사이트 URL로 자동 추출
3. **자료수집** — 시드 URL에서 시작해 링크를 따라가며 정보 추출 + 장시간 자율 온톨로지 구축
4. **그래프 보기/편집** — 온톨로지 관계를 그래프 맵으로 시각화하고 편집
5. **JSON 직접 입력** — 데이터를 JSON으로 직접 넣을 수 있는 UI
## 작업 보드
### ✅ 완료
| Phase | 내용 | 커밋 |
|---|---|---|
| Phase 0 | React + Vite + TS 환경 + 라우팅 + Redux placeholder | `1be2c7d` |
| Phase 0.5 | API 클라이언트 + TanStack Query + shadcn UI + AppShell + Dashboard 연결 | `37cad40` |
| Phase 1.1 | 프로젝트 생성 (OnboardingPage 폼 + 백엔드 `POST /projects/inline`, `GET /domains`) | `8681ac8` |
| Phase 1.2 | 참고 소스 관리 (ConfigureSourcesPage CRUD + 백엔드 `POST/DELETE /projects/{name}/sources`) | `461ebc0` |
Phase 1.4: 자율 연구 — by-project 엔드포인트 + ResearchPage + 세션 이력 백엔드 (crawler_platform/app/api/routes.py): - POST /research/run/by-project 추가 — config_path 의존 제거 - ResearchRunByProjectRequest: project_name 기반, DB project.config 재구성 - GraphResearchLoop 동기 실행 (장시간 가능), asdict(result) 반환 - 기존 /projects/{n}/research/sessions, /research/sessions/{job_id}는 변경 없음 프론트엔드 API (src/lib/api/): - research.ts: researchApi.startByProject/listSessions/getSession + Zod 스키마 - 결과 페이로드는 passthrough() (백엔드 dataclass 그대로 노출) TanStack Query 훅 (src/hooks/): - useResearch.ts: useStartResearch, useResearchSessions, useResearchSession - queryKeys에 research.sessions, research.session 키 ResearchPage 신규 (src/pages/ResearchPage.tsx): - 2열 레이아웃: 좌측 연구 설정 폼 + 우측 결과/이력 - 폼: 소스 선택, goal 텍스트(필수, 3~500자), 시드 URL(선택), max_steps/max_branch/max_depth/min_relevance, same_domain_only react-hook-form + zod 검증 - 결과 카드: 단계/페이지/엔티티/클레임 4종 stats + raw JSON details - 세션 이력 카드: GET /projects/{n}/research/sessions 결과 리스트 - 실행 중 안내 (장시간 가능), sonner 토스트 라우팅 & Sidebar: - App.tsx: /research/:projectId 라우트 추가 - AppShell: 사이드바에 "자율 연구" 메뉴 (Brain 아이콘) i18n: research.*, nav.research 키 (한/영) 다음 단계: Phase 1.5 — 엔티티/클레임 직접 입력 (백엔드 POST /projects/{n}/entities, /claims 신규 필요) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 19:01:52 +09:00
| Phase 1.3 | 시드 크롤 (CrawlPage + 폴링 + 취소, 백엔드 `POST /crawl-site/by-project`) | `aaaaa05` |
Phase 1.5: 엔티티/클레임 직접 입력 — OntologyEditorPage + 3탭 (엔티티/클레임/JSON 일괄) 백엔드 (crawler_platform/app/api/routes.py): - POST /projects/{n}/entities: 단일 엔티티 직접 생성 (upsert) - CreateEntityRequest (entity_type, name, metadata) - POST /projects/{n}/entities/bulk: 다수 엔티티 일괄 생성 - BulkCreateEntitiesRequest, 응답 created 수 + entities - DELETE /projects/{n}/entities/{id}: 단일 엔티티 삭제 - POST /projects/{n}/claims: 단일 클레임 직접 생성 - CreateClaimRequest (source_name, subject_entity_id, predicate, object_entity_id|object_value, confidence, confidence_reason, evidence_text) - claim_hash로 중복 검출 → 있으면 confidence/메타 갱신 - status="validated_claim", extraction_method="manual" - evidence_text 있으면 Evidence 자동 생성 - DELETE /projects/{n}/claims/{id}: 단일 클레임 삭제 프론트엔드 API (src/lib/api/): - entities.ts: list/create/bulkCreate/delete + Zod 스키마 - claims.ts: list/create/delete + Zod 스키마 (passthrough) TanStack Query 훅 (src/hooks/): - useEntities.ts: useEntities, useCreateEntity, useBulkCreateEntities, useDeleteEntity - useClaims.ts: useClaims, useCreateClaim, useDeleteClaim - queryKeys에 entities.list, claims.list 키 팩토리 UI 프리미티브 (src/components/ui/): - tabs.tsx: Tabs, TabsList, TabsTrigger, TabsContent (Context API 기반) OntologyEditorPage 신규 (src/pages/): - 3개 탭 구조: * 엔티티 탭: 도메인의 entity_types에서 타입 선택 + 이름 입력 → 추가 + 엔티티 목록 (max-h scroll, 타입 배지, 삭제 버튼) * 클레임 탭: 소스/주어/술어/목적어(엔티티 or 리터럴)/신뢰도 입력 + 클레임 목록 (S-P-O 시각화, 신뢰도, status 배지) * JSON 일괄 탭: textarea에 { entities: [...] } 붙여넣기 → 파싱 → bulkCreate - react-hook-form + zod 검증 - useOntology(domain)으로 entity_types/predicates 자동 로드 - 삭제 confirm 대화상자, sonner 토스트 라우팅 & Sidebar: - App.tsx: /editor/:projectId 라우트 추가 - AppShell: 사이드바에 "온톨로지 편집" 메뉴 (Network 아이콘) i18n: editor.*, nav.editor 키 (한/영) UI_REBUILD_PLAN.md 업데이트: - Phase 1.4 `00786a4` 커밋 기록 - Phase 1.5 완료 표시 + 대기 보드 Phase 2/3 재정렬 다음 단계: Phase 2 — 그래프 시각화/편집 (Cytoscape React 래퍼) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 19:10:37 +09:00
| Phase 1.4 | 자율 연구 (ResearchPage + 세션 이력, 백엔드 `POST /research/run/by-project`) | `00786a4` |
| Phase 1.5 | 엔티티/클레임 직접 입력 (OntologyEditorPage 3 탭: 엔티티/클레임/JSON 일괄) | (이번 커밋) |
Phase 1.3: 시드 크롤 — by-project 엔드포인트 + CrawlPage 폼/폴링/취소 세션 영구화: UI_REBUILD_PLAN.md 신설 - 사용자 비전 5가지 흐름 + Phase 보드 + 작업 재개 가이드 - 세션이 끊겨도 이 파일 + git log로 어디까지 했는지 즉시 복원 백엔드 (crawler_platform/app/api/): - routes.py: POST /crawl-site/by-project 추가 — config_path 의존 제거 - SiteCrawlByProjectRequest: project_name 기반, DB project.config 재구성 - run_site_crawl_job이 __config_dict 메타키 인식하도록 최소 변경 - config/loader.py: project_config_from_dict() 헬퍼 추출 (DB dict ↔ ProjectConfig) 프론트엔드 API (src/lib/api/): - crawl.ts: crawlApi.startByProject/getJob/cancel + Zod 스키마 - 종료 상태 판정 헬퍼 isCrawlTerminal() TanStack Query 훅 (src/hooks/): - useCrawl.ts: useStartSiteCrawl, useCrawlJob (2초 폴링, 종료 시 자동 중단), useCancelCrawl - queryKeys에 crawl.job 키 UI 프리미티브 (src/components/ui/): - select.tsx, progress.tsx, badge.tsx (success/warning/destructive variants 포함) CrawlPage 완전 교체 (src/pages/): - 2열 레이아웃: 좌측 크롤 설정 폼 + 우측 진행 상태 - 폼: 소스 선택 (드롭다운, 비어있으면 소스 추가 안내) + 시드 URL + max_depth/max_pages + same_domain_only - react-hook-form + zod 검증 - 진행 상태: 상태 배지, 진행률 바, visited/queued/analyzed 카운터, 최근 페이지, 에러 details - 크롤 종료시 폴링 자동 중단, 완료시 "결과 검토" 버튼 - 취소 버튼 → /crawl-site/jobs/{id}/cancel - sonner 토스트 i18n: crawl.* 키 (한/영) 다음 단계: Phase 1.4 — 자율 연구 (POST /research/run by-project 마이그레이션 + ResearchPage) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 15:04:41 +09:00
### 🚧 진행 중
Phase 1.5: 엔티티/클레임 직접 입력 — OntologyEditorPage + 3탭 (엔티티/클레임/JSON 일괄) 백엔드 (crawler_platform/app/api/routes.py): - POST /projects/{n}/entities: 단일 엔티티 직접 생성 (upsert) - CreateEntityRequest (entity_type, name, metadata) - POST /projects/{n}/entities/bulk: 다수 엔티티 일괄 생성 - BulkCreateEntitiesRequest, 응답 created 수 + entities - DELETE /projects/{n}/entities/{id}: 단일 엔티티 삭제 - POST /projects/{n}/claims: 단일 클레임 직접 생성 - CreateClaimRequest (source_name, subject_entity_id, predicate, object_entity_id|object_value, confidence, confidence_reason, evidence_text) - claim_hash로 중복 검출 → 있으면 confidence/메타 갱신 - status="validated_claim", extraction_method="manual" - evidence_text 있으면 Evidence 자동 생성 - DELETE /projects/{n}/claims/{id}: 단일 클레임 삭제 프론트엔드 API (src/lib/api/): - entities.ts: list/create/bulkCreate/delete + Zod 스키마 - claims.ts: list/create/delete + Zod 스키마 (passthrough) TanStack Query 훅 (src/hooks/): - useEntities.ts: useEntities, useCreateEntity, useBulkCreateEntities, useDeleteEntity - useClaims.ts: useClaims, useCreateClaim, useDeleteClaim - queryKeys에 entities.list, claims.list 키 팩토리 UI 프리미티브 (src/components/ui/): - tabs.tsx: Tabs, TabsList, TabsTrigger, TabsContent (Context API 기반) OntologyEditorPage 신규 (src/pages/): - 3개 탭 구조: * 엔티티 탭: 도메인의 entity_types에서 타입 선택 + 이름 입력 → 추가 + 엔티티 목록 (max-h scroll, 타입 배지, 삭제 버튼) * 클레임 탭: 소스/주어/술어/목적어(엔티티 or 리터럴)/신뢰도 입력 + 클레임 목록 (S-P-O 시각화, 신뢰도, status 배지) * JSON 일괄 탭: textarea에 { entities: [...] } 붙여넣기 → 파싱 → bulkCreate - react-hook-form + zod 검증 - useOntology(domain)으로 entity_types/predicates 자동 로드 - 삭제 confirm 대화상자, sonner 토스트 라우팅 & Sidebar: - App.tsx: /editor/:projectId 라우트 추가 - AppShell: 사이드바에 "온톨로지 편집" 메뉴 (Network 아이콘) i18n: editor.*, nav.editor 키 (한/영) UI_REBUILD_PLAN.md 업데이트: - Phase 1.4 `00786a4` 커밋 기록 - Phase 1.5 완료 표시 + 대기 보드 Phase 2/3 재정렬 다음 단계: Phase 2 — 그래프 시각화/편집 (Cytoscape React 래퍼) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 19:10:37 +09:00
(없음 — Phase 2 시작 전)
Phase 1.3: 시드 크롤 — by-project 엔드포인트 + CrawlPage 폼/폴링/취소 세션 영구화: UI_REBUILD_PLAN.md 신설 - 사용자 비전 5가지 흐름 + Phase 보드 + 작업 재개 가이드 - 세션이 끊겨도 이 파일 + git log로 어디까지 했는지 즉시 복원 백엔드 (crawler_platform/app/api/): - routes.py: POST /crawl-site/by-project 추가 — config_path 의존 제거 - SiteCrawlByProjectRequest: project_name 기반, DB project.config 재구성 - run_site_crawl_job이 __config_dict 메타키 인식하도록 최소 변경 - config/loader.py: project_config_from_dict() 헬퍼 추출 (DB dict ↔ ProjectConfig) 프론트엔드 API (src/lib/api/): - crawl.ts: crawlApi.startByProject/getJob/cancel + Zod 스키마 - 종료 상태 판정 헬퍼 isCrawlTerminal() TanStack Query 훅 (src/hooks/): - useCrawl.ts: useStartSiteCrawl, useCrawlJob (2초 폴링, 종료 시 자동 중단), useCancelCrawl - queryKeys에 crawl.job 키 UI 프리미티브 (src/components/ui/): - select.tsx, progress.tsx, badge.tsx (success/warning/destructive variants 포함) CrawlPage 완전 교체 (src/pages/): - 2열 레이아웃: 좌측 크롤 설정 폼 + 우측 진행 상태 - 폼: 소스 선택 (드롭다운, 비어있으면 소스 추가 안내) + 시드 URL + max_depth/max_pages + same_domain_only - react-hook-form + zod 검증 - 진행 상태: 상태 배지, 진행률 바, visited/queued/analyzed 카운터, 최근 페이지, 에러 details - 크롤 종료시 폴링 자동 중단, 완료시 "결과 검토" 버튼 - 취소 버튼 → /crawl-site/jobs/{id}/cancel - sonner 토스트 i18n: crawl.* 키 (한/영) 다음 단계: Phase 1.4 — 자율 연구 (POST /research/run by-project 마이그레이션 + ResearchPage) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 15:04:41 +09:00
### ⏳ 대기
| Phase | 내용 | 다음 액션 |
|---|---|---|
Phase 1.5: 엔티티/클레임 직접 입력 — OntologyEditorPage + 3탭 (엔티티/클레임/JSON 일괄) 백엔드 (crawler_platform/app/api/routes.py): - POST /projects/{n}/entities: 단일 엔티티 직접 생성 (upsert) - CreateEntityRequest (entity_type, name, metadata) - POST /projects/{n}/entities/bulk: 다수 엔티티 일괄 생성 - BulkCreateEntitiesRequest, 응답 created 수 + entities - DELETE /projects/{n}/entities/{id}: 단일 엔티티 삭제 - POST /projects/{n}/claims: 단일 클레임 직접 생성 - CreateClaimRequest (source_name, subject_entity_id, predicate, object_entity_id|object_value, confidence, confidence_reason, evidence_text) - claim_hash로 중복 검출 → 있으면 confidence/메타 갱신 - status="validated_claim", extraction_method="manual" - evidence_text 있으면 Evidence 자동 생성 - DELETE /projects/{n}/claims/{id}: 단일 클레임 삭제 프론트엔드 API (src/lib/api/): - entities.ts: list/create/bulkCreate/delete + Zod 스키마 - claims.ts: list/create/delete + Zod 스키마 (passthrough) TanStack Query 훅 (src/hooks/): - useEntities.ts: useEntities, useCreateEntity, useBulkCreateEntities, useDeleteEntity - useClaims.ts: useClaims, useCreateClaim, useDeleteClaim - queryKeys에 entities.list, claims.list 키 팩토리 UI 프리미티브 (src/components/ui/): - tabs.tsx: Tabs, TabsList, TabsTrigger, TabsContent (Context API 기반) OntologyEditorPage 신규 (src/pages/): - 3개 탭 구조: * 엔티티 탭: 도메인의 entity_types에서 타입 선택 + 이름 입력 → 추가 + 엔티티 목록 (max-h scroll, 타입 배지, 삭제 버튼) * 클레임 탭: 소스/주어/술어/목적어(엔티티 or 리터럴)/신뢰도 입력 + 클레임 목록 (S-P-O 시각화, 신뢰도, status 배지) * JSON 일괄 탭: textarea에 { entities: [...] } 붙여넣기 → 파싱 → bulkCreate - react-hook-form + zod 검증 - useOntology(domain)으로 entity_types/predicates 자동 로드 - 삭제 confirm 대화상자, sonner 토스트 라우팅 & Sidebar: - App.tsx: /editor/:projectId 라우트 추가 - AppShell: 사이드바에 "온톨로지 편집" 메뉴 (Network 아이콘) i18n: editor.*, nav.editor 키 (한/영) UI_REBUILD_PLAN.md 업데이트: - Phase 1.4 `00786a4` 커밋 기록 - Phase 1.5 완료 표시 + 대기 보드 Phase 2/3 재정렬 다음 단계: Phase 2 — 그래프 시각화/편집 (Cytoscape React 래퍼) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 19:10:37 +09:00
| **Phase 2** | 그래프 시각화/편집 (Cytoscape 또는 react-flow 래퍼) | `GET /projects/{n}/graph/neighborhood` + `legacy/graph.js` 패턴 참고 |
| Phase 3 | JSON Import/Export 전용 페이지 (Editor의 일괄 입력 탭 확장) | 독립 가능 |
Phase 1.3: 시드 크롤 — by-project 엔드포인트 + CrawlPage 폼/폴링/취소 세션 영구화: UI_REBUILD_PLAN.md 신설 - 사용자 비전 5가지 흐름 + Phase 보드 + 작업 재개 가이드 - 세션이 끊겨도 이 파일 + git log로 어디까지 했는지 즉시 복원 백엔드 (crawler_platform/app/api/): - routes.py: POST /crawl-site/by-project 추가 — config_path 의존 제거 - SiteCrawlByProjectRequest: project_name 기반, DB project.config 재구성 - run_site_crawl_job이 __config_dict 메타키 인식하도록 최소 변경 - config/loader.py: project_config_from_dict() 헬퍼 추출 (DB dict ↔ ProjectConfig) 프론트엔드 API (src/lib/api/): - crawl.ts: crawlApi.startByProject/getJob/cancel + Zod 스키마 - 종료 상태 판정 헬퍼 isCrawlTerminal() TanStack Query 훅 (src/hooks/): - useCrawl.ts: useStartSiteCrawl, useCrawlJob (2초 폴링, 종료 시 자동 중단), useCancelCrawl - queryKeys에 crawl.job 키 UI 프리미티브 (src/components/ui/): - select.tsx, progress.tsx, badge.tsx (success/warning/destructive variants 포함) CrawlPage 완전 교체 (src/pages/): - 2열 레이아웃: 좌측 크롤 설정 폼 + 우측 진행 상태 - 폼: 소스 선택 (드롭다운, 비어있으면 소스 추가 안내) + 시드 URL + max_depth/max_pages + same_domain_only - react-hook-form + zod 검증 - 진행 상태: 상태 배지, 진행률 바, visited/queued/analyzed 카운터, 최근 페이지, 에러 details - 크롤 종료시 폴링 자동 중단, 완료시 "결과 검토" 버튼 - 취소 버튼 → /crawl-site/jobs/{id}/cancel - sonner 토스트 i18n: crawl.* 키 (한/영) 다음 단계: Phase 1.4 — 자율 연구 (POST /research/run by-project 마이그레이션 + ResearchPage) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-14 15:04:41 +09:00
---
## Phase 1.3 — 시드 크롤 (CrawlPage)
### 백엔드 (대부분 존재)
-`POST /crawl-site` — site-wide crawl 시작 (CrawlRequest 모델 확장)
-`GET /crawl-site/jobs/{id}` — 진행 상태 조회
-`POST /crawl-site/jobs/{id}/cancel` — 작업 취소
### 프론트엔드 작업 항목
- [ ] `src/lib/api/crawl.ts` — Zod 스키마 + `crawlApi.startSite/getJob/cancelJob`
- [ ] `src/hooks/useCrawl.ts``useStartCrawl`, `useCrawlJob`(폴링), `useCancelCrawl`
- [ ] `src/components/ui/select.tsx` — 소스 선택 드롭다운
- [ ] `src/components/ui/progress.tsx` — 진행률 표시 바
- [ ] `src/components/ui/badge.tsx` — 상태 배지
- [ ] `CrawlPage` 재설계:
- 좌측: 시드 URL 입력 폼 + 소스 선택 + max_depth/max_pages
- 우측: 진행 중 작업 카드 (페이지 수, 단계, 로그)
- 작업 완료 시 결과 페이지로 이동
- [ ] i18n locale `crawl.*` 키 추가
### 검증 포인트
- [ ] 백엔드 미구동시 명확한 에러
- [ ] 폴링 간격: 2초, 작업 종료(완료/실패/취소)시 폴링 중단
- [ ] cancel 버튼 → 백엔드에 취소 요청 + UI 정리
---
## Phase 1.4 — 자율 연구 (Research Loop)
### 백엔드
-`POST /research/run``ResearchRunRequest` (CrawlRequest 확장 + max_depth, max_steps, max_branch, min_relevance...)
-`GET /projects/{n}/research/sessions` — 세션 이력
-`GET /research/sessions/{job_id}` — 단일 세션 상세
### 프론트엔드 작업 항목
- [ ] `src/lib/api/research.ts` + Zod 스키마
- [ ] `src/hooks/useResearch.ts``useStartResearch`, `useResearchSession`, `useResearchHistory`
- [ ] Sidebar에 "자율 연구" 메뉴 추가
- [ ] 새 페이지 `src/pages/ResearchPage.tsx`:
- 시작 폼: 시드 URL, 목표(goal) 텍스트, max_steps, min_relevance 등
- 진행 표시: 현재 step, 누적 페이지 수, 발견 엔티티, 관련도
- 세션 이력 사이드 패널
- [ ] i18n locale `research.*`
---
## Phase 1.5 — 엔티티/클레임 직접 입력
### 백엔드 (신규 필요)
- [ ] `POST /projects/{n}/entities` — 단일 엔티티 직접 생성
- [ ] `POST /projects/{n}/entities/bulk` — 다수 엔티티 일괄 입력
- [ ] `POST /projects/{n}/claims` — 단일 클레임 직접 생성
- [ ] `PATCH /projects/{n}/entities/{id}` — 엔티티 수정
### 프론트엔드 작업 항목
- [ ] `src/lib/api/entities.ts`, `src/lib/api/claims.ts` + Zod
- [ ] `src/hooks/useEntities.ts`, `useClaims.ts`
- [ ] `src/components/ui/dialog.tsx` — 입력 다이얼로그 (Radix UI 검토)
- [ ] `src/components/ui/table.tsx`
- [ ] 새 페이지 `src/pages/OntologyEditorPage.tsx`:
- 엔티티 탭 / 클레임 탭
- 엔티티 추가/편집 다이얼로그 (label, type, properties)
- 클레임 추가 다이얼로그 (subject/predicate/object/confidence)
- 일괄 입력 토글 (JSON 텍스트 → 파싱)
- [ ] 네비게이션: ConfigureSourcesPage에서 "직접 입력" 진입점 추가
---
## Phase 2 — 그래프 시각화/편집
### 백엔드 (대부분 존재)
-`GET /projects/{n}/graph/neighborhood` — 노드 주변 부분 그래프
-`GET /projects/{n}/graph/query` — 패턴 매칭 쿼리
### 프론트엔드 작업 항목
- [ ] Cytoscape 의존성 그대로 활용 (`legacy/graph.js` 패턴 참고)
- [ ] `src/components/graph/GraphView.tsx` — Cytoscape React 래퍼
- 노드 클릭 → 인스펙터, 더블 클릭 → neighborhood 확장
- [ ] 새 페이지 `src/pages/GraphPage.tsx`:
- 좌측: 노드 검색 / 필터
- 중앙: 그래프 캔버스
- 우측: 선택 노드 인스펙터 + 편집
- [ ] 그래프 편집 mutation (노드 속성 변경, 엣지 추가/삭제) — Phase 1.5 백엔드 재사용
---
## Phase 3 — JSON Import/Export
### 백엔드
- [ ] `POST /projects/{n}/import/json` — JSON 일괄 import (엔티티 + 클레임 + 관계)
- [ ] `GET /projects/{n}/export/json` — 전체 온톨로지 JSON 다운로드
### 프론트엔드
- [ ] 새 페이지/탭 `ImportExportPage.tsx`:
- 파일 드래그&드롭 / 텍스트 영역 붙여넣기
- 미리보기 → 충돌 처리 (덮어쓰기/병합/스킵)
- import 진행 상태 + 결과 요약
- [ ] Export 버튼 → JSON 다운로드 또는 클립보드 복사
---
## 작업 재개 가이드
세션을 처음 열거나 끊긴 후 다시 시작할 때:
1. **이 파일을 먼저 읽기** — 현재 상태 파악
2. **git log --oneline -10** — 최근 커밋과 작업 보드 대조
3. **🚧 진행 중** 행의 "다음 액션"부터 시작
4. 완료 후:
- 이 파일의 체크박스/상태/커밋 해시 업데이트
- 같은 커밋에 이 파일도 함께 포함
## 컨벤션
- 커밋 메시지: `Phase X.Y: 한 줄 요약 — 핵심 내용`
- 백엔드 변경은 같은 커밋에 묶기 (프론트만 또는 백만 따로 분리 X)
- 모든 폼: react-hook-form + zod
- 모든 서버 통신: TanStack Query 훅을 거침 (Redux 직접 X)
- 모든 새 UI 컴포넌트: shadcn 패턴(forwardRef + cn)
- i18n 키 사용 시 fallback 문자열 같이 (`t("key", "한글 fallback")`)
- 영문/한글 locale 동시 업데이트