fix(node-ui): clarify context graph entity labels (#605)

Co-authored-by: Jurij Skornik <[email protected]>

Author: Jurij89

packages/node-ui/src/ui/hooks/useMemoryEntities.ts

@@ -48,6 +48,13 @@ export interface MemoryData {
 }
 
 const RDF_TYPE = 'http://www.w3.org/1999/02/22-rdf-syntax-ns#type';
+const NAME_PREDS = [
+  'http://schema.org/name',
+  'http://www.w3.org/2000/01/rdf-schema#label',
+  'http://purl.org/dc/terms/title',
+  'http://purl.org/dc/elements/1.1/title',
+  'http://xmlns.com/foaf/0.1/name',
+];
 
 function bv(v: unknown): string | undefined {
   if (v == null) return undefined;
@@ -75,6 +82,56 @@ function shortPredicate(uri: string): string {
   return s.replace(/([a-z])([A-Z])/g, '$1 $2').replace(/_/g, ' ');
 }
 
+function uriTail(uri: string): string {
+  const hash = uri.lastIndexOf('#');
+  const slash = uri.lastIndexOf('/');
+  const colon = uri.lastIndexOf(':');
+  const cut = Math.max(hash, slash, colon);
+  const raw = cut >= 0 ? uri.slice(cut + 1) : uri;
+  try {
+    return decodeURIComponent(raw);
+  } catch {
+    return raw;
+  }
+}
+
+function readableTail(uri: string): string {
+  const tail = uriTail(uri).trim();
+  if (!tail) return '';
+  const shortened = /^[0-9a-f-]{16,}$/i.test(tail) ? tail.replace(/-/g, '').slice(0, 12) : tail;
+  return shortened.replace(/[_-]+/g, ' ').trim();
+}
+
+function isRawExtractionLabel(label: string, uri: string): boolean {
+  return label === uri && /^urn:dkg:extraction:[^\s]+$/i.test(uri);
+}
+
+function readableFallbackLabel(entity: MemoryEntity): string {
+  const tail = readableTail(entity.uri);
+  const type = entity.types
+    .map(shortLabel)
+    .find(t => t && t !== 'Thing' && t !== 'Entity');
+  if (/^urn:dkg:extraction:[^\s]+$/i.test(entity.uri)) {
+    return tail ? `Extraction ${tail}` : 'Extraction';
+  }
+  if (type) return tail && tail !== type ? `${type} ${tail}` : type;
+  return tail || shortLabel(entity.uri);
+}
+
+function deriveEntityLabel(entity: MemoryEntity): string {
+  for (const pred of NAME_PREDS) {
+    const vals = entity.properties.get(pred);
+    const name = vals?.find(v => v.trim().length > 0);
+    if (name) return name;
+  }
+
+  if (entity.label && !isRawExtractionLabel(entity.label, entity.uri)) {
+    return entity.label;
+  }
+
+  return readableFallbackLabel(entity);
+}
+
 // All three layer queries walk the named-graph space directly with a
 // FILTER on the graph URI, rather than going through the daemon's
 // built-in `view` helpers. Two wins from this:
@@ -279,27 +336,20 @@ function buildEntities(layered: LayeredTriple[]): Map<string, MemoryEntity> {
     }
   }
 
-  const NAME_PREDS = [
-    'http://schema.org/name',
-    'http://www.w3.org/2000/01/rdf-schema#label',
-    'http://purl.org/dc/terms/title',
-    'http://xmlns.com/foaf/0.1/name',
-  ];
-
   for (const entity of entities.values()) {
-    for (const pred of NAME_PREDS) {
-      const vals = entity.properties.get(pred);
-      if (vals?.[0]) {
-        entity.label = vals[0];
-        break;
-      }
-    }
+    entity.label = deriveEntityLabel(entity);
 
     if (entity.layers.has('verified')) entity.trustLevel = 'verified';
     else if (entity.layers.has('shared')) entity.trustLevel = 'shared';
     else entity.trustLevel = 'working';
   }
 
+  for (const entity of entities.values()) {
+    for (const connection of entity.connections) {
+      connection.targetLabel = entities.get(connection.targetUri)?.label ?? shortLabel(connection.targetUri);
+    }
+  }
+
   return entities;
 }
 

