unspaghettit 0.2.0 → 0.4.0

package/src/features/projects/domain/services/InheritedFromProject.ts

@@ -1,131 +1,131 @@
-import type { Feature } from '$features/behavior-model/domain/entities/Feature';
-import type { EventDefinition } from '$features/behavior-model/domain/entities/EventDefinition';
-import type { Resource } from '$features/behavior-model/domain/entities/Resource';
-import type { Entity } from '$features/behavior-model/domain/entities/Entity';
-import type { FeatureId } from '$features/behavior-model/domain/value-objects/ids';
-
-/**
+import type { Feature } from '$features/behavior-model/domain/entities/Feature';
+import type { EventDefinition } from '$features/behavior-model/domain/entities/EventDefinition';
+import type { Resource } from '$features/behavior-model/domain/entities/Resource';
+import type { Entity } from '$features/behavior-model/domain/entities/Entity';
+import type { FeatureId } from '$features/behavior-model/domain/value-objects/ids';
+
+/**
  * Every inherited row carries its source feature so the editor can
- * render a "from <Feature>" badge next to it. Sibling entities are
- * read-only; only the open feature can be edited.
- */
-export type WithSource<T> = {
-  readonly value: T;
-  readonly sourceFeatureId: FeatureId;
-  readonly sourceFeatureName: string;
-};
-
-export type InheritedTransition = {
-  readonly id: string;
-  readonly surfaceId: string;
-  readonly surfaceName: string;
-  /** Target surface id (raw, for click-through / lookup). */
-  readonly target: string;
-  /** Human-readable target name resolved from the source feature's surfaces. Falls back to the id when broken. */
-  readonly targetName: string;
-  /** True when `target` doesn't resolve to a surface in the source feature. */
-  readonly targetMissing: boolean;
-  readonly label?: string;
-};
-
-/**
- * Flat union of every resource/data/event/transition contributed by sibling
- * features in the same project. Dedup keys are entity-stable (resource.id,
- * data.id, event.name) so multiple siblings with the same shared entity show
- * up once, tagged with the first sibling that defines it.
- */
-export const inheritedResources = (
-  siblings: readonly Feature[]
-): readonly WithSource<Resource>[] => {
-  const seen = new Set<string>();
-  const out: WithSource<Resource>[] = [];
-  for (const sibling of siblings) {
-    for (const r of sibling.resources) {
-      const key = String(r.id);
-      if (seen.has(key)) continue;
-      seen.add(key);
-      out.push({
-        value: r,
-        sourceFeatureId: sibling.id,
-        sourceFeatureName: sibling.name
-      });
-    }
-  }
-  return out;
-};
-
-export const inheritedData = (
-  siblings: readonly Feature[]
-): readonly WithSource<Entity>[] => {
-  const seen = new Set<string>();
-  const out: WithSource<Entity>[] = [];
-  for (const sibling of siblings) {
-    for (const d of sibling.entities) {
-      const key = String(d.id);
-      if (seen.has(key)) continue;
-      seen.add(key);
-      out.push({
-        value: d,
-        sourceFeatureId: sibling.id,
-        sourceFeatureName: sibling.name
-      });
-    }
-  }
-  return out;
-};
-
-export const inheritedEvents = (
-  siblings: readonly Feature[]
-): readonly WithSource<EventDefinition>[] => {
-  const seen = new Set<string>();
-  const out: WithSource<EventDefinition>[] = [];
-  for (const sibling of siblings) {
-    for (const e of sibling.events ?? []) {
-      const key = String(e.name);
-      if (seen.has(key)) continue;
-      seen.add(key);
-      out.push({
-        value: e,
-        sourceFeatureId: sibling.id,
-        sourceFeatureName: sibling.name
-      });
-    }
-  }
-  return out;
-};
-
-export const inheritedTransitions = (
-  siblings: readonly Feature[]
-): readonly WithSource<InheritedTransition>[] => {
-  const out: WithSource<InheritedTransition>[] = [];
-  for (const sibling of siblings) {
-    // Build a name lookup once per sibling so the inner loop can resolve
-    // target ids → human names cheaply. A transition always points at a
-    // surface in the SAME feature, so the lookup is feature-local.
-    const surfaceNameById = new Map<string, string>();
-    for (const surface of sibling.surfaces) {
-      surfaceNameById.set(String(surface.id), surface.name);
-    }
-    for (const surface of sibling.surfaces) {
-      for (const t of surface.transitions) {
-        const targetId = String(t.target);
-        const targetName = surfaceNameById.get(targetId);
-        const transition: InheritedTransition = {
-          id: String(t.id),
-          surfaceId: String(surface.id),
-          surfaceName: surface.name,
-          target: targetId,
-          targetName: targetName ?? targetId,
-          targetMissing: targetName === undefined,
-          ...(t.label !== undefined ? { label: t.label } : {})
-        };
-        out.push({
-          value: transition,
-          sourceFeatureId: sibling.id,
-          sourceFeatureName: sibling.name
-        });
-      }
-    }
-  }
-  return out;
-};
+ * render a "from <Feature>" badge next to it. Sibling entities are
+ * read-only; only the open feature can be edited.
+ */
+export type WithSource<T> = {
+  readonly value: T;
+  readonly sourceFeatureId: FeatureId;
+  readonly sourceFeatureName: string;
+};
+
+export type InheritedTransition = {
+  readonly id: string;
+  readonly surfaceId: string;
+  readonly surfaceName: string;
+  /** Target surface id (raw, for click-through / lookup). */
+  readonly target: string;
+  /** Human-readable target name resolved from the source feature's surfaces. Falls back to the id when broken. */
+  readonly targetName: string;
+  /** True when `target` doesn't resolve to a surface in the source feature. */
+  readonly targetMissing: boolean;
+  readonly label?: string;
+};
+
+/**
+ * Flat union of every resource/data/event/transition contributed by sibling
+ * features in the same project. Dedup keys are entity-stable (resource.id,
+ * data.id, event.name) so multiple siblings with the same shared entity show
+ * up once, tagged with the first sibling that defines it.
+ */
+export const inheritedResources = (
+  siblings: readonly Feature[]
+): readonly WithSource<Resource>[] => {
+  const seen = new Set<string>();
+  const out: WithSource<Resource>[] = [];
+  for (const sibling of siblings) {
+    for (const r of sibling.resources) {
+      const key = String(r.id);
+      if (seen.has(key)) continue;
+      seen.add(key);
+      out.push({
+        value: r,
+        sourceFeatureId: sibling.id,
+        sourceFeatureName: sibling.name
+      });
+    }
+  }
+  return out;
+};
+
+export const inheritedData = (
+  siblings: readonly Feature[]
+): readonly WithSource<Entity>[] => {
+  const seen = new Set<string>();
+  const out: WithSource<Entity>[] = [];
+  for (const sibling of siblings) {
+    for (const d of sibling.entities) {
+      const key = String(d.id);
+      if (seen.has(key)) continue;
+      seen.add(key);
+      out.push({
+        value: d,
+        sourceFeatureId: sibling.id,
+        sourceFeatureName: sibling.name
+      });
+    }
+  }
+  return out;
+};
+
+export const inheritedEvents = (
+  siblings: readonly Feature[]
+): readonly WithSource<EventDefinition>[] => {
+  const seen = new Set<string>();
+  const out: WithSource<EventDefinition>[] = [];
+  for (const sibling of siblings) {
+    for (const e of sibling.events ?? []) {
+      const key = String(e.name);
+      if (seen.has(key)) continue;
+      seen.add(key);
+      out.push({
+        value: e,
+        sourceFeatureId: sibling.id,
+        sourceFeatureName: sibling.name
+      });
+    }
+  }
+  return out;
+};
+
+export const inheritedTransitions = (
+  siblings: readonly Feature[]
+): readonly WithSource<InheritedTransition>[] => {
+  const out: WithSource<InheritedTransition>[] = [];
+  for (const sibling of siblings) {
+    // Build a name lookup once per sibling so the inner loop can resolve
+    // target ids → human names cheaply. A transition always points at a
+    // surface in the SAME feature, so the lookup is feature-local.
+    const surfaceNameById = new Map<string, string>();
+    for (const surface of sibling.surfaces) {
+      surfaceNameById.set(String(surface.id), surface.name);
+    }
+    for (const surface of sibling.surfaces) {
+      for (const t of surface.transitions) {
+        const targetId = String(t.target);
+        const targetName = surfaceNameById.get(targetId);
+        const transition: InheritedTransition = {
+          id: String(t.id),
+          surfaceId: String(surface.id),
+          surfaceName: surface.name,
+          target: targetId,
+          targetName: targetName ?? targetId,
+          targetMissing: targetName === undefined,
+          ...(t.label !== undefined ? { label: t.label } : {})
+        };
+        out.push({
+          value: transition,
+          sourceFeatureId: sibling.id,
+          sourceFeatureName: sibling.name
+        });
+      }
+    }
+  }
+  return out;
+};

