idea-manager 0.3.2 → 0.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "idea-manager",
-  "version": "0.3.2",
+  "version": "0.5.0",
   "description": "AI 기반 브레인스토밍 → 구조화 → 프롬프트 생성 도구. MCP Server 내장.",
   "keywords": [
     "brainstorm",
@@ -46,6 +46,7 @@
     "open": "^11.0.0",
     "react": "19.2.3",
     "react-dom": "19.2.3",
+    "react-markdown": "^10.1.0",
     "tsx": "^4.21.0"
   },
   "devDependencies": {

package/src/app/api/projects/[id]/sub-projects/[subId]/tasks/[taskId]/chat/route.ts

@@ -3,6 +3,7 @@ import { getTaskConversations, addTaskConversation } from '@/lib/db/queries/task
 import { getTask } from '@/lib/db/queries/tasks';
 import { getTaskPrompt } from '@/lib/db/queries/task-prompts';
 import { getBrainstorm } from '@/lib/db/queries/brainstorms';
+import { getProject } from '@/lib/db/queries/projects';
 import { runClaude } from '@/lib/ai/client';
 
 export async function GET(
@@ -37,9 +38,12 @@ export async function POST(
   const history = getTaskConversations(taskId);
   const prompt = getTaskPrompt(taskId);
   const brainstorm = getBrainstorm(projectId);
+  const project = getProject(projectId);
 
-  const systemPrompt = `You are a helpful assistant helping refine a development task. Respond in Korean. Be concise.
+  const aiPolicy = project?.ai_context ? `\n\nProject AI Policy:\n${project.ai_context}` : '';
 
+  const systemPrompt = `You are a helpful assistant helping refine a development task. Respond in Korean. Be concise.
+${aiPolicy}
 Task: ${task.title}
 Description: ${task.description}
 Status: ${task.status}
@@ -52,9 +56,15 @@ ${brainstorm?.content ? `\nBrainstorming context:\n${brainstorm.content.slice(0,
 
   try {
     const aiResponse = await runClaude(`${systemPrompt}\n\nConversation:\n${conversationText}`);
-    const aiMsg = addTaskConversation(taskId, 'assistant', aiResponse.trim());
+    const trimmed = aiResponse.trim();
+    if (!trimmed) {
+      const fallbackMsg = addTaskConversation(taskId, 'assistant', '(AI 응답을 생성하지 못했습니다. 다시 시도해주세요.)');
+      return NextResponse.json({ userMessage: userMsg, aiMessage: fallbackMsg });
+    }
+    const aiMsg = addTaskConversation(taskId, 'assistant', trimmed);
     return NextResponse.json({ userMessage: userMsg, aiMessage: aiMsg });
   } catch {
-    return NextResponse.json({ error: 'AI response failed' }, { status: 500 });
+    const errorMsg = addTaskConversation(taskId, 'assistant', '(AI 호출에 실패했습니다. Claude CLI가 설치되어 있는지 확인해주세요.)');
+    return NextResponse.json({ userMessage: userMsg, aiMessage: errorMsg });
   }
 }

package/src/app/globals.css

@@ -886,6 +886,78 @@ textarea:focus {
   background: hsl(var(--primary) / 0.6);
 }
 
+/* Chat markdown styling */
+.chat-markdown p {
+  margin: 0.25em 0;
+}
+
+.chat-markdown p:first-child {
+  margin-top: 0;
+}
+
+.chat-markdown p:last-child {
+  margin-bottom: 0;
+}
+
+.chat-markdown strong {
+  font-weight: 700;
+  color: hsl(var(--foreground));
+}
+
+.chat-markdown code {
+  background: hsl(var(--background));
+  padding: 1px 5px;
+  border-radius: 4px;
+  font-size: 0.9em;
+  font-family: var(--font-mono);
+}
+
+.chat-markdown pre {
+  background: hsl(var(--background));
+  padding: 8px 12px;
+  border-radius: 6px;
+  overflow-x: auto;
+  margin: 0.5em 0;
+}
+
+.chat-markdown pre code {
+  background: none;
+  padding: 0;
+}
+
+.chat-markdown ul, .chat-markdown ol {
+  padding-left: 1.4em;
+  margin: 0.3em 0;
+}
+
+.chat-markdown li {
+  margin: 0.15em 0;
+}
+
+.chat-markdown h1, .chat-markdown h2, .chat-markdown h3,
+.chat-markdown h4, .chat-markdown h5, .chat-markdown h6 {
+  font-weight: 700;
+  margin: 0.5em 0 0.25em;
+  line-height: 1.3;
+}
+
+.chat-markdown h1 { font-size: 1.2em; }
+.chat-markdown h2 { font-size: 1.1em; }
+.chat-markdown h3 { font-size: 1.05em; }
+
+.chat-markdown blockquote {
+  border-left: 3px solid hsl(var(--border));
+  padding-left: 10px;
+  margin: 0.4em 0;
+  color: hsl(var(--muted-foreground));
+}
+
+.chat-markdown hr {
+  border: none;
+  border-top: 1px solid hsl(var(--border));
+  margin: 0.5em 0;
+}
+
 /* Dialog animation */
 @keyframes dialogIn {
   from { opacity: 0; transform: scale(0.95) translateY(4px); }

package/src/app/projects/[id]/page.tsx

@@ -7,6 +7,7 @@ import ProjectTree from '@/components/task/ProjectTree';
 import TaskDetail from '@/components/task/TaskDetail';
 import DirectoryPicker from '@/components/DirectoryPicker';
 import ConfirmDialog from '@/components/ui/ConfirmDialog';
+import AiPolicyModal from '@/components/ui/AiPolicyModal';
 import type { ISubProject, ITask, TaskStatus, ISubProjectWithStats } from '@/types';
 
 interface IProject {
@@ -14,6 +15,7 @@ interface IProject {
   name: string;
   description: string;
   project_path: string | null;
+  ai_context: string;
 }
 
 function WorkspaceInner({ id }: { id: string }) {
@@ -32,10 +34,11 @@ function WorkspaceInner({ id }: { id: string }) {
   const [showAddSub, setShowAddSub] = useState(false);
   const [showBrainstorm, setShowBrainstorm] = useState(true);
   const [newSubName, setNewSubName] = useState('');
+  const [showAiPolicy, setShowAiPolicy] = useState(false);
 
   // Resizable panel widths
-  const [leftWidth, setLeftWidth] = useState(280);
-  const [centerWidth, setCenterWidth] = useState(280);
+  const [leftWidth, setLeftWidth] = useState(500);
+  const [centerWidth, setCenterWidth] = useState(500);
   const containerRef = useRef<HTMLDivElement>(null);
   const draggingRef = useRef<'left' | 'center' | null>(null);
   const startXRef = useRef(0);
@@ -221,6 +224,18 @@ function WorkspaceInner({ id }: { id: string }) {
     }
   };
 
+  const handleSaveAiPolicy = async (aiContext: string) => {
+    const res = await fetch(`/api/projects/${id}`, {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ ai_context: aiContext }),
+    });
+    if (res.ok) {
+      setProject(await res.json());
+      setShowAiPolicy(false);
+    }
+  };
+
   // Keyboard shortcuts (use e.code for Korean IME compatibility)
   useEffect(() => {
     const handler = (e: KeyboardEvent) => {
@@ -289,6 +304,16 @@ function WorkspaceInner({ id }: { id: string }) {
           )}
         </div>
         <div className="flex items-center gap-2">
+          <button
+            onClick={() => setShowAiPolicy(true)}
+            className={`px-3 py-1.5 text-xs border rounded-md transition-colors ${
+              project.ai_context
+                ? 'bg-accent/15 text-accent border-accent/30 hover:bg-accent/25'
+                : 'bg-muted hover:bg-card-hover text-muted-foreground border-border'
+            }`}
+          >
+            AI Policy{project.ai_context ? ' *' : ''}
+          </button>
           {!project.project_path && (
             <button
               onClick={() => setShowDirPicker(true)}
@@ -309,10 +334,6 @@ function WorkspaceInner({ id }: { id: string }) {
             <div style={{ width: leftWidth }} className="border-r border-border flex flex-col flex-shrink-0">
               <Editor
                 projectId={id}
-                onContentChange={() => {}}
-                onSendMessage={() => {}}
-                memos={[]}
-                chatLoading={false}
                 onCollapse={() => setShowBrainstorm(false)}
               />
             </div>
@@ -418,6 +439,13 @@ function WorkspaceInner({ id }: { id: string }) {
         onConfirm={handleConfirmAction}
         onCancel={() => setConfirmAction(null)}
       />
+
+      <AiPolicyModal
+        open={showAiPolicy}
+        content={project.ai_context || ''}
+        onSave={handleSaveAiPolicy}
+        onClose={() => setShowAiPolicy(false)}
+      />
     </div>
   );
 }

package/src/components/brainstorm/Editor.tsx

@@ -1,39 +1,18 @@
 'use client';
 
 import { useState, useEffect, useRef, useCallback } from 'react';
-import MemoPin from './MemoPin';
-
-interface Memo {
-  id: string;
-  anchor_text: string;
-  question: string;
-  is_resolved: boolean;
-}
 
 interface EditorProps {
   projectId: string;
-  onContentChange: (content: string) => void;
-  onSendMessage: (message: string) => void;
-  memos?: Memo[];
-  chatLoading?: boolean;
   onCollapse?: () => void;
 }
 
-interface PinPosition {
-  memo: Memo;
-  top: number;
-  left: number;
-}
-
-export default function Editor({ projectId, onContentChange, onSendMessage, memos = [], chatLoading, onCollapse }: EditorProps) {
+export default function Editor({ projectId, onCollapse }: EditorProps) {
   const [content, setContent] = useState('');
   const [saving, setSaving] = useState(false);
   const [loaded, setLoaded] = useState(false);
-  const [pinPositions, setPinPositions] = useState<PinPosition[]>([]);
   const saveTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-  const structureTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
   const textareaRef = useRef<HTMLTextAreaElement>(null);
-  const overlayRef = useRef<HTMLDivElement>(null);
 
   // Load brainstorm content
   useEffect(() => {
@@ -46,37 +25,6 @@ export default function Editor({ projectId, onContentChange, onSendMessage, memo
     load();
   }, [projectId]);
 
-  // Calculate pin positions when memos or content change
-  useEffect(() => {
-    if (!textareaRef.current || !content) {
-      setPinPositions([]);
-      return;
-    }
-
-    const textarea = textareaRef.current;
-    const unresolvedMemos = memos.filter(m => !m.is_resolved);
-    const positions: PinPosition[] = [];
-
-    for (const memo of unresolvedMemos) {
-      const idx = content.indexOf(memo.anchor_text);
-      if (idx === -1) continue;
-
-      // Calculate approximate position based on character index
-      const textBefore = content.substring(0, idx);
-      const lines = textBefore.split('\n');
-      const lineNumber = lines.length - 1;
-      const lineHeight = parseFloat(getComputedStyle(textarea).lineHeight) || 22;
-      const paddingTop = parseFloat(getComputedStyle(textarea).paddingTop) || 16;
-
-      const top = paddingTop + lineNumber * lineHeight;
-      const left = textarea.clientWidth - 28;
-
-      positions.push({ memo, top, left });
-    }
-
-    setPinPositions(positions);
-  }, [memos, content]);
-
   const saveContent = useCallback(async (text: string) => {
     setSaving(true);
     await fetch(`/api/projects/${projectId}/brainstorm`, {
@@ -96,21 +44,6 @@ export default function Editor({ projectId, onContentChange, onSendMessage, memo
     saveTimerRef.current = setTimeout(() => {
       saveContent(newContent);
     }, 1000);
-
-    // Trigger AI structuring with 3s debounce
-    if (structureTimerRef.current) clearTimeout(structureTimerRef.current);
-    if (newContent.trim()) {
-      structureTimerRef.current = setTimeout(() => {
-        onContentChange(newContent);
-      }, 3000);
-    }
-  };
-
-  // Sync scroll between textarea and overlay
-  const handleScroll = () => {
-    if (textareaRef.current && overlayRef.current) {
-      overlayRef.current.scrollTop = textareaRef.current.scrollTop;
-    }
   };
 
   if (!loaded) {
@@ -145,7 +78,6 @@ export default function Editor({ projectId, onContentChange, onSendMessage, memo
           ref={textareaRef}
           value={content}
           onChange={handleChange}
-          onScroll={handleScroll}
           placeholder={`자유롭게 아이디어를 적어보세요...
 
 예시:
@@ -158,21 +90,6 @@ export default function Editor({ projectId, onContentChange, onSendMessage, memo
                      placeholder:text-muted-foreground/40 font-mono text-sm leading-relaxed"
           spellCheck={false}
         />
-        {pinPositions.length > 0 && (
-          <div ref={overlayRef} className="memo-overlay">
-            {pinPositions.map((pin) => (
-              <MemoPin
-                key={pin.memo.id}
-                question={pin.memo.question}
-                anchorText={pin.memo.anchor_text}
-                top={pin.top}
-                left={pin.left}
-                loading={chatLoading}
-                onSendMessage={onSendMessage}
-              />
-            ))}
-          </div>
-        )}
       </div>
     </div>
   );

package/src/components/task/TaskChat.tsx

@@ -2,6 +2,7 @@
 
 import { useState, useEffect, useRef, useCallback } from 'react';
 import type { ITaskConversation } from '@/types';
+import ReactMarkdown from 'react-markdown';
 
 export default function TaskChat({
   basePath,
@@ -79,14 +80,16 @@ export default function TaskChat({
             Ask AI to help refine your task or prompt
           </div>
         )}
-        {messages.map((msg) => (
+        {messages.filter(msg => msg.content).map((msg) => (
           <div key={msg.id} className={`flex flex-col ${msg.role === 'user' ? 'items-end' : 'items-start'}`}>
-            <div className={`max-w-[90%] px-3 py-2 rounded-lg text-sm leading-relaxed whitespace-pre-wrap ${
+            <div className={`max-w-[90%] px-3 py-2 rounded-lg text-sm leading-relaxed ${
               msg.role === 'user'
-                ? 'bg-accent text-white rounded-br-sm'
-                : 'bg-muted text-foreground rounded-bl-sm'
+                ? 'bg-accent text-white rounded-br-sm whitespace-pre-wrap'
+                : 'bg-muted text-foreground rounded-bl-sm chat-markdown'
             }`}>
-              {msg.content}
+              {msg.role === 'assistant'
+                ? <ReactMarkdown>{msg.content}</ReactMarkdown>
+                : msg.content}
             </div>
             {msg.role === 'assistant' && (
               <button

package/src/components/ui/AiPolicyModal.tsx

@@ -0,0 +1,98 @@
+'use client';
+
+import { useState, useEffect, useRef } from 'react';
+
+export default function AiPolicyModal({
+  open,
+  content,
+  onSave,
+  onClose,
+}: {
+  open: boolean;
+  content: string;
+  onSave: (content: string) => void;
+  onClose: () => void;
+}) {
+  const [draft, setDraft] = useState(content);
+  const textareaRef = useRef<HTMLTextAreaElement>(null);
+
+  useEffect(() => {
+    if (open) {
+      setDraft(content);
+      setTimeout(() => textareaRef.current?.focus(), 50);
+    }
+  }, [open, content]);
+
+  useEffect(() => {
+    if (!open) return;
+    const handler = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') onClose();
+      if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') {
+        e.preventDefault();
+        onSave(draft);
+      }
+    };
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, [open, draft, onSave, onClose]);
+
+  if (!open) return null;
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center">
+      <div className="absolute inset-0 bg-black/60 backdrop-blur-sm" onClick={onClose} />
+      <div className="relative bg-card border border-border rounded-xl shadow-2xl w-[640px] max-h-[80vh] flex flex-col animate-dialog-in">
+        <div className="flex items-center justify-between px-5 py-3 border-b border-border">
+          <div>
+            <h3 className="text-sm font-semibold">AI Policy</h3>
+            <p className="text-xs text-muted-foreground mt-0.5">
+              AI 채팅과 프롬프트 다듬기에 항상 포함되는 프로젝트 컨텍스트
+            </p>
+          </div>
+          <button onClick={onClose} className="text-muted-foreground hover:text-foreground text-lg px-1">
+            x
+          </button>
+        </div>
+
+        <div className="flex-1 p-4 overflow-y-auto">
+          <textarea
+            ref={textareaRef}
+            value={draft}
+            onChange={(e) => setDraft(e.target.value)}
+            placeholder={`프로젝트 컨텍스트와 AI 지침을 작성하세요.
+
+예시:
+- 이 프로젝트는 JABIS 스마트워크 시스템입니다
+- 기술 스택: React + TypeScript + Vite (monorepo)
+- DB: PostgreSQL (jabis 스키마)
+- 한국어로 응답할 것
+- 코드 제안 시 기존 컨벤션을 따를 것`}
+            className="w-full bg-input border border-border rounded-lg px-4 py-3 text-sm
+                       text-foreground resize-none focus:border-primary focus:outline-none
+                       leading-relaxed font-mono min-h-[300px]"
+          />
+        </div>
+
+        <div className="flex items-center justify-between px-5 py-3 border-t border-border">
+          <span className="text-xs text-muted-foreground">Cmd+Enter to save</span>
+          <div className="flex items-center gap-2">
+            <button
+              onClick={onClose}
+              className="px-3 py-1.5 text-xs text-muted-foreground hover:text-foreground
+                         border border-border rounded-md transition-colors"
+            >
+              Cancel
+            </button>
+            <button
+              onClick={() => onSave(draft)}
+              className="px-3 py-1.5 text-xs bg-primary text-white rounded-md
+                         hover:bg-primary-hover transition-colors"
+            >
+              Save
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}