@unson/brainbase-mcp 0.10.1 → 0.10.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unson/brainbase-mcp",
-  "version": "0.10.1",
+  "version": "0.10.3",
   "description": "Local-first Brainbase judgment OS that lets supported AI agents reuse a user's approved goals, priorities, decisions, and judgment criteria.",
   "type": "module",
   "license": "MIT",
@@ -336,5 +336,5 @@
   "engines": {
     "node": ">=20"
   },
-  "gitHead": "3fab56acebc9266f2bd256cc1795a3d7f550c311"
+  "gitHead": "8abcea403a82666c8c4616d4023fb28a10af761a"
 }

package/ui/graph-projects-view.js

@@ -54,7 +54,12 @@ import {
   graphHostEmptyNotice,
 } from './graph-view-shared.js';
 import { graphOwnShareSource, ownProjectDetail, ownShareSection, ownShareStateNotice } from './graph-own-share.js';
-import { createProjectKnowledgeWorkspace, normalizeProjectContext } from './project-workspace.js';
+import {
+  createProjectKnowledgeWorkspace,
+  normalizeProjectContext,
+  renderProjectContext,
+  renderProjectKnowledgeSkeleton,
+} from './project-workspace.js';
 import { mountProjectGraph as defaultMountProjectGraph } from './project-graph.js';
 import {
   workspaceActions,
@@ -148,6 +153,19 @@ function failureText(error) {
   return textOrNull(error instanceof Error ? error.message : typeof error === 'string' ? error : null) ?? '理由不明';
 }
 
+/**
+ * A host may know the selected project's identity before its Graph list is
+ * available.  Keep this boundary deliberately small: the early shell only
+ * accepts an id and display name, and never treats a host summary as Graph
+ * data such as goal, status or participant counts.
+ */
+function normalizeProjectSummary(value) {
+  if (!isRecord(value)) return null;
+  const id = textOrNull(value.id ?? value.code);
+  if (!id) return null;
+  return { id, name: textOrNull(value.name) ?? id };
+}
+
 /**
  * Mounts 「プロジェクトと関係者」.
  *
@@ -198,9 +216,14 @@ function failureText(error) {
  *   labelled 「引き継いだ自分の分（組織には未反映）」 unless `label` says otherwise.  They are never
  *   added to the ledger, the metrics or the rail, and a failed read shows only in that section.
  *   Without it nothing of the kind is drawn or read.
- * @param {(projectId: string) => Promise<object>} [options.loadProjectContext]
- *   Optional read-only supplementary sections (tasks/knowledge).  A failed
- *   context read is kept separate from the Graph detail read.
+ * @param {(projectId: string, options?: { onProgress?: (snapshot: object) => void }) => Promise<object>} [options.loadProjectContext]
+ *   Optional read-only supplementary sections (tasks/knowledge). The host may
+ *   call `onProgress` with a complete `{ sections: [...] }` snapshot as each
+ *   section resolves; a failed context read is kept separate from the Graph
+ *   detail read.
+ * @param {Array<{ id: string, name?: string }> | (() => Array<{ id: string, name?: string }>)} [options.projectSummaries]
+ *   Optional host-known project identities.  These are used only to draw the
+ *   selected project's early loading shell before the Graph list is read.
  * @param {(container: Element, options: object) => { destroy?: Function }} [options.mountProjectGraph]
  *   Host-injected Sigma.js graph mount. When omitted, the shared browser
  *   entry is used. The workspace keeps an accessible relation list when
@@ -232,6 +255,7 @@ export function createGraphProjectsView({
   onSelect,
   ownShare,
   loadProjectContext,
+  projectSummaries,
   mountProjectGraph,
 } = {}) {
   if (!root) throw new TypeError('root is required');
@@ -267,6 +291,7 @@ export function createGraphProjectsView({
   let knowledgeWorkspace = null;
   let contextRequest = 0;
   let detailRequest = 0;
+  let hostListRequest = 0;
   let viewDestroyed = false;
 
   const correction = createGraphCorrection({
@@ -289,6 +314,55 @@ export function createGraphProjectsView({
     return state.list.state === 'ok' ? state.list.payload.projects.find((project) => project.id === id) ?? null : null;
   }
 
+  function projectSummaryFor(id) {
+    const target = textOrNull(id);
+    if (!target) return null;
+    let summaries = projectSummaries;
+    try {
+      if (typeof summaries === 'function') summaries = summaries();
+    } catch {
+      summaries = null;
+    }
+    if (Array.isArray(summaries)) {
+      const summary = summaries.map(normalizeProjectSummary).find((item) => item?.id === target);
+      if (summary) return summary;
+    }
+    const listed = listItem(target);
+    return listed ? { id: listed.id, name: listed.name } : { id: target, name: target };
+  }
+
+  function renderProjectKnowledgeLoading(id, readState, { onRetry } = {}) {
+    const target = textOrNull(id);
+    if (!target) return null;
+    const project = projectSummaryFor(target);
+    const loading = makeElement(doc, 'section', {
+      className: 'bb-pkw bb-pkw-loading',
+      attrs: {
+        'aria-label': 'プロジェクトの知識',
+        'data-project-id': target,
+      },
+    });
+    loading.append(makeElement(doc, 'div', { className: 'bb-pkw-kicker', text: 'プロジェクトの記録' }));
+    const header = makeElement(doc, 'header', { className: 'bb-pkw-header' });
+    header.append(
+      makeElement(doc, 'h2', { text: project.name }),
+      makeElement(doc, 'p', { className: 'bb-pkw-lead', text: '目的・関係・判断の根拠を、実際に記録された情報からたどれます。' }),
+    );
+    loading.append(header);
+    const notice = graphStateNotice(doc, readState, {
+      onRetry,
+      loadingText: 'プロジェクトの記録を読み込んでいます。',
+    });
+    if (notice) loading.append(notice);
+    if (readState?.state === 'loading') {
+      loading.append(renderProjectKnowledgeSkeleton(doc, { context: state.context?.projectId === target ? state.context : null }));
+    } else if (state.context?.projectId === target) {
+      const contextBlock = renderProjectContext(doc, state.context);
+      if (contextBlock) loading.append(contextBlock);
+    }
+    return loading;
+  }
+
   function openCorrection(at, open) {
     state.panelAt = at;
     open();
@@ -345,16 +419,27 @@ export function createGraphProjectsView({
     const request = ++contextRequest;
     state.context = normalizeProjectContext(id, { state: 'loading' });
     controller.render();
+    const applyContext = (snapshot) => {
+      const normalized = normalizeProjectContext(id, snapshot);
+      if (viewDestroyed || request !== contextRequest || state.selectedId !== id) return false;
+      state.context = normalized;
+      // Context progress must not rebuild the workspace: rebuilding destroys
+      // Sigma's viewport and resets the user's active tab/selection. Detail
+      // loading still uses the shell render so the project name is immediate.
+      if (knowledgeWorkspace && state.detail?.id === id && state.detail.state === 'ok') {
+        knowledgeWorkspace.setContext?.(normalized);
+      } else {
+        controller.render();
+      }
+      return true;
+    };
     let result;
     try {
-      result = await loadProjectContext(id);
+      result = await loadProjectContext(id, { onProgress: (snapshot) => { applyContext(snapshot); } });
     } catch (error) {
       result = { state: 'failed', message: `補足情報を読み取れませんでした（${failureText(error)}）。` };
     }
-    const normalized = normalizeProjectContext(id, result);
-    if (viewDestroyed || request !== contextRequest || state.selectedId !== id) return state.context;
-    state.context = normalized;
-    controller.render();
+    applyContext(result);
     return state.context;
   }
 
@@ -456,6 +541,9 @@ export function createGraphProjectsView({
     const stateNotice = graphStateNotice(doc, state.list, { onRetry: () => controller.load(), loadingText: 'プロジェクトを読み込んでいます。' });
     if (stateNotice) {
       children.push(stateNotice);
+      if (state.selectedId) {
+        children.push(renderProjectKnowledgeLoading(state.selectedId, state.list, { onRetry: () => controller.load() }));
+      }
       return children;
     }
     const { payload } = state.list;
@@ -486,6 +574,10 @@ export function createGraphProjectsView({
         onTabChange: setKnowledgeTabChrome,
       });
       children.push(knowledgeWorkspace.element);
+    } else if (state.selectedId) {
+      children.push(renderProjectKnowledgeLoading(state.selectedId, state.detail ?? { state: 'loading' }, {
+        onRetry: () => controller.loadDetail(state.selectedId),
+      }));
     }
 
     if (payload.projects.length === 0) {
@@ -623,7 +715,10 @@ export function createGraphProjectsView({
     const project = loaded?.project ?? listItem(state.selectedId) ?? { id: state.selectedId, name: state.selectedId };
     const children = [workspaceRailHead(doc, { kicker: 'プロジェクト', title: project.name, sub: project.id })];
     if (!loaded) {
-      children.push(graphStateNotice(doc, detail?.id === state.selectedId ? detail : { state: 'loading' }, {
+      const readState = detail?.id === state.selectedId
+        ? detail
+        : state.list.state === 'ok' ? { state: 'loading' } : state.list;
+      children.push(graphStateNotice(doc, readState, {
         onRetry: () => controller.loadDetail(state.selectedId),
         loadingText: 'このプロジェクトの関係者を読み込んでいます。',
       }));
@@ -692,13 +787,16 @@ export function createGraphProjectsView({
 
   /** Reads the host's project list (see `load`). */
   async function loadHostList({ keep = false } = {}) {
+    const request = ++hostListRequest;
+    if (viewDestroyed) return state.list;
     if (!(keep && state.list.state === 'ok')) {
       state.list = { state: 'loading' };
       controller.render();
     }
-    state.list = normalizeProjectList(await client.read('/projects'));
+    const result = await client.read('/projects');
+    if (viewDestroyed || request !== hostListRequest) return state.list;
+    state.list = normalizeProjectList(result);
     if (state.list.state !== 'ok') {
-      if (!keep) state.selectedId = null;
       controller.render();
       return state.list;
     }
@@ -711,16 +809,21 @@ export function createGraphProjectsView({
       contextRequest += 1;
       state.selectedId = projects[0]?.id ?? null;
       if (state.selectedId) {
+        if (viewDestroyed || request !== hostListRequest) return state.list;
         const reading = controller.loadDetail(state.selectedId);
         notifySelect(state.selectedId);
         await reading;
+        if (viewDestroyed || request !== hostListRequest) return state.list;
         return state.list;
       }
     } else if (state.detail?.id !== state.selectedId) {
       // The project the host asked for is listed; read it for the rail.
+      if (viewDestroyed || request !== hostListRequest) return state.list;
       await controller.loadDetail(state.selectedId);
+      if (viewDestroyed || request !== hostListRequest) return state.list;
       return state.list;
     }
+    if (viewDestroyed || request !== hostListRequest) return state.list;
     controller.render();
     return state.list;
   }
@@ -744,6 +847,7 @@ export function createGraphProjectsView({
     destroy() {
       if (viewDestroyed) return;
       viewDestroyed = true;
+      hostListRequest += 1;
       detailRequest += 1;
       contextRequest += 1;
       knowledgeWorkspace?.destroy();

package/ui/project-workspace.css

@@ -267,6 +267,44 @@
   padding-top: var(--bb-space-3);
 }
 
+.bb-pkw-skeleton-section {
+  min-height: 118px;
+}
+
+.bb-pkw-skeleton-stack {
+  display: grid;
+  gap: var(--bb-space-2);
+  width: min(100%, 360px);
+}
+
+.bb-pkw-skeleton-bar {
+  display: block;
+  width: 100%;
+  height: 10px;
+  border-radius: 999px;
+  background: color-mix(in srgb, var(--bb-color-border-strong) 65%, var(--bb-color-panel));
+  animation: bb-pkw-skeleton-pulse 1.35s ease-in-out infinite;
+}
+
+.bb-pkw-skeleton-bar-1 { width: 92%; }
+.bb-pkw-skeleton-bar-2 { width: 68%; }
+.bb-pkw-skeleton-bar-3 { width: 82%; }
+
+.bb-pkw-context-group-loading {
+  min-height: 72px;
+}
+
+@keyframes bb-pkw-skeleton-pulse {
+  0%, 100% { opacity: .48; }
+  50% { opacity: 1; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .bb-pkw-skeleton-bar {
+    animation: none;
+  }
+}
+
 .bb-pkw-context-heading,
 .bb-pkw-graph-intro,
 .bb-pkw-selected-head,

package/ui/project-workspace.js

@@ -95,7 +95,18 @@ export function normalizeProjectContext(projectId, result) {
   if (result?.state === 'failed' || result?.state === 'error') {
     return { projectId: id, state: 'failed', message: firstText(result.message, result.reason) ?? '補足情報を読み取れませんでした。', sections: [] };
   }
-  if (result?.state === 'loading') return { projectId: id, state: 'loading', sections: [] };
+  if (result?.state === 'loading') {
+    const partial = result?.payload && isRecord(result.payload) ? result.payload : result;
+    const rawSections = Array.isArray(partial.sections) ? partial.sections : [];
+    const normalized = {
+      projectId: id,
+      state: 'loading',
+      sections: rawSections.map(normalizeContextSection).filter(Boolean),
+    };
+    const message = firstText(result.message, result.reason);
+    if (message) normalized.message = message;
+    return normalized;
+  }
   if (result?.state === 'unavailable') {
     return { projectId: id, state: 'unavailable', message: firstText(result.message, result.reason) ?? '補足情報は接続されていません。', sections: [] };
   }
@@ -107,7 +118,7 @@ export function normalizeProjectContext(projectId, result) {
   if (sections.length === 0 && payload.sections.length > 0) {
     return { projectId: id, state: 'unavailable', message: '補足情報の形式を確認できません。', sections: [] };
   }
-  return { projectId: id, state: 'ok', sections };
+  return { projectId: id, state: sections.some((section) => section.state === 'loading') ? 'loading' : 'ok', sections };
 }
 
 function addEntity(map, candidate) {
@@ -292,30 +303,66 @@ function renderEntityRelations(doc, edges, direction, entity, asOf, onSelect) {
   return list.children.length > 0 ? list : null;
 }
 
-function renderContext(doc, context) {
+function skeletonBars(doc, count = 3) {
+  const stack = makeElement(doc, 'div', { className: 'bb-pkw-skeleton-stack', attrs: { 'aria-hidden': 'true' } });
+  for (let index = 0; index < count; index += 1) {
+    stack.append(makeElement(doc, 'span', {
+      className: `bb-pkw-skeleton-bar bb-pkw-skeleton-bar-${(index % 3) + 1}`,
+      attrs: { 'aria-hidden': 'true' },
+    }));
+  }
+  return stack;
+}
+
+function contextSectionSkeleton(doc, { title = null, message = null } = {}) {
+  const group = makeElement(doc, 'section', {
+    className: 'bb-pkw-context-group bb-pkw-context-group-loading',
+    attrs: { 'aria-label': title ?? '補足情報', 'aria-busy': 'true' },
+  });
+  if (title) group.append(makeElement(doc, 'h4', { text: title }));
+  if (message) group.append(makeElement(doc, 'p', { className: 'bb-pkw-muted', text: message }));
+  group.append(skeletonBars(doc));
+  return group;
+}
+
+/** Renders supplementary context while preserving each section's own state. */
+export function renderProjectContext(doc, context) {
   if (!context) return null;
-  const section = makeElement(doc, 'section', { className: 'bb-pkw-section bb-pkw-context', attrs: { 'aria-label': '補足情報' } });
+  const sections = Array.isArray(context.sections) ? context.sections : [];
+  const section = makeElement(doc, 'section', {
+    className: 'bb-pkw-section bb-pkw-context',
+    attrs: { 'aria-label': '補足情報' },
+  });
   section.append(makeElement(doc, 'h3', { text: '補足情報' }));
-  if (context.state === 'loading') {
-    section.append(workspaceNotice(doc, { label: '読み込み中', text: 'タスクや知識の補足情報を読み込んでいます。', tone: 'info', role: 'status' }));
-    return section;
-  }
   if (context.state !== 'ok') {
-    section.append(workspaceNotice(doc, { label: context.state === 'failed' ? '読み取り失敗' : '未接続', text: context.message ?? '補足情報を確認できません。', tone: context.state === 'failed' ? 'danger' : 'warning' }));
-    return section;
+    if (context.state === 'loading') {
+      section.append(workspaceNotice(doc, { label: '読み込み中', text: context.message ?? '補足情報を読み込んでいます。', tone: 'info', role: 'status' }));
+      if (sections.length === 0) section.append(contextSectionSkeleton(doc));
+    } else {
+      section.append(workspaceNotice(doc, { label: context.state === 'failed' ? '読み取り失敗' : '未接続', text: context.message ?? '補足情報を確認できません。', tone: context.state === 'failed' ? 'danger' : 'warning' }));
+    }
   }
-  if (context.sections.length === 0) {
+  if (context.state === 'ok' && sections.length === 0) {
     section.append(makeElement(doc, 'p', { className: 'bb-pkw-muted', text: '補足情報のセクションはありません。' }));
     return section;
   }
-  for (const item of context.sections) {
-    const group = makeElement(doc, 'section', { className: 'bb-pkw-context-group', attrs: { 'aria-label': item.title } });
+  for (const item of sections) {
+    const group = makeElement(doc, 'section', {
+      className: `bb-pkw-context-group${item.state === 'loading' ? ' bb-pkw-context-group-loading' : ''}`,
+      attrs: { 'aria-label': item.title, ...(item.state === 'loading' ? { 'aria-busy': 'true' } : {}) },
+    });
     const heading = makeElement(doc, 'div', { className: 'bb-pkw-context-heading' });
     heading.append(makeElement(doc, 'h4', { text: item.title }), badge(doc, item.state === 'ok' ? '利用可能' : item.state === 'loading' ? '読み込み中' : item.state === 'failed' ? '読み取り失敗' : '未接続', item.state === 'ok' ? 'success' : item.state === 'failed' ? 'danger' : 'muted'));
     group.append(heading);
-    if (item.message) group.append(makeElement(doc, 'p', { className: 'bb-pkw-muted', text: item.message }));
+    if (item.message && !['failed', 'unavailable'].includes(item.state)) group.append(makeElement(doc, 'p', { className: 'bb-pkw-muted', text: item.message }));
     if (item.asOf) group.append(makeElement(doc, 'small', { className: 'bb-pkw-muted', text: `読み取った時点: ${formatDateTime(item.asOf)}` }));
-    if (item.items.length > 0) {
+    if (item.state === 'loading') {
+      group.append(skeletonBars(doc));
+    } else if (item.state === 'failed') {
+      group.append(workspaceNotice(doc, { label: '読み取り失敗', text: item.message ?? 'このセクションを読み取れませんでした。', tone: 'danger', role: 'alert' }));
+    } else if (item.state === 'unavailable') {
+      group.append(workspaceNotice(doc, { label: '未接続', text: item.message ?? 'このセクションは接続されていません。', tone: 'warning' }));
+    } else if (item.items.length > 0) {
       const list = makeElement(doc, 'ul', { className: 'bb-pkw-context-list' });
       for (const entry of item.items) {
         const row = makeElement(doc, 'li');
@@ -334,7 +381,30 @@ function renderContext(doc, context) {
   return section;
 }
 
-function renderOverview(doc, detail, context, edges, entities, onSelect) {
+/** Structural shell used while the Graph detail is loading; it contains no inferred values. */
+export function renderProjectKnowledgeSkeleton(doc, { context = null } = {}) {
+  const panel = makeElement(doc, 'div', {
+    className: 'bb-pkw-panel bb-pkw-overview bb-pkw-overview-loading',
+    attrs: { 'aria-label': '概要' },
+  });
+  const columns = makeElement(doc, 'div', { className: 'bb-pkw-columns' });
+  for (const title of ['目的と現在地', '関係者と役割']) {
+    const item = makeElement(doc, 'section', { className: 'bb-pkw-section bb-pkw-skeleton-section', attrs: { 'aria-label': title, 'aria-busy': 'true' } });
+    item.append(makeElement(doc, 'h3', { text: title }), skeletonBars(doc));
+    columns.append(item);
+  }
+  panel.append(columns);
+  for (const title of ['記録された判断', '関連する情報']) {
+    const item = makeElement(doc, 'section', { className: 'bb-pkw-section bb-pkw-skeleton-section', attrs: { 'aria-label': title, 'aria-busy': 'true' } });
+    item.append(makeElement(doc, 'h3', { text: title }), skeletonBars(doc, 2));
+    panel.append(item);
+  }
+  const contextBlock = renderProjectContext(doc, context ?? { state: 'loading', sections: [] });
+  if (contextBlock) panel.append(contextBlock);
+  return panel;
+}
+
+function renderOverview(doc, detail, context, edges, entities, onSelect, onContext) {
   const payload = projectDetailPayload(detail);
   const project = payload?.project;
   const panel = makeElement(doc, 'div', { className: 'bb-pkw-panel bb-pkw-overview', attrs: { role: 'tabpanel', 'aria-label': '概要' } });
@@ -423,8 +493,11 @@ function renderOverview(doc, detail, context, edges, entities, onSelect) {
     missing.append(list);
     panel.append(missing);
   }
-  const contextBlock = renderContext(doc, context);
-  if (contextBlock) panel.append(contextBlock);
+  const contextBlock = renderProjectContext(doc, context);
+  if (contextBlock) {
+    panel.append(contextBlock);
+    if (typeof onContext === 'function') onContext(contextBlock);
+  }
   return panel;
 }
 
@@ -463,10 +536,13 @@ export function createProjectKnowledgeWorkspace({
   let entityReadRequest = 0;
   let graphSearch = '';
   let graphType = '';
+  let currentContext = context;
   // Keep direct references as well as the DOM lookup.  The local test harness
   // intentionally has no querySelector implementation, and a host can replace
   // the panel while a detail read is still in flight.
   let selectedPanel = null;
+  let overviewPanel = null;
+  let contextBlock = null;
 
   const root = makeElement(doc, 'section', { className: 'bb-pkw', attrs: { 'data-contract-version': PROJECT_WORKSPACE_CONTRACT_VERSION, 'aria-label': 'プロジェクトの知識' } });
   const body = makeElement(doc, 'div', { className: 'bb-pkw-body' });
@@ -698,15 +774,42 @@ export function createProjectKnowledgeWorkspace({
     graphHandle = null;
   }
 
+  function replaceContextBlock(nextContext) {
+    currentContext = nextContext;
+    if (destroyed) return;
+    const nextBlock = renderProjectContext(doc, currentContext);
+    if (!nextBlock) {
+      if (contextBlock?.parentNode?.removeChild) contextBlock.parentNode.removeChild(contextBlock);
+      contextBlock = null;
+      return;
+    }
+    if (contextBlock?.parentNode && typeof contextBlock.parentNode.replaceChild === 'function') {
+      contextBlock.parentNode.replaceChild(nextBlock, contextBlock);
+      contextBlock = nextBlock;
+      return;
+    }
+    if (contextBlock?.replaceWith) {
+      contextBlock.replaceWith(nextBlock);
+      contextBlock = nextBlock;
+      return;
+    }
+    if (overviewPanel && !contextBlock) {
+      overviewPanel.append(nextBlock);
+      contextBlock = nextBlock;
+    }
+  }
+
   function render() {
     if (destroyed) return;
     if (typeof onTabChange === 'function') onTabChange(activeTab);
     teardownGraph();
     tabs.replaceChildren(tabButton('概要', 'overview'), tabButton('情報を探す', 'graph'));
     panels.replaceChildren();
-    const overview = renderOverview(doc, payload, context, overviewEdges, overviewEntities, selectAndExplore);
+    contextBlock = null;
+    const overview = renderOverview(doc, payload, currentContext, overviewEdges, overviewEntities, selectAndExplore, (node) => { contextBlock = node; });
     overview.id = 'bb-pkw-panel-overview';
     overview.hidden = activeTab !== 'overview';
+    overviewPanel = overview;
     panels.append(overview);
     const graph = renderGraphPanel();
     graph.hidden = activeTab !== 'graph';
@@ -721,7 +824,7 @@ export function createProjectKnowledgeWorkspace({
   }
 
   render();
-  return Object.freeze({ element: root, destroy, select, setTab });
+  return Object.freeze({ element: root, destroy, select, setTab, setContext: replaceContextBlock });
 }
 
 export default createProjectKnowledgeWorkspace;