Skip to content

feat: 문장 분석 읽기와 선택적 구간·계층 수정 - #163

Merged
Yelihi merged 4 commits into
feature/149-grammar-domainfrom
feature/150-grammar-analysis-edit
Oct 5, 2026
Merged

Yelihi merged 4 commits into
feature/149-grammar-domainfrom
feature/150-grammar-analysis-edit

Conversation

@Yelihi

@Yelihi Yelihi commented Oct 5, 2026 •

Copy link
Copy Markdown
Owner

AI가 나눈 문장을 읽는 것을 기본 흐름으로 제공합니다. chunk를 누르면 문장 아래에 직독직해·문장 성분·설명·관련 구문이 나타납니다. 선택은 흰 블록과 중립색 그림자로 표현하고, 작은 상승/등장 효과에는 reduced-motion 대응을 적용했습니다.

분석 수정에서만 의미 덩어리 경계 이동·나누기·합치기와 문법 항목의 구간·계층을 편집합니다. 읽기로 돌아가기/Escape로 복귀할 수 있고, 미적용 입력은 공통 ConfirmDialog로 보호합니다. 원문을 보존하며 잘못된 경계/계층 수정은 원자적으로 거절합니다. 문장 끝에서 빈 구간을 추가하는 동작도 차단했습니다.

Closes #150

선행 PR: #162 (#149). Base는 feature/149-grammar-domain입니다. #162 병합 후 main 기준으로 변경해 검토할 수 있습니다.

인터페이스·상태·편집 이벤트는 features의 model/store/service에 두고 읽기 표시, 도구 모음, 편집 탐색, 입력, 이탈 확인을 작은 컴포넌트로 분리했습니다. Tailwind/CVA 및 chunk 단위 상태 구독을 사용합니다.

편집 이벤트는 edit(service => service.moveBoundary(chunkId, end))처럼 EditAnalysisService 메서드를 직접 호출합니다. 공통 도메인 검증, 순차 편집 적용, store의 성공 반영을 분리하여 새 편집 추가 시 중앙 action-type 분기를 수정하지 않도록 했습니다. 배치가 실패하면 중간 결과를 반영하지 않습니다.

읽기 모델 변환은 models/converters/convertAnalysisToChunkReading.ts에 둡니다. 에디터별 store를 Provider 수명에 묶어 분석·선택·미적용 입력을 격리하고, Context에는 고정된 store 참조만 전달합니다. 부모 콜백이 바뀌어도 최신 수신자에게 알리며 편집 내용은 유지합니다. 다른 문서로 교체할 때는 key를 변경합니다.

풀이 필드, 경계 미리보기, 나누기 미리보기를 분리했습니다. 풀이 입력은 적용 시 읽고 미리보기 state는 각각의 컴포넌트가 소유합니다. Escape 핸들러는 이벤트 시점의 store 상태를 읽어 별도 구독을 없앴고 확인창 내부 Escape는 Radix가 처리합니다. DOM에 직접 전달하는 핸들러에는 참조 메모화가 필요하지 않아 useCallback을 추가하지 않았습니다.

검증:

  • 전체 Jest: 125 suites / 462 tests 통과.
  • Chromium Storybook: 10개 통과(기존 6개 + 풀이 입력, 경계 미리보기/적용, 마지막 구간 비활성, 나누기 미리보기/적용).
  • TypeScript, 변경 범위 ESLint, Next.js production build 통과.
  • 기존 디자인 검증에서 실제 브라우저 데스크톱/390px 읽기 화면 확인. 모바일 가로 넘침 없음.
  • 이탈 확인, 입력 보존, Escape 포커스와 기존 편집 실패 복구 검증.
  • 두 에디터 간 상태 격리, 부모 재렌더링/콜백 교체, 문서 교체, 확인창 Escape 및 입력별 렌더링 범위 검증.
  • client 파일 분리가 하위 트리를 자동으로 Server Component로 바꾸는 것은 아니며, 이번 변경에서 SSR·번들 크기 개선을 주장하지 않습니다.

미리보기: npm run storybook → features/grammar-analysis-edit/GrammarAnalysisEditor.

범위는 독립 컴포넌트와 Storybook이며 fixture를 사용합니다. 실제 등록 페이지·AI·저장 연결은 #153 및 선행 이슈에서 진행합니다. 검토 기록: docs/design/echo/grammar-practice-20261005/analysis-reading-review.md.

@chatgpt-codex-connector

Copy link
Copy Markdown

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, add credits to your account and enable them for code reviews in your settings.

@Yelihi Yelihi changed the title feat: 문장 아래 분석 풀이와 구간·계층 편집 feat: 문장 분석 읽기와 선택적 구간·계층 수정 Oct 5, 2026
Comment thread src/features/grammar-analysis-edit/models/interface.ts Outdated
import type { AnalysisEditorProps, AnalysisEditorState } from "./interface";
import { editAnalysis } from "../services/editAnalysis";

export function createAnalysisEditorStore({ initialAnalysis, onChange }: AnalysisEditorProps) {

Copy link
Copy Markdown
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

인자로 초기값과 이벤트를 받는데, 분석 에디터의 경우 여러 군데에서 스토어가 생성되어야 하나요 아니면 테스트 대비 의존 주입일까요?

Comment thread src/features/grammar-analysis-edit/ui/AnalysisEditorProvider.tsx
Comment thread src/features/grammar-analysis-edit/ui/ChunkEditor.tsx
@Yelihi
Yelihi merged commit a1ba9f7 into feature/149-grammar-domain Oct 5, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant