@jungjaehoon/mama-os 0.53.0 → 0.57.0

package/public/viewer/src/modules/graph.ts

@@ -65,8 +65,7 @@ type GraphInput = {
 };
 
 const logger = new DebugLogger('Graph');
-const INITIAL_GRAPH_LIMIT = 1000;
-const PHYSICS_NODE_THRESHOLD = 1200;
+const INITIAL_GRAPH_LIMIT = 2000;
 
 /**
  * Graph Module Class
@@ -87,24 +86,23 @@ export class GraphModule {
     }
     this.navigateToNode(btn.dataset.nodeId);
   };
-  topicColors: Record<string, string> = {};
-  colorPalette = [
-    '#FFCE00', // mama yellow (primary)
-    '#E6B800', // mama yellow-hover
-    '#FF9999', // mama blush
-    '#D4C4E0', // mama lavender-dark
-    '#22c55e', // success green
-    '#f97316', // warning orange
-    '#06b6d4', // info cyan
-    '#8b5cf6', // purple accent
-    '#ec4899', // pink accent
-    '#f59e0b', // amber
-    '#10b981', // teal
-    '#0ea5e9', // sky blue
-  ];
-  colorIndex = 0;
+  nodeColors: Record<string, string> = {
+    decision: '#60A5FA',
+    preference: '#C084FC',
+    constraint: '#FB7185',
+    lesson: '#FBBF24',
+    fact: '#2DD4BF',
+    commitment: '#FB923C',
+    observation: '#94A3B8',
+    memory: '#CBD5E1', // Legacy memories may have no stored classification.
+    registry: '#A3E635',
+  };
   edgeStyles: Record<string, EdgeStyle> = {
     supersedes: { color: '#666666', dashes: false, width: 2 },
+    mentions: { color: '#6B4C9A', dashes: false, width: 2 },
+    derived_from: { color: '#3A9E7E', dashes: false, width: 2 },
+    amends: { color: '#2563EB', dashes: [8, 4], width: 2 },
+    refines: { color: '#B8860B', dashes: false, width: 2 },
     builds_on: { color: '#B8860B', dashes: [5, 5], width: 2.5 }, // dark goldenrod
     debates: { color: '#DC143C', dashes: [5, 5], width: 2.5 }, // crimson
     synthesizes: { color: '#6B4C9A', width: 3, dashes: false }, // dark purple
@@ -164,16 +162,17 @@ export class GraphModule {
     // Map nodes to vis-network format
     const nodes = data.nodes.map((n) => ({
       id: n.id,
-      label: n.topic || String(n.id).substring(0, 20),
+      label: n.label || n.topic || String(n.id).substring(0, 20),
       title: this.createNodeTooltip(n),
       color: {
-        background: this.getTopicColor(n.topic),
-        border: this.getOutcomeBorderColor(n.outcome),
-        highlight: { background: this.getTopicColor(n.topic), border: '#fff' },
+        background: this.getNodeColor(n.kind),
+        // Only a recorded outcome draws a ring; otherwise the kind colour stays visible.
+        border: this.getOutcomeBorderColor(n.outcome, this.getNodeColor(n.kind)),
+        highlight: { background: this.getNodeColor(n.kind), border: '#fff' },
       },
       size: this.getNodeSize(connectionCounts[String(n.id)] || 0),
       font: { color: '#131313', size: 14, vadjust: -2 },
-      borderWidth: 3,
+      borderWidth: n.outcome ? 3 : 1,
       data: n,
     }));
 
@@ -210,14 +209,15 @@ export class GraphModule {
         width: 2,
       },
       physics: {
-        enabled: data.nodes.length <= PHYSICS_NODE_THRESHOLD,
+        // The initial layout always runs; the stabilized handler turns physics off afterwards.
+        enabled: true,
         barnesHut: {
           gravitationalConstant: -8000,
           centralGravity: 0.3,
           springLength: 150,
           springConstant: 0.04,
           damping: 0.09,
-          avoidOverlap: 0.5,
+          avoidOverlap: 1,
         },
         stabilization: {
           enabled: true,
@@ -284,6 +284,11 @@ export class GraphModule {
       }
     });
 
+    // A large graph may never reach vis-network's 'stabilized'; stop when the bounded iterations end.
+    this.network.on('stabilizationIterationsDone', () => {
+      this.network?.setOptions?.({ physics: { enabled: false } });
+    });
+
     this.network.on('stabilized', () => {
       const loadingEl = getElementByIdOrNull<HTMLElement>('graph-loading');
       if (loadingEl) {
@@ -315,6 +320,12 @@ export class GraphModule {
     const topics = [...topicLatest.entries()].sort((a, b) => b[1] - a[1]).map(([topic]) => topic);
     this.populateTopicFilter(topics);
     this.populateDecisionList(data.nodes);
+    this.renderLegend();
+
+    const stats = getElementByIdOrNull<HTMLElement>('graph-stats');
+    if (stats) {
+      stats.textContent = `${data.nodes.length} nodes · ${data.edges.length} edges${data.meta?.partial ? ' · partial' : ''}`;
+    }
 
     logger.info('Graph initialized with', nodes.length, 'nodes and', edges.length, 'edges');
   }
@@ -323,21 +334,86 @@ export class GraphModule {
   // Styling Utilities
   // =============================================
 
-  /**
-   * Get color for topic
-   */
-  getTopicColor(topic = ''): string {
-    if (!this.topicColors[topic]) {
-      this.topicColors[topic] = this.colorPalette[this.colorIndex % this.colorPalette.length];
-      this.colorIndex++;
+  getNodeColor(kind = 'memory'): string {
+    return this.nodeColors[kind] ?? '#CBD5E1';
+  }
+
+  /** Count the displayed data, excluding nodes hidden by filters and their edges. */
+  getLegendEntries() {
+    const visible = new Set(
+      (this.network ? this.network.body.data.nodes.get() : this.graphData.nodes)
+        .filter((node) => !node.hidden)
+        .map((node) => String(node.id))
+    );
+    const kinds = new Map<string, number>();
+    const relations = new Map<string, number>();
+    for (const node of this.graphData.nodes) {
+      if (!visible.has(String(node.id))) continue;
+      const kind = node.kind ?? 'memory';
+      kinds.set(kind, (kinds.get(kind) ?? 0) + 1);
+    }
+    for (const edge of this.graphData.edges) {
+      if (!visible.has(String(edge.from)) || !visible.has(String(edge.to))) continue;
+      const relation = edge.relationship ?? 'default';
+      relations.set(relation, (relations.get(relation) ?? 0) + 1);
     }
-    return this.topicColors[topic];
+    return {
+      nodes: [...kinds]
+        .sort(([a], [b]) => a.localeCompare(b))
+        .map(([kind, count]) => ({
+          kind,
+          count,
+          color: this.getNodeColor(kind),
+        })),
+      edges: [...relations]
+        .sort(([a], [b]) => a.localeCompare(b))
+        .map(([relationship, count]) => ({
+          relationship,
+          count,
+          ...this.getEdgeStyle(relationship),
+        })),
+    };
+  }
+
+  renderLegend(): void {
+    const container = getElementByIdOrNull<HTMLElement>('graph-legend-content');
+    if (!container) return;
+    const entries = this.getLegendEntries();
+    const section = (title: string, rows: string[]) =>
+      rows.length === 0
+        ? ''
+        : `<div><div class="text-[10px] font-semibold text-gray-600 uppercase tracking-wide mb-1.5">${title}</div>${rows.join('')}</div>`;
+    const row = (sample: string, label: string, count: number) =>
+      `<div class="flex items-center gap-2 text-xs text-gray-700 mb-1">${sample}<span class="flex-1">${escapeHtml(label)}</span><span class="tabular-nums">${count}</span></div>`;
+    container.innerHTML =
+      section(
+        'Node kinds',
+        entries.nodes.map(({ kind, count, color }) =>
+          row(
+            `<span class="w-3 h-3 rounded-full shrink-0" style="background:${color}"></span>`,
+            kind,
+            count
+          )
+        )
+      ) +
+      section(
+        'Relationships',
+        entries.edges.map(({ relationship, count, color, dashes, width }) => {
+          const dash = Array.isArray(dashes) ? dashes.join(' ') : dashes ? '5 5' : 'none';
+          return row(
+            `<svg width="24" height="10" class="shrink-0" aria-hidden="true"><line x1="0" y1="5" x2="24" y2="5" stroke="${color}" stroke-width="${width}" stroke-dasharray="${dash}" /></svg>`,
+            relationship,
+            count
+          );
+        })
+      );
+    if (entries.nodes.length === 0) container.textContent = 'No visible nodes';
   }
 
   /**
    * Get border color based on outcome
    */
-  getOutcomeBorderColor(outcome?: string): string {
+  getOutcomeBorderColor(outcome?: string, fallback = '#4a4a6a'): string {
     switch (outcome?.toLowerCase()) {
       case 'success':
         return '#22c55e';
@@ -346,7 +422,7 @@ export class GraphModule {
       case 'partial':
         return '#f59e0b';
       default:
-        return '#4a4a6a';
+        return fallback;
     }
   }
 
@@ -382,7 +458,7 @@ export class GraphModule {
     return `
       <strong>${escapeHtml(node.topic || 'Unknown')}</strong><br>
       Decision: ${escapeHtml((node.decision || '').substring(0, 100))}...<br>
-      Outcome: ${escapeHtml(node.outcome || 'PENDING')}<br>
+      ${node.outcome ? `Outcome: ${escapeHtml(node.outcome)}<br>` : ''}
       Confidence: ${Math.round((node.confidence || 0) * 100)}%
     `;
   }
@@ -570,7 +646,10 @@ export class GraphModule {
 
       const outcomeSelect = getElementByIdOrNull<HTMLSelectElement>('detail-outcome-select');
       if (outcomeSelect) {
-        outcomeSelect.value = (node.outcome || 'PENDING').toUpperCase();
+        outcomeSelect.value = node.outcome ? node.outcome.toUpperCase() : '';
+        outcomeSelect.disabled = Boolean(
+          (node.kind && node.kind !== 'memory') || (node.state && node.state !== 'current')
+        );
       }
 
       // Clear outcome status
@@ -618,9 +697,13 @@ export class GraphModule {
       );
       reasoningEl.innerHTML = renderSafeMarkdown(String(detailNode.reasoning || '-'));
 
-      // Fetch similar decisions in the background so the detail panel opens immediately.
-      logger.info('Fetching similar decisions...');
-      void this.fetchSimilarDecisions(String(node.id));
+      // Canonical graph relations are already visible as edges. The old
+      // vector-similarity endpoint only understands legacy decision ids.
+      if (node.kind) {
+        if (similarEl) similarEl.textContent = 'Related records are shown as graph edges.';
+      } else {
+        void this.fetchSimilarDecisions(String(node.id));
+      }
       logger.debug('showDetail completed successfully');
     } catch (error) {
       logger.error('Error in showDetail:', error);
@@ -732,6 +815,12 @@ export class GraphModule {
    * Save outcome for current node
    */
   async saveOutcome(): Promise<void> {
+    const current = this.graphData.nodes.find((node) => String(node.id) === this.currentNodeId);
+    if (
+      (current?.kind && current.kind !== 'memory') ||
+      (current?.state && current.state !== 'current')
+    )
+      return;
     const select = getElementByIdOrNull<HTMLSelectElement>('detail-outcome-select');
     if (!select) {
       return;
@@ -992,6 +1081,7 @@ export class GraphModule {
       });
     }
 
+    this.renderLegend();
     logger.debug('[MAMA] Filtered by topic:', topic || 'all');
   }
 
@@ -1017,7 +1107,7 @@ export class GraphModule {
       // Filter by outcome
       allNodes.forEach((node) => {
         const nodeData = this.graphData.nodes.find((n) => String(n.id) === String(node.id));
-        const nodeOutcome = (nodeData?.outcome || 'pending').toLowerCase();
+        const nodeOutcome = (nodeData?.outcome || '').toLowerCase();
         this.network.body.data.nodes.update({
           id: node.id,
           hidden: nodeOutcome !== outcome.toLowerCase(),
@@ -1025,6 +1115,7 @@ export class GraphModule {
       });
     }
 
+    this.renderLegend();
     logger.debug('[MAMA] Filtered by outcome:', outcome || 'all');
   }
 
@@ -1065,6 +1156,7 @@ export class GraphModule {
       countEl.style.display = 'none';
     }
 
+    this.renderLegend();
     logger.debug('[MAMA] All filters cleared');
   }
 

package/public/viewer/src/modules/memory.ts

@@ -16,7 +16,6 @@ import { escapeHtml, debounce, showToast, getElementByIdOrNull } from '../utils/
 import { formatRelativeTime, truncateText } from '../utils/format.js';
 import { API, type MemorySearchItem } from '../utils/api.js';
 import { DebugLogger } from '../utils/debug-logger.js';
-import { reportPageContext } from '../utils/ui-commands.js';
 
 const logger = new DebugLogger('Memory');
 
@@ -122,17 +121,6 @@ export class MemoryModule {
       this.searchData = data.results || [];
       this.renderResults(this.searchData, query);
       this.setStatus(`Found ${this.searchData.length} decision(s)`, '');
-      reportPageContext('memory', {
-        pageType: 'memory-search',
-        query,
-        resultCount: this.searchData.length,
-        results: this.searchData.slice(0, 10).map((item) => ({
-          id: item.id ?? null,
-          topic: item.topic ?? null,
-          outcome: item.outcome ?? null,
-          similarity: item.similarity ?? null,
-        })),
-      });
     } catch (error) {
       const message = error instanceof Error ? error.message : String(error);
       logger.error('Search error:', message);
@@ -166,17 +154,6 @@ export class MemoryModule {
    */
   async showRelatedForMessage(message: string): Promise<void> {
     const results = await this.searchRelated(message);
-    reportPageContext('memory', {
-      pageType: 'memory-related',
-      query: message,
-      resultCount: results.length,
-      results: results.slice(0, 10).map((item) => ({
-        id: item.id ?? null,
-        topic: item.topic ?? null,
-        outcome: item.outcome ?? null,
-        similarity: item.similarity ?? null,
-      })),
-    });
 
     if (results.length > 0) {
       this.searchData = results;
@@ -223,7 +200,9 @@ export class MemoryModule {
 
     const html = results
       .map((item, idx) => {
-        const rawOutcome = String(item.outcome || 'PENDING');
+        // Owner-agent memories (facts, lessons, work judgments) carry no outcome; only a
+        // recorded outcome is shown, never an implied PENDING.
+        const rawOutcome = item.outcome ? String(item.outcome) : '';
         const normalizedOutcome = rawOutcome.toLowerCase();
         const outcomeClass = ['success', 'failed', 'partial', 'pending'].includes(normalizedOutcome)
           ? normalizedOutcome
@@ -236,7 +215,7 @@ export class MemoryModule {
           </div>
           <div class="memory-card-decision">${escapeHtml(truncateText(item.decision, 150))}</div>
           <div class="memory-card-meta">
-            <span class="memory-card-outcome ${outcomeClass}">${escapeHtml(rawOutcome)}</span>
+            ${rawOutcome ? `<span class="memory-card-outcome ${outcomeClass}">${escapeHtml(rawOutcome)}</span>` : ''}
             <span>${formatRelativeTime(item.created_at)}</span>
           </div>
           <div class="memory-card-reasoning">${escapeHtml(item.reasoning || 'No reasoning provided')}</div>
@@ -278,12 +257,6 @@ export class MemoryModule {
       </div>
     `;
     this.setStatus('', '');
-    reportPageContext('memory', {
-      pageType: 'memory-search',
-      query: '',
-      resultCount: 0,
-      results: [],
-    });
     // Reinitialize Lucide icons for dynamic content
     if (typeof lucide !== 'undefined' && typeof window.lucideConfig !== 'undefined') {
       lucide.createIcons(window.lucideConfig);

package/public/viewer/src/modules/wiki.ts

@@ -1,7 +1,6 @@
 import { API, type WikiTreeNode, type WikiPageResponse } from '../utils/api.js';
 import { DebugLogger } from '../utils/debug-logger.js';
 import { createResizeHandle } from '../utils/dom.js';
-import { reportPageContext } from '../utils/ui-commands.js';
 
 declare const marked: { parse(md: string): string };
 declare const DOMPurify: { sanitize(html: string): string };
@@ -101,32 +100,6 @@ export class WikiModule {
     this.treeLoadPromise = this.loadTree();
   }
 
-  private publishListContext(): void {
-    reportPageContext('wiki', {
-      pageType: 'wiki-list',
-      path: null,
-      activePath: this.currentPath,
-    });
-  }
-
-  private publishPageContext(page: WikiPageResponse): void {
-    const title =
-      String(page.frontmatter.title ?? '').trim() ||
-      page.path.split('/').pop()?.replace(/\.md$/, '') ||
-      page.path;
-    reportPageContext(
-      'wiki',
-      {
-        pageType: 'wiki-page',
-        path: page.path,
-        title,
-        frontmatter: page.frontmatter,
-        content_preview: page.raw.slice(0, 400),
-      },
-      { type: 'wiki-page', id: page.path }
-    );
-  }
-
   private async loadTree(): Promise<void> {
     if (!this.container) return;
     try {
@@ -212,8 +185,6 @@ export class WikiModule {
       const indexNode = tree.find((n) => n.name === 'index.md');
       if (!mobile && indexNode) {
         this.openPage(indexNode.path);
-      } else {
-        this.publishListContext();
       }
     }
   }
@@ -235,7 +206,6 @@ export class WikiModule {
     try {
       const page = await API.getWikiPage(path);
       this.renderPageView(pageEl, page);
-      this.publishPageContext(page);
     } catch {
       pageEl.innerHTML = `<div style="color:#D94F4F;padding:20px">Failed to load ${path}</div>`;
     }
@@ -260,7 +230,6 @@ export class WikiModule {
     const pageEl = document.getElementById('wiki-page');
     if (treeEl) treeEl.style.display = '';
     if (pageEl) pageEl.style.display = 'none';
-    this.publishListContext();
   }
 
   private handleResize(): void {
@@ -453,17 +422,6 @@ export class WikiModule {
     }
     if (path) {
       await this.openPage(path);
-      return;
-    }
-    if (this.currentPath) {
-      try {
-        const page = await API.getWikiPage(this.currentPath);
-        this.publishPageContext(page);
-        return;
-      } catch {
-        /* fall through to list context */
-      }
     }
-    this.publishListContext();
   }
 }

package/public/viewer/src/types/global.d.ts

@@ -79,7 +79,7 @@ declare global {
 
   interface VisNetwork {
     on(
-      event: 'click' | 'stabilized',
+      event: 'click' | 'stabilized' | 'stabilizationIterationsDone',
       handler: (params: { nodes: Array<string | number> }) => void
     ): void;
     on(event: 'hoverNode' | 'blurNode', handler: (params: { node: string | number }) => void): void;

package/public/viewer/src/utils/api.ts

@@ -20,6 +20,9 @@ export interface ApiRequestOptions {
 export interface GraphNode {
   id: string | number;
   topic?: string;
+  kind?: string;
+  state?: string;
+  label?: string;
   decision_preview?: string;
   decision?: string;
   reasoning?: string;
@@ -321,22 +324,6 @@ export interface CronJobsResponse {
   [key: string]: unknown;
 }
 
-export interface SessionInfo {
-  id: string;
-  isAlive?: boolean;
-  [key: string]: unknown;
-}
-
-export interface SessionsResponse {
-  sessions: SessionInfo[];
-}
-
-export type LastActiveSessionResponse = SessionInfo;
-
-export interface CreateSessionResponse {
-  sessionId: string;
-}
-
 export interface CronLogEntry {
   ts?: string;
   message?: string;
@@ -532,30 +519,28 @@ export class API {
   /**
    * Parse JSON response safely with explicit error context.
    */
-  static async parseJsonResponse<T = unknown>(response: Response, context = '요청'): Promise<T> {
+  static async parseJsonResponse<T = unknown>(response: Response, context = 'request'): Promise<T> {
     const contentType = response.headers.get('content-type') || '';
     const text = await response.text();
 
     if (!contentType.includes('application/json')) {
       const snippet = text.slice(0, 80).replace(/\n/g, ' ');
       throw new Error(
-        `${context}에서 JSON 응답이 아닙니다. content-type: ${
-          contentType || '없음'
-        }, body: ${snippet}`
+        `${context}: not a JSON response. content-type: ${contentType || 'none'}, body: ${snippet}`
       );
     }
 
     try {
       if (!text) {
         throw new Error(
-          `${context} 응답 본문이 비어 있습니다. status=${response.status}, url=${response.url}`
+          `${context}: empty response body. status=${response.status}, url=${response.url}`
         );
       }
       return JSON.parse(text) as T;
     } catch (error) {
       const snippet = text.slice(0, 120).replace(/\n/g, ' ');
       const cause = error instanceof Error ? error.message : String(error);
-      throw new Error(`${context} 응답 JSON 파싱 실패: ${cause} (샘플: ${snippet})`);
+      throw new Error(`${context}: JSON parse failed: ${cause} (sample: ${snippet})`);
     }
   }
 
@@ -755,37 +740,6 @@ export class API {
     return this.post<JsonRecord, MamaDecisionPayload>('/api/mama/save', data);
   }
 
-  // =============================================
-  // Session API
-  // =============================================
-
-  /**
-   * Create a new chat session
-   * @param {string} projectDir - Project directory
-   * @returns {Promise<Object>} Session data
-   */
-  static async createSession(projectDir = '.'): Promise<CreateSessionResponse> {
-    return this.post<CreateSessionResponse, { projectDir: string }>('/api/sessions', {
-      projectDir,
-    });
-  }
-
-  /**
-   * Get the last active session
-   * @returns {Promise<Object>} Last active session
-   */
-  static async getLastActiveSession(): Promise<LastActiveSessionResponse> {
-    return this.get<LastActiveSessionResponse>('/api/sessions/last-active');
-  }
-
-  /**
-   * Get all active sessions
-   * @returns {Promise<Object>} Sessions list
-   */
-  static async getSessions(): Promise<SessionsResponse> {
-    return this.get<SessionsResponse>('/api/sessions');
-  }
-
   // =============================================
   // Cron API
   // =============================================
@@ -1005,36 +959,6 @@ export class API {
     );
   }
 
-  // =============================================
-  // UI Command API (SmartStore pattern)
-  // =============================================
-
-  static async getUICommands(): Promise<{
-    commands: Array<{ id?: string; type: string; payload: Record<string, unknown> }>;
-  }> {
-    return this.get('/api/ui/commands');
-  }
-
-  static async ackUICommands(commandIds: string[]): Promise<JsonRecord> {
-    return this.post('/api/ui/commands/ack', {
-      command_ids: commandIds,
-    });
-  }
-
-  static async pushPageContext(
-    route: string,
-    data: Record<string, unknown>,
-    selectedItem?: { type: string; id: string },
-    channelId?: string
-  ): Promise<JsonRecord> {
-    return this.post('/api/ui/page-context', {
-      currentRoute: route,
-      pageData: data,
-      ...(selectedItem ? { selectedItem } : {}),
-      ...(channelId ? { channelId } : {}),
-    });
-  }
-
   // =============================================
   // Metrics / Health API
   // =============================================