chore(release): v0.3.6 — 이동 modal 복원 (v0.3.5 의도 정정)
v0.3.5 의 이동 dropdown 단순화가 사용자 의도와 어긋남. 사용자는 dropdown 의 목적지 중복 (modal 도 목적지 묻기) 만 거슬렸지, 사유 입력 + AI 자동 분류 + 수동 status 선택을 한 곳에서 처리하는 modal 은 보존해야 하는 핵심 UX 였음. 단일 "이동" 버튼 → MoveStatusModal path 로 정정. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
import React, { useEffect, useRef, useState } from 'react';
|
||||
import type { Note, NoteStatus } from '@shared/types';
|
||||
import React, { useState } from 'react';
|
||||
import type { Note } from '@shared/types';
|
||||
import { KST_OFFSET_MS } from '@shared/util/kstDate.js';
|
||||
import { inboxApi } from '../api.js';
|
||||
import { useInbox } from '../store.js';
|
||||
import { EditableField } from './EditableField.js';
|
||||
import { IntentBanner } from './IntentBanner.js';
|
||||
import { pushTagUndo } from './TagUndoToast.js';
|
||||
import { statusLabelWithParticle } from './statusLabel.js';
|
||||
import { MoveStatusModal } from './MoveStatusModal.js';
|
||||
import { RevisionHistoryModal } from './RevisionHistoryModal.js';
|
||||
|
||||
interface Props {
|
||||
@@ -116,38 +116,14 @@ export function NoteCard({ note, onDeleted, onUpdated, mode = 'inbox', onRestore
|
||||
const [local, setLocal] = useState(note);
|
||||
const isAiDisabled = local.aiStatus === 'disabled';
|
||||
const fallbackTitle = local.rawText.split('\n')[0]?.slice(0, 60) || '(빈 메모)';
|
||||
// v0.2.9 Cut B Task 6 — 이동 메뉴 dropdown. dropdown 항목 클릭 = 해당 status 로 즉시 이동.
|
||||
const [menuOpen, setMenuOpen] = useState(false);
|
||||
const menuRef = useRef<HTMLDivElement | null>(null);
|
||||
// 이동 modal 열림 여부. 클릭 시 MoveStatusModal 에서 사유 + AI 분류 + 수동 분류 선택.
|
||||
const [moveOpen, setMoveOpen] = useState(false);
|
||||
const [editingRaw, setEditingRaw] = useState(false);
|
||||
const [draftRaw, setDraftRaw] = useState('');
|
||||
const [showRevisions, setShowRevisions] = useState(false);
|
||||
|
||||
const possibleTargets: NoteStatus[] = (
|
||||
['active', 'completed', 'archived', 'trashed'] as NoteStatus[]
|
||||
).filter((s) => s !== local.status);
|
||||
|
||||
React.useEffect(() => { setLocal(note); }, [note]);
|
||||
|
||||
// 이동 dropdown 외부 클릭 / Escape 로 닫기. menuOpen=true 일 때만 listener 활성.
|
||||
useEffect(() => {
|
||||
if (!menuOpen) return;
|
||||
function onMouseDown(e: MouseEvent) {
|
||||
if (menuRef.current && !menuRef.current.contains(e.target as Node)) {
|
||||
setMenuOpen(false);
|
||||
}
|
||||
}
|
||||
function onKey(e: KeyboardEvent) {
|
||||
if (e.key === 'Escape') setMenuOpen(false);
|
||||
}
|
||||
document.addEventListener('mousedown', onMouseDown);
|
||||
document.addEventListener('keydown', onKey);
|
||||
return () => {
|
||||
document.removeEventListener('mousedown', onMouseDown);
|
||||
document.removeEventListener('keydown', onKey);
|
||||
};
|
||||
}, [menuOpen]);
|
||||
|
||||
const formatted = new Date(note.createdAt).toLocaleString('ko-KR');
|
||||
|
||||
async function saveTitle(next: string) {
|
||||
@@ -443,71 +419,23 @@ export function NoteCard({ note, onDeleted, onUpdated, mode = 'inbox', onRestore
|
||||
alignItems: 'center'
|
||||
}}
|
||||
>
|
||||
{/* v0.2.9 Cut B Task 6 — 모든 view 공통 "이동 ▾" dropdown.
|
||||
현재 status 와 다른 3개 목적지만 표시. */}
|
||||
<div ref={menuRef} style={{ position: 'relative' }}>
|
||||
<button
|
||||
onClick={() => setMenuOpen((o) => !o)}
|
||||
aria-label="이동"
|
||||
style={{
|
||||
background: 'none',
|
||||
border: '1px solid #ccc',
|
||||
color: '#444',
|
||||
cursor: 'pointer',
|
||||
fontSize: 12,
|
||||
padding: '4px 10px',
|
||||
borderRadius: 4
|
||||
}}
|
||||
>
|
||||
이동 ▾
|
||||
</button>
|
||||
{menuOpen && (
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
right: 0,
|
||||
top: '100%',
|
||||
marginTop: 2,
|
||||
background: '#fff',
|
||||
border: '1px solid #ccc',
|
||||
borderRadius: 4,
|
||||
padding: 4,
|
||||
zIndex: 10,
|
||||
minWidth: 140,
|
||||
boxShadow: '0 2px 6px rgba(0,0,0,0.08)'
|
||||
}}
|
||||
>
|
||||
{possibleTargets.map((t) => (
|
||||
<button
|
||||
key={t}
|
||||
onClick={async () => {
|
||||
setMenuOpen(false);
|
||||
await inboxApi.setStatus(local.id, t, null);
|
||||
const updated = { ...local, status: t, moveReason: null };
|
||||
setLocal(updated);
|
||||
onUpdated(updated);
|
||||
if (t !== local.status) onDeleted?.();
|
||||
// setStatus IPC 는 pushNoteUpdated emit 안 함 → 헤더 탭 counts 가 stale.
|
||||
// refreshMeta 로 server-authoritative counts 재로드.
|
||||
void useInbox.getState().refreshMeta();
|
||||
}}
|
||||
style={{
|
||||
display: 'block',
|
||||
width: '100%',
|
||||
textAlign: 'left',
|
||||
background: 'none',
|
||||
border: 'none',
|
||||
padding: '6px 8px',
|
||||
fontSize: 12,
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
>
|
||||
{statusLabelWithParticle(t)} 이동
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* 이동 버튼 — 클릭 시 MoveStatusModal 진입.
|
||||
사유 입력 + AI 자동 분류 + 수동 status 선택 한 곳에서 처리. */}
|
||||
<button
|
||||
onClick={() => setMoveOpen(true)}
|
||||
aria-label="이동"
|
||||
style={{
|
||||
background: 'none',
|
||||
border: '1px solid #ccc',
|
||||
color: '#444',
|
||||
cursor: 'pointer',
|
||||
fontSize: 12,
|
||||
padding: '4px 10px',
|
||||
borderRadius: 4
|
||||
}}
|
||||
>
|
||||
이동
|
||||
</button>
|
||||
|
||||
{/* trash mode 만 영구 삭제 + 복구 보존 (휴지통 단독 액션). */}
|
||||
{isTrash && (
|
||||
@@ -535,6 +463,25 @@ export function NoteCard({ note, onDeleted, onUpdated, mode = 'inbox', onRestore
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{moveOpen && (
|
||||
<MoveStatusModal
|
||||
noteId={local.id}
|
||||
rawText={local.rawText}
|
||||
summary={local.aiSummary ?? ''}
|
||||
onClose={() => setMoveOpen(false)}
|
||||
onMoved={(newStatus, reason) => {
|
||||
const updated = { ...local, status: newStatus, moveReason: reason };
|
||||
setLocal(updated);
|
||||
onUpdated(updated);
|
||||
// inbox/완료/보관/휴지통 view 의 list 가 status 별로 필터되므로 status 변경 시 onDeleted 호출.
|
||||
if (newStatus !== local.status) onDeleted?.();
|
||||
// setStatus IPC 는 pushNoteUpdated emit 안 함 → 헤더 탭 counts 가 stale.
|
||||
// refreshMeta 로 server-authoritative counts 재로드.
|
||||
void useInbox.getState().refreshMeta();
|
||||
setMoveOpen(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{showRevisions && (
|
||||
<RevisionHistoryModal
|
||||
noteId={local.id}
|
||||
|
||||
Reference in New Issue
Block a user