packages/node-ui/src/ui/views/project/components.tsx

@@ -51,7 +51,7 @@ import {
   entityAuthorUri, transitionAgentUri, transitionAtISO,
   shortType, shortPred, entityMeta,
   buildLayerGraphOptions, getDescription, neighborhoodTriples,
-  matchesSearch, humanizeLabel, useLayerTriples,
+  matchesSearch, humanizeLabel, layerNoun, useLayerTriples,
   entityTimestamp, formatRelativeTime, formatTimelineBucket, formatTrailTimestamp,
   type LayerView, type LayerContentTab, type KAPane,
   type SubGraphTab, type SubGraphEntitySort,
@@ -602,7 +602,7 @@ export function MemoryStrip({
               <div className="v10-layer-items">
                 <span className="v10-layer-chevron">▸</span>
                 {layer.entities.length === 0 && (
-                  <span style={{ fontSize: 11, color: 'var(--text-tertiary)', fontStyle: 'italic' }}>No assets yet</span>
+                  <span style={{ fontSize: 11, color: 'var(--text-tertiary)', fontStyle: 'italic' }}>No {layerNoun(layer.key, 2).toLowerCase()} yet</span>
                 )}
                 {layer.entities.slice(0, 6).map(e => {
                   const { icon } = entityMeta(e, profile);
@@ -782,7 +782,7 @@ export function LayerStatsWidget({ entities, entityCount, triples, layer }: {
     <GenWidget title="Layer Stats">
       <div className="v10-layer-summary">
         <div className="v10-layer-summary-stat">
-          <span className="v10-layer-summary-label">Knowledge Assets</span>
+          <span className="v10-layer-summary-label">{layerNoun(layer, entityCount)}</span>
           <span className="v10-layer-summary-value">{entityCount}</span>
         </div>
         <div className="v10-layer-summary-stat">
@@ -849,12 +849,13 @@ export function LayerActionsWidget({ layer, count, contextGraphId, onComplete }:
 
   if (count === 0) return null;
   const color = isWm ? '#f59e0b' : '#22c55e';
-  const target = isWm ? 'Shared Memory' : 'Verified Memory';
+  const target = isWm ? 'Shared Working Memory' : 'Verified Memory';
+  const noun = layerNoun(layer, count).toLowerCase();
 
   return (
-    <GenWidget title={isWm ? 'Promote' : 'Publish'} footnote={`Moves assets from this layer to ${target}.`}>
+    <GenWidget title={isWm ? 'Promote' : 'Publish'} footnote={`Moves ${noun} from this layer to ${target}.`}>
       <div className="v10-decision-context" style={{ marginBottom: 10 }}>
-        {count} asset{count !== 1 ? 's' : ''} in this layer can be {isWm ? 'promoted to Shared Memory for collaborative review' : 'published to Verified Memory on-chain'}.
+        {count} {noun} in this layer can be {isWm ? 'promoted to Shared Working Memory for collaborative review' : 'published to Verified Memory on-chain'}.
       </div>
       {result && <div style={{ fontSize: 11, color: 'var(--text-success)', marginBottom: 8 }}>✓ {result}</div>}
       {error && <div style={{ fontSize: 11, color: 'var(--text-danger)', marginBottom: 8 }}>✕ {error}</div>}
@@ -944,6 +945,7 @@ export function EntityList({
 }) {
   const profile = useProjectProfileContext();
   const agents = useAgentsContext();
+  const noun = layerNoun(layerKey, entities.length).toLowerCase();
   const sorted = useMemo(() => {
     if (externallySorted) return entities;
     const copy = [...entities];
@@ -960,7 +962,7 @@ export function EntityList({
   if (entities.length === 0) {
     return (
       <div className="v10-entity-list empty">
-        <div className="v10-entity-list-empty">No entities in this layer yet.</div>
+        <div className="v10-entity-list-empty">No {layerNoun(layerKey, 2).toLowerCase()} in this layer yet.</div>
       </div>
     );
   }
@@ -970,7 +972,7 @@ export function EntityList({
   return (
     <div className="v10-entity-list">
       <div className="v10-entity-list-header">
-        <span className="v10-entity-list-count">{sorted.length} entit{sorted.length === 1 ? 'y' : 'ies'}</span>
+        <span className="v10-entity-list-count">{sorted.length} {noun}</span>
         <span className="v10-entity-list-hint">{hint}</span>
         {headerExtra && <span className="v10-entity-list-extra">{headerExtra}</span>}
       </div>
@@ -1051,7 +1053,7 @@ export function LayerContent({
   footer?: React.ReactNode;
 }) {
   const config = LAYER_CONFIG[layer];
-  const itemsLabel = layer === 'vm' ? 'Knowledge Assets' : 'Entities';
+  const itemsLabel = layerNoun(layer, 2);
   const vmLayerStatus = memory.layerStatus?.vm ?? (memory.loading ? 'loading' : memory.error ? 'error' : 'ok');
   const isInitialVerifiedMemoryLoad = layer === 'vm' && vmLayerStatus === 'loading' && entities.length === 0;
   const isVerifiedMemoryUnavailable = layer === 'vm' && vmLayerStatus === 'error' && entities.length === 0;
@@ -1989,9 +1991,9 @@ export function DocumentsList({
 
 export function ProvenanceBar({ memory }: { memory: ReturnType<typeof useMemoryEntities> }) {
   const latestEvent = useMemo(() => {
-    if (memory.counts.vm > 0) return `${memory.counts.vm} knowledge assets verified on-chain`;
-    if (memory.counts.swm > 0) return `${memory.counts.swm} assets in shared memory`;
-    if (memory.counts.wm > 0) return `${memory.counts.wm} drafts in working memory`;
+    if (memory.counts.vm > 0) return `${memory.counts.vm} ${layerNoun('vm', memory.counts.vm).toLowerCase()} verified on-chain`;
+    if (memory.counts.swm > 0) return `${memory.counts.swm} ${layerNoun('swm', memory.counts.swm).toLowerCase()} in shared working memory`;
+    if (memory.counts.wm > 0) return `${memory.counts.wm} ${layerNoun('wm', memory.counts.wm).toLowerCase()} in working memory`;
     return 'No activity yet';
   }, [memory.counts]);
 
@@ -2233,6 +2235,7 @@ export function KADetailView({ entity, allEntities, allTriples, onNavigate, onCl
   const author = authorUri ? agents?.get(authorUri) ?? null : null;
   const layerBadge = entity.trustLevel === 'verified' ? 'vm' : entity.trustLevel === 'shared' ? 'swm' : 'wm';
   const layerLabel = entity.trustLevel === 'verified' ? 'Verified Memory' : entity.trustLevel === 'shared' ? 'Shared Working Memory' : 'Working Memory';
+  const detailNoun = layerNoun(entity.trustLevel, 1);
 
   const incoming = useMemo(() => {
     const result: Array<{ pred: string; entity: MemoryEntity }> = [];
@@ -2294,7 +2297,7 @@ export function KADetailView({ entity, allEntities, allTriples, onNavigate, onCl
       <div className="v10-ka-header">
         <button className="v10-ka-back" onClick={onClose}>← Back to Context Graph</button>
         <div className="v10-ka-header-left">
-          <div className="v10-ka-label">Knowledge Asset</div>
+          <div className="v10-ka-label">{detailNoun}</div>
           <div className="v10-ka-name">
             {icon} {entity.label}
             <span className={`v10-trust-badge ${layerBadge}`}>{layerLabel}</span>

packages/node-ui/src/ui/views/project/helpers.ts

@@ -169,6 +169,20 @@ export const LAYER_CONFIG: Record<'wm' | 'swm' | 'vm', {
   },
 };
 
+export function layerNoun(
+  layer: 'wm' | 'swm' | 'vm' | TrustLevel,
+  count: number = 2,
+): string {
+  const normalized =
+    layer === 'working' ? 'wm' :
+    layer === 'shared' ? 'swm' :
+    layer === 'verified' ? 'vm' :
+    layer;
+  const plural = count !== 1;
+  if (normalized === 'vm') return plural ? 'Knowledge Assets' : 'Knowledge Asset';
+  return plural ? 'Entities' : 'Entity';
+}
+
 // ─── Shared graph styling ────────────────────────────────────
 // Rich palette for known ontologies — applied in any RdfGraph rendered
 // from this view. Nodes without matching types fall back to the layer's
@@ -304,8 +318,18 @@ export function humanizeLabel(entity: MemoryEntity | undefined, uri: string): st
   if (entity) return entity.label;
   const slash = uri.lastIndexOf('/');
   const hash = uri.lastIndexOf('#');
-  const cut = Math.max(slash, hash);
-  return cut >= 0 ? uri.slice(cut + 1) : uri;
+  const colon = uri.lastIndexOf(':');
+  const cut = Math.max(slash, hash, colon);
+  const tail = cut >= 0 ? uri.slice(cut + 1) : uri;
+  const decoded = (() => {
+    try { return decodeURIComponent(tail); }
+    catch { return tail; }
+  })();
+  if (/^urn:dkg:extraction:[^\s]+$/i.test(uri)) {
+    const short = decoded.replace(/-/g, '').replace(/_+/g, ' ').slice(0, 12).trim();
+    return short ? `Extraction ${short}` : 'Extraction';
+  }
+  return decoded || uri;
 }
 
 // ─── Layer Switcher Bar ──────────────────────────────────────

packages/node-ui/test/ka-detail-label.test.ts

@@ -5,12 +5,24 @@ import { act } from 'react';
 import { createRoot, type Root } from 'react-dom/client';
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { KADetailView, TrailEvent } from '../src/ui/views/project/components.js';
+import { layerNoun } from '../src/ui/views/project/helpers.js';
 import { ProjectProfileContext, type ProjectProfile } from '../src/ui/hooks/useProjectProfile.js';
 import { AgentsContext, type AgentsData } from '../src/ui/hooks/useAgents.js';
 import type { MemoryEntity } from '../src/ui/hooks/useMemoryEntities.js';
 
 (globalThis as any).IS_REACT_ACT_ENVIRONMENT = true;
 
+describe('layerNoun', () => {
+  it('uses entities for WM/SWM and knowledge assets for VM', () => {
+    expect(layerNoun('wm', 1)).toBe('Entity');
+    expect(layerNoun('wm', 2)).toBe('Entities');
+    expect(layerNoun('swm', 1)).toBe('Entity');
+    expect(layerNoun('swm', 2)).toBe('Entities');
+    expect(layerNoun('vm', 1)).toBe('Knowledge Asset');
+    expect(layerNoun('vm', 2)).toBe('Knowledge Assets');
+  });
+});
+
 const profile: ProjectProfile = {
   contextGraphId: 'cg-test',
   displayName: 'Context Graph Test',
@@ -106,6 +118,35 @@ describe('KADetailView navigation label', () => {
     expect(onClose).toHaveBeenCalledTimes(1);
   });
 
+  it('uses layer-aware nouns in the detail header', async () => {
+    const render = async (testEntity: MemoryEntity) => {
+      await act(async () => {
+        root.render(
+          React.createElement(ProjectProfileContext.Provider, { value: profile },
+            React.createElement(AgentsContext.Provider, { value: agents },
+              React.createElement(KADetailView, {
+                entity: testEntity,
+                allEntities: new Map([[testEntity.uri, testEntity]]),
+                allTriples: [],
+                onNavigate: vi.fn(),
+                onClose: vi.fn(),
+                contextGraphId: 'cg-test',
+                onRefresh: vi.fn(),
+              }))),
+        );
+      });
+    };
+
+    await render({ ...entity, trustLevel: 'working', layers: new Set(['working']) });
+    expect(query('.v10-ka-label').textContent).toBe('Entity');
+
+    await render({ ...entity, uri: 'urn:entity:shared', trustLevel: 'shared', layers: new Set(['shared']) });
+    expect(query('.v10-ka-label').textContent).toBe('Entity');
+
+    await render({ ...entity, uri: 'urn:entity:verified', trustLevel: 'verified', layers: new Set(['verified']) });
+    expect(query('.v10-ka-label').textContent).toBe('Knowledge Asset');
+  });
+
   it('renders provenance timestamps in the event header without requiring an agent', async () => {
     const at = '2026-05-23T12:34:00.000Z';