package/src/features/projects/infrastructure/persistence/JsonFolderProjectRepository.ts

@@ -55,6 +55,15 @@ export class JsonFolderProjectRepository implements ProjectRepository {
     return found ? found.project : null;
   }
 
+  /**
+   * Server-only bulk read: every full Project in ONE directory pass. Not on the
+   * {@link ProjectRepository} port — used by derived artifacts (the
+   * global-search index) so they avoid an O(N²) `get()`-per-id scan.
+   */
+  async listFull(): Promise<readonly Project[]> {
+    return this.readAll().map((s) => s.project);
+  }
+
   async save(project: Project): Promise<void> {
     const all = this.readAll();
     const previous = all.find((s) => s.project.id === project.id);

package/src/features/projects/presentation/components/ProjectCard.svelte

@@ -2,10 +2,13 @@
   import type { ProjectSummary } from '$features/projects/application/ports/ProjectRepository';
   import { projectsStore } from '$features/projects/presentation/stores/projectsStore.svelte';
   import TagDotStrip from '$features/tag-palette/presentation/components/TagDotStrip.svelte';
+  import KebabMenu from '$shared/presentation/components/KebabMenu.svelte';
+  import MenuItem from '$shared/presentation/components/MenuItem.svelte';
 
   type Props = {
     summary: ProjectSummary;
     onDelete: () => void;
+    onExport: () => void;
     onAddTag?: (type: string, value: string) => void | Promise<void>;
     onRemoveTag?: (type: string, value: string) => void | Promise<void>;
     tagTypeOptions?: readonly string[];
@@ -15,6 +18,7 @@
   let {
     summary,
     onDelete,
+    onExport,
     onAddTag,
     onRemoveTag,
     tagTypeOptions = [],
@@ -30,7 +34,7 @@
   data-tour="project-card"
   class="group relative flex h-full min-h-52 flex-col justify-between overflow-hidden rounded-xl border border-cyan-100 bg-white p-5 shadow-sm shadow-cyan-950/5 transition duration-150 hover:-translate-y-0.5 hover:border-cyan-200 hover:bg-cyan-50/20 hover:shadow-md hover:shadow-cyan-950/10 focus-within:border-cyan-300"
 >
-  <div class="absolute inset-x-0 top-0 h-1 bg-gradient-to-r from-brand-500 via-brand-mint to-violet-400"></div>
+  <div class="absolute inset-x-0 top-0 h-1 bg-linear-to-r from-brand-500 via-brand-mint to-violet-400"></div>
   <div class="space-y-3">
     <div class="flex items-start justify-between gap-3">
       <a href={`/projects/${summary.id}`} class="block min-w-0 flex-1" onclick={markOpened}>
@@ -63,13 +67,28 @@
       </span>
     </div>
     <div class="flex shrink-0 items-center gap-1">
-      <button
-        type="button"
-        class="rounded px-2 py-1 text-slate-400 opacity-0 transition group-hover:opacity-100 group-focus-within:opacity-100 hover:bg-red-50 hover:text-red-600"
-        onclick={onDelete}
-      >
-        {deleteLabel}
-      </button>
+      <KebabMenu placement="up" align="right" label="Project actions">
+        {#snippet children(close)}
+          <MenuItem
+            onclick={() => {
+              close();
+              onExport();
+            }}
+          >
+            <span aria-hidden="true">⬇</span>
+            Export .unspa
+          </MenuItem>
+          <MenuItem
+            danger
+            onclick={() => {
+              close();
+              onDelete();
+            }}
+          >
+            {deleteLabel}
+          </MenuItem>
+        {/snippet}
+      </KebabMenu>
     </div>
   </div>
 </article>

package/src/features/projects/presentation/components/ProjectEditor.svelte

@@ -9,7 +9,6 @@
   import ProjectEventsPanel from './ProjectEventsPanel.svelte';
   import ProjectTransitionsPanel from './ProjectTransitionsPanel.svelte';
   import ProjectHistoryPanel from './ProjectHistoryPanel.svelte';
-  import QueuePanel from '$features/implementation-queue/presentation/components/QueuePanel.svelte';
   import type { FeatureId } from '$features/behavior-model/domain/value-objects/ids';
   import {
     alertDialog,
@@ -31,10 +30,11 @@
   import type { Tag } from '$shared/domain/Tags';
   import TagDotStrip from '$features/tag-palette/presentation/components/TagDotStrip.svelte';
   import { tagPaletteStore } from '$features/tag-palette/presentation/stores/tagPaletteStore.svelte';
+  import KebabMenu from '$shared/presentation/components/KebabMenu.svelte';
+  import MenuItem from '$shared/presentation/components/MenuItem.svelte';
 
   const PANELS: { id: ProjectPanel; label: string }[] = [
     { id: 'features', label: 'Features' },
-    { id: 'queue', label: 'Queue' },
     { id: 'resources', label: 'Resources' },
     { id: 'data', label: 'Entity' },
     { id: 'events', label: 'Events' },
@@ -70,11 +70,6 @@
     switch (panel) {
       case 'features':
         return exps.length;
-      case 'queue':
-        // Read straight off the project so the badge is correct on first
-        // paint, before the user ever clicks the Queue tab (the panel-side
-        // queueStore only populates on mount).
-        return projectStore.project?.implementationQueue?.length ?? 0;
       case 'resources':
         return groupResources(exps).length;
       case 'data':
@@ -173,16 +168,27 @@
           <span aria-hidden="true">←</span>
           Back to projects
         </a>
-        <button
-          type="button"
-          class="inline-flex items-center gap-1.5 rounded-md border border-slate-300 bg-white px-3 py-1.5 text-xs font-medium text-slate-700 transition hover:border-brand-300 hover:bg-cyan-50 hover:text-brand-800 disabled:opacity-50"
-          onclick={handleExport}
-          disabled={exporting}
-          title="Encrypt the project (and all its features + status) into a .unspa file you can share or back up"
+        <a
+          href={`/projects/${project.id}/graph`}
+          class="inline-flex items-center gap-1.5 rounded-md border border-slate-300 bg-white px-3 py-1.5 text-xs font-medium text-slate-700 transition hover:border-brand-300 hover:bg-cyan-50 hover:text-brand-800"
+          title="Open the whole project behavior graph"
         >
-          <span aria-hidden="true">⬇</span>
-          {exporting ? 'Exporting...' : 'Export .unspa'}
-        </button>
+          Graph
+        </a>
+        <KebabMenu align="right" placement="down" label="Project actions">
+          {#snippet children(close)}
+            <MenuItem
+              disabled={exporting}
+              onclick={() => {
+                close();
+                handleExport();
+              }}
+            >
+              <span aria-hidden="true">⬇</span>
+              {exporting ? 'Exporting...' : 'Export .unspa'}
+            </MenuItem>
+          {/snippet}
+        </KebabMenu>
       </div>
       <div class="mt-3">
         <div class="min-w-0">
@@ -276,7 +282,7 @@
       </nav>
     </div>
 
-    {#if projectStore.activePanel !== 'features' && projectStore.activePanel !== 'queue' && projectStore.activePanel !== 'history'}
+    {#if projectStore.activePanel !== 'features' && projectStore.activePanel !== 'history'}
       <div class="mb-5 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
         <input
           type="search"
@@ -306,8 +312,6 @@
               onRemoveTag={handleRemoveFeatureTag}
               onRemove={handleRemoveFeature}
             />
-          {:else if projectStore.activePanel === 'queue'}
-            <QueuePanel />
           {:else if projectStore.activePanel === 'resources'}
             <ProjectResourcesPanel features={projectFeaturesStore.features} search={projectStore.search} />
           {:else if projectStore.activePanel === 'data'}