coaia-visualizer 1.6.3 → 1.6.5

package/components/github-provenance.tsx

@@ -0,0 +1,226 @@
+"use client"
+
+import { useState } from "react"
+import type { LucideIcon } from "lucide-react"
+import { AlertTriangle, CheckCircle2, Cloud, ExternalLink, FolderOpen, Github, GitBranch, XCircle } from "lucide-react"
+
+import { Badge } from "@/components/ui/badge"
+import type { EntityRecord } from "@/lib/types"
+import {
+  formatGithubIssueRef,
+  formatProjectItemRef,
+  getGithubEntityProvenance,
+  getGithubIssueRef,
+  getGithubSyncState,
+  getProjectFieldEntries,
+  type GithubSyncState,
+} from "@/lib/github-provenance"
+import { cn } from "@/lib/utils"
+
+interface SyncStatePillProps {
+  syncState?: GithubSyncState
+  className?: string
+}
+
+const syncStateConfig: Record<GithubSyncState, { label: string; className: string; Icon: LucideIcon }> = {
+  synced: {
+    label: "synced",
+    className: "border-emerald-500/40 bg-emerald-500/10 text-emerald-700 dark:text-emerald-300",
+    Icon: CheckCircle2,
+  },
+  diverged: {
+    label: "diverged",
+    className: "border-amber-500/40 bg-amber-500/10 text-amber-700 dark:text-amber-300",
+    Icon: AlertTriangle,
+  },
+  conflict: {
+    label: "conflict",
+    className: "border-destructive/40 bg-destructive/10 text-destructive",
+    Icon: XCircle,
+  },
+  "project-only": {
+    label: "project-only",
+    className: "border-slate-500/40 bg-slate-500/10 text-slate-700 dark:text-slate-300",
+    Icon: Cloud,
+  },
+  "chart-only": {
+    label: "chart-only",
+    className: "border-slate-500/40 bg-slate-500/10 text-slate-700 dark:text-slate-300",
+    Icon: FolderOpen,
+  },
+}
+
+export function SyncStatePill({ syncState, className }: SyncStatePillProps) {
+  if (!syncState) return null
+
+  const { label, className: stateClassName, Icon } = syncStateConfig[syncState]
+
+  return (
+    <Badge variant="outline" className={cn("gap-1 text-xs", stateClassName, className)}>
+      <Icon className="w-3 h-3" />
+      {label}
+    </Badge>
+  )
+}
+
+interface ProjectSourceBadgeProps {
+  entity: EntityRecord
+  className?: string
+  compact?: boolean
+}
+
+export function ProjectSourceBadge({ entity, className, compact = false }: ProjectSourceBadgeProps) {
+  const [selectedLensIndex, setSelectedLensIndex] = useState(0)
+  const provenance = getGithubEntityProvenance(entity)
+
+  if (!provenance.hasGithubMetadata) return null
+
+  const projectItems = provenance.projectItems
+  const activeLensIndex = projectItems.length > 0 ? Math.min(selectedLensIndex, projectItems.length - 1) : 0
+  const activeProjectItem = projectItems[activeLensIndex]
+  const projectRef = formatProjectItemRef(activeProjectItem)
+  const issueRef = formatGithubIssueRef(provenance.issue)
+  const projectTitle = activeProjectItem?.projectTitle
+  const fieldEntries = getProjectFieldEntries(entity, activeProjectItem)
+  const sourceLabel = getSourceLabel(provenance.source?.system, provenance.source?.toolName, provenance.lastSyncedAt)
+  const projectTooltip = [
+    projectTitle,
+    activeProjectItem?.itemId && `item ${activeProjectItem.itemId}`,
+    activeProjectItem?.projectId && `project ${activeProjectItem.projectId}`,
+    activeProjectItem?.url,
+  ]
+    .filter(Boolean)
+    .join(" · ")
+
+  return (
+    <div
+      className={cn(
+        "rounded-md border border-indigo-500/20 bg-indigo-500/5 p-3 text-sm",
+        compact && "p-2",
+        className,
+      )}
+    >
+      <div className="flex flex-wrap items-center gap-2">
+        {activeProjectItem?.url ? (
+          <a href={activeProjectItem.url} target="_blank" rel="noreferrer" title={projectTooltip}>
+            <ProjectBadge label={projectRef ?? "Project bridge"} />
+          </a>
+        ) : (
+          <ProjectBadge label={projectRef ?? "Project bridge"} title={projectTooltip} />
+        )}
+
+        {provenance.issue &&
+          (provenance.issue.url ? (
+            <a href={provenance.issue.url} target="_blank" rel="noreferrer" title={issueRef}>
+              <Badge variant="outline" className="gap-1 text-xs">
+                <Github className="w-3 h-3" />#{provenance.issue.number}
+                <ExternalLink className="w-3 h-3" />
+              </Badge>
+            </a>
+          ) : (
+            <Badge variant="outline" className="gap-1 text-xs" title={issueRef}>
+              <Github className="w-3 h-3" />#{provenance.issue.number}
+            </Badge>
+          ))}
+
+        <SyncStatePill syncState={provenance.syncState} />
+
+        {projectItems.length > 1 && (
+          <select
+            aria-label="Active GitHub project lens"
+            value={activeLensIndex}
+            onChange={(event) => setSelectedLensIndex(Number(event.target.value))}
+            className="h-7 rounded-md border border-border bg-background px-2 text-xs text-foreground"
+          >
+            {projectItems.map((item, index) => (
+              <option key={`${formatProjectItemRef(item) ?? item.itemId ?? "project"}-${index}`} value={index}>
+                {item.projectTitle ?? formatProjectItemRef(item) ?? `Project ${index + 1}`}
+              </option>
+            ))}
+          </select>
+        )}
+      </div>
+
+      {!compact && (projectTitle || sourceLabel || fieldEntries.length > 0) && (
+        <div className="mt-2 space-y-2 text-xs text-muted-foreground">
+          {(projectTitle || sourceLabel) && (
+            <div className="flex flex-wrap items-center gap-2">
+              {projectTitle && <span className="font-medium text-foreground">{projectTitle}</span>}
+              {sourceLabel && <span>{sourceLabel}</span>}
+            </div>
+          )}
+
+          {fieldEntries.length > 0 && (
+            <div className="flex flex-wrap gap-1.5">
+              {fieldEntries.map((field) => (
+                <span
+                  key={field.key}
+                  className="inline-flex max-w-full items-center gap-1 rounded-md border border-border bg-background px-2 py-1"
+                  title={`${field.label}: ${field.value}`}
+                >
+                  <span className="font-medium text-foreground">{field.label}</span>
+                  <span className="max-w-[18rem] truncate">{field.value}</span>
+                </span>
+              ))}
+            </div>
+          )}
+        </div>
+      )}
+    </div>
+  )
+}
+
+function ProjectBadge({ label, title }: { label: string; title?: string }) {
+  return (
+    <Badge className="gap-1 bg-indigo-600 text-white hover:bg-indigo-600/90" title={title}>
+      <GitBranch className="w-3 h-3" />
+      Project: {label}
+    </Badge>
+  )
+}
+
+interface ActionStepIssueBadgeProps {
+  action: EntityRecord
+  className?: string
+}
+
+export function ActionStepIssueBadge({ action, className }: ActionStepIssueBadgeProps) {
+  const issue = getGithubIssueRef(action)
+  const syncState = getGithubSyncState(action)
+  const issueRef = formatGithubIssueRef(issue)
+
+  if (!issue && !syncState) return null
+
+  return (
+    <span className={cn("inline-flex flex-wrap items-center gap-1", className)}>
+      {issue &&
+        (issue.url ? (
+          <a href={issue.url} target="_blank" rel="noreferrer" title={issueRef}>
+            <Badge variant="outline" className="gap-1 text-xs">
+              <Github className="w-3 h-3" />#{issue.number}
+              <ExternalLink className="w-3 h-3" />
+            </Badge>
+          </a>
+        ) : (
+          <Badge variant="outline" className="gap-1 text-xs" title={issueRef}>
+            <Github className="w-3 h-3" />#{issue.number}
+          </Badge>
+        ))}
+      <SyncStatePill syncState={syncState} />
+    </span>
+  )
+}
+
+function getSourceLabel(system?: string, toolName?: string, lastSyncedAt?: string): string | undefined {
+  const parts = [system, toolName, formatDateTime(lastSyncedAt)].filter(Boolean)
+  return parts.length > 0 ? parts.join(" · ") : undefined
+}
+
+function formatDateTime(value?: string): string | undefined {
+  if (!value) return undefined
+
+  const date = new Date(value)
+  if (Number.isNaN(date.getTime())) return value
+
+  return date.toLocaleString()
+}

package/components/metadata-projections.tsx

@@ -1,9 +1,12 @@
 "use client"
 
 import { AlertTriangle, Blocks, FileJson, Github, ListChecks, Sparkles, Target } from "lucide-react"
+
+import { AsterionFoundationCard } from "@/components/asterion-foundation-card"
+import { AsterionSessionLineageCard } from "@/components/asterion-session-lineage-card"
 import { Badge } from "@/components/ui/badge"
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
-import type { Chart, EntityRecord, ParsedData } from "@/lib/types"
+import type { Chart, EntityRecord, MetadataWarning, ParsedData } from "@/lib/types"
 
 interface MetadataProjectionsProps {
   chart: Chart
@@ -33,6 +36,17 @@ const KNOWN_METADATA_KEYS = new Set([
   "isTelescopedChart",
   "telescopedChartId",
   "github",
+  "asterion",
+  "asterionMetadata",
+  "asterionFoundation",
+  "foundation",
+  "foundationMetadata",
+  "sessionLineage",
+  "sessionLineageMetadata",
+  "sessionContext",
+  "sessionContextMetadata",
+  "livedContext",
+  "chronicle",
 ])
 
 function JsonBlock({ value }: { value: unknown }) {
@@ -83,6 +97,16 @@ function ProjectionRecord({ entity, label }: { entity?: EntityRecord; label: str
   )
 }
 
+function dedupeWarnings(warnings: MetadataWarning[]): MetadataWarning[] {
+  const seen = new Set<string>()
+  return warnings.filter((warning) => {
+    const key = `${warning.recordName || ""}|${warning.recordType || ""}|${warning.message}`
+    if (seen.has(key)) return false
+    seen.add(key)
+    return true
+  })
+}
+
 export function MetadataProjections({ chart, data }: MetadataProjectionsProps) {
   const riseSpec = (data.riseSpecs || []).find((spec) => spec.chartId === chart.id)
   const chartRecordNames = new Set(
@@ -94,9 +118,11 @@ export function MetadataProjections({ chart, data }: MetadataProjectionsProps) {
       ...chart.narrativeBeats.map((beat) => beat.name),
     ].filter(Boolean),
   )
-  const warnings = (data.preservationWarnings || []).filter(
-    (warning) => !warning.recordName || chartRecordNames.has(warning.recordName),
-  )
+  const warnings = dedupeWarnings([
+    ...(data.preservationWarnings || []).filter((warning) => !warning.recordName || chartRecordNames.has(warning.recordName)),
+    ...(chart.foundationProjection?.warnings || []),
+    ...(chart.sessionLineageProjection?.warnings || []),
+  ])
 
   return (
     <div className="space-y-6">
@@ -105,13 +131,13 @@ export function MetadataProjections({ chart, data }: MetadataProjectionsProps) {
           <CardHeader>
             <CardTitle className="flex items-center gap-2 text-base">
               <AlertTriangle className="h-5 w-5 text-amber-600" />
-              Preservation Warnings
+              Metadata Warnings
             </CardTitle>
           </CardHeader>
           <CardContent className="space-y-2">
             {warnings.map((warning, index) => (
               <div key={`${warning.recordName}-${index}`} className="rounded-md border border-amber-500/30 bg-amber-500/5 p-3 text-sm">
-                <div className="font-medium">{warning.recordName || warning.recordType || "JSONL record"}</div>
+                <div className="font-medium">{warning.recordName || warning.recordType || "Chart metadata"}</div>
                 <div className="text-muted-foreground">{warning.message}</div>
                 {warning.upstreamIssue && (
                   <a className="text-xs underline" href={warning.upstreamIssue} target="_blank" rel="noreferrer">
@@ -124,6 +150,9 @@ export function MetadataProjections({ chart, data }: MetadataProjectionsProps) {
         </Card>
       )}
 
+      {chart.foundationProjection && <AsterionFoundationCard projection={chart.foundationProjection} />}
+      {chart.sessionLineageProjection && <AsterionSessionLineageCard projection={chart.sessionLineageProjection} />}
+
       <Card>
         <CardHeader>
           <CardTitle className="flex items-center gap-2 text-base">
@@ -178,19 +207,24 @@ export function MetadataProjections({ chart, data }: MetadataProjectionsProps) {
         <CardHeader>
           <CardTitle className="flex items-center gap-2 text-base">
             <FileJson className="h-5 w-5" />
-            Rich Metadata Projection
+            Raw Metadata
           </CardTitle>
         </CardHeader>
         <CardContent className="space-y-3">
-          <ProjectionRecord label="Chart" entity={chart.chartEntity} />
-          <ProjectionRecord label="Desired Outcome" entity={chart.desiredOutcome} />
-          <ProjectionRecord label="Current Reality" entity={chart.currentReality} />
-          {chart.actions.map((action) => (
-            <ProjectionRecord key={action.name} label="Action Step" entity={action} />
-          ))}
-          {chart.narrativeBeats.map((beat) => (
-            <ProjectionRecord key={beat.name} label="Narrative Beat" entity={beat} />
-          ))}
+          <details>
+            <summary className="cursor-pointer text-sm font-medium">Show preserved JSONL metadata</summary>
+            <div className="mt-3 space-y-3">
+              <ProjectionRecord label="Chart" entity={chart.chartEntity} />
+              <ProjectionRecord label="Desired Outcome" entity={chart.desiredOutcome} />
+              <ProjectionRecord label="Current Reality" entity={chart.currentReality} />
+              {chart.actions.map((action) => (
+                <ProjectionRecord key={action.name} label="Action Step" entity={action} />
+              ))}
+              {chart.narrativeBeats.map((beat) => (
+                <ProjectionRecord key={beat.name} label="Narrative Beat" entity={beat} />
+              ))}
+            </div>
+          </details>
           <div className="flex flex-wrap gap-2 pt-1 text-sm text-muted-foreground">
             <Badge variant="outline" className="gap-1">
               <ListChecks className="h-3 w-3" />

package/components/narrative-beats.tsx

@@ -1,9 +1,12 @@
 "use client"
 
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { Clock, Compass, Drama, Link2, Sparkles } from "lucide-react"
+
+import { AsterionSessionContextBadge } from "@/components/asterion-session-context-badge"
 import { Badge } from "@/components/ui/badge"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { getNarrativeBeatAnchorId, parseSessionContextMetadata } from "@/lib/asterion-metadata"
 import type { EntityRecord } from "@/lib/types"
-import { Clock, Compass, Drama, Sparkles } from "lucide-react"
 
 interface NarrativeBeatsProps {
   beats: EntityRecord[]
@@ -29,8 +32,11 @@ export function NarrativeBeats({ beats }: NarrativeBeatsProps) {
         const universes = beat.metadata.universes || []
         const timestamp = beat.metadata.timestamp ? new Date(beat.metadata.timestamp).toLocaleString() : null
 
+        const anchorId = getNarrativeBeatAnchorId(beat, idx)
+        const sessionContextProjection = parseSessionContextMetadata(beat, idx)
+
         return (
-          <Card key={beat.name} className="border-l-4 border-l-chart-3">
+          <Card id={anchorId} key={beat.name} className="scroll-mt-24 border-l-4 border-l-chart-3">
             <CardHeader className="bg-chart-3/5">
               <div className="flex items-start justify-between gap-4">
                 <div className="flex-1">
@@ -42,6 +48,10 @@ export function NarrativeBeats({ beats }: NarrativeBeatsProps) {
                     <Badge variant="outline" className="border-chart-3 text-chart-3">
                       Beat {idx + 1}
                     </Badge>
+                    <a href={`#${anchorId}`} className="inline-flex items-center gap-1 text-xs text-muted-foreground underline">
+                      <Link2 className="h-3 w-3" />
+                      anchor
+                    </a>
                   </div>
                   {timestamp && (
                     <CardDescription className="flex items-center gap-1">
@@ -53,6 +63,9 @@ export function NarrativeBeats({ beats }: NarrativeBeatsProps) {
               </div>
             </CardHeader>
             <CardContent className="space-y-4 pt-4">
+              {/* Session Context Badge */}
+              {sessionContextProjection && <AsterionSessionContextBadge projection={sessionContextProjection} />}
+
               {/* Universes */}
               <div className="flex items-center gap-2 flex-wrap">
                 <Compass className="w-4 h-4 text-muted-foreground" />

package/components/relation-graph.tsx

@@ -2,8 +2,10 @@
 
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
 import { Badge } from "@/components/ui/badge"
-import type { ParsedData, Chart, RelationRecord } from "@/lib/types"
-import { ArrowRight } from "lucide-react"
+import type { ParsedData, Chart, EntityRecord, RelationRecord } from "@/lib/types"
+import { ArrowRight, Github } from "lucide-react"
+import { getGithubBridgeRelationType, getGithubSyncState } from "@/lib/github-provenance"
+import { SyncStatePill } from "./github-provenance"
 
 interface RelationGraphProps {
   chart: Chart
@@ -23,7 +25,10 @@ export function RelationGraph({ chart, data }: RelationGraphProps) {
     )
   }
 
-  const relationsByType = relations.reduce(
+  const githubBridgeRelations = relations.filter((relation) => getGithubBridgeRelationType(relation))
+  const standardRelations = relations.filter((relation) => !getGithubBridgeRelationType(relation))
+
+  const relationsByType = standardRelations.reduce(
     (acc, rel) => {
       if (!acc[rel.relationType]) {
         acc[rel.relationType] = []
@@ -41,6 +46,28 @@ export function RelationGraph({ chart, data }: RelationGraphProps) {
         <CardDescription>Connections between chart entities</CardDescription>
       </CardHeader>
       <CardContent className="space-y-6">
+        {githubBridgeRelations.length > 0 && (
+          <div>
+            <h3 className="text-sm font-semibold mb-3 flex items-center gap-2">
+              <Badge className="gap-1 bg-indigo-600 text-white">
+                <Github className="w-3 h-3" />
+                GitHub bridge
+              </Badge>
+              <span className="text-muted-foreground">({githubBridgeRelations.length})</span>
+            </h3>
+            <div className="space-y-2">
+              {githubBridgeRelations.map((rel, idx) => (
+                <RelationRow
+                  key={`github-${idx}`}
+                  relation={rel}
+                  data={data}
+                  bridgeLabel={getGithubBridgeRelationType(rel)}
+                />
+              ))}
+            </div>
+          </div>
+        )}
+
         {Object.entries(relationsByType).map(([type, rels]) => (
           <div key={type}>
             <h3 className="text-sm font-semibold mb-3 flex items-center gap-2">
@@ -48,30 +75,9 @@ export function RelationGraph({ chart, data }: RelationGraphProps) {
               <span className="text-muted-foreground">({rels.length})</span>
             </h3>
             <div className="space-y-2">
-              {rels.map((rel, idx) => {
-                const fromEntity = data.entities.get(rel.from)
-                const toEntity = data.entities.get(rel.to)
-
-                return (
-                  <div key={idx} className="flex items-center gap-3 p-3 bg-muted/30 rounded-lg text-sm">
-                    <div className="flex-1 min-w-0">
-                      <div className="font-mono text-xs text-muted-foreground mb-1">{rel.from}</div>
-                      {fromEntity && (
-                        <div className="text-xs line-clamp-1">
-                          {fromEntity.observations[0] || fromEntity.entityType}
-                        </div>
-                      )}
-                    </div>
-                    <ArrowRight className="w-4 h-4 text-muted-foreground flex-shrink-0" />
-                    <div className="flex-1 min-w-0">
-                      <div className="font-mono text-xs text-muted-foreground mb-1">{rel.to}</div>
-                      {toEntity && (
-                        <div className="text-xs line-clamp-1">{toEntity.observations[0] || toEntity.entityType}</div>
-                      )}
-                    </div>
-                  </div>
-                )
-              })}
+              {rels.map((rel, idx) => (
+                <RelationRow key={idx} relation={rel} data={data} />
+              ))}
             </div>
           </div>
         ))}
@@ -79,3 +85,61 @@ export function RelationGraph({ chart, data }: RelationGraphProps) {
     </Card>
   )
 }
+
+interface RelationRowProps {
+  relation: RelationRecord
+  data: ParsedData
+  bridgeLabel?: string
+}
+
+function RelationRow({ relation, data, bridgeLabel }: RelationRowProps) {
+  const fromEntity = data.entities.get(relation.from)
+  const toEntity = data.entities.get(relation.to)
+  const syncState = getGithubSyncState(relation.metadata)
+
+  return (
+    <div className="flex flex-col gap-2 p-3 bg-muted/30 rounded-lg text-sm sm:flex-row sm:items-center sm:gap-3">
+      <RelationEndpoint name={relation.from} entity={fromEntity} />
+
+      <div className="flex items-center gap-2 text-muted-foreground sm:flex-col">
+        <ArrowRight className="w-4 h-4 flex-shrink-0 rotate-90 sm:rotate-0" />
+        {(bridgeLabel || syncState) && (
+          <div className="flex flex-wrap justify-center gap-1">
+            {bridgeLabel && (
+              <Badge variant="outline" className="text-xs">
+                {bridgeLabel.replace(/_/g, " ")}
+              </Badge>
+            )}
+            <SyncStatePill syncState={syncState} />
+          </div>
+        )}
+      </div>
+
+      <RelationEndpoint name={relation.to} entity={toEntity} />
+    </div>
+  )
+}
+
+function RelationEndpoint({
+  name,
+  entity,
+}: {
+  name: string
+  entity?: EntityRecord
+}) {
+  const isGithubVirtualNode = name.startsWith("gh:")
+
+  return (
+    <div className="flex-1 min-w-0">
+      <div className="font-mono text-xs text-muted-foreground mb-1 break-all">{name}</div>
+      {entity ? (
+        <div className="text-xs line-clamp-1">{entity.observations[0] || entity.entityType}</div>
+      ) : isGithubVirtualNode ? (
+        <Badge variant="outline" className="gap-1 text-xs">
+          <Github className="w-3 h-3" />
+          GitHub issue
+        </Badge>
+      ) : null}
+    </div>
+  )
+}

package/dist/cli.js

@@ -67,7 +67,7 @@ function loadConfig(args) {
     if (args['port'] || args['p']) {
         config.port = args['port'] || args['p'];
     }
-    if (args['no-open']) {
+    if (args['no-open'] || args.open === false) {
         config.noOpen = true;
     }
     if (args['live']) {
@@ -208,11 +208,13 @@ EXAMPLES:
                 spawn(openCmd, [url], { detached: true, stdio: 'ignore' }).unref();
             }, 4000);
         }
-        process.on('SIGINT', () => {
+        const shutdownDocker = () => {
             console.log('\n👋 Shutting down visualizer...');
             dockerProcess.kill();
             process.exit(0);
-        });
+        };
+        process.on('SIGINT', shutdownDocker);
+        process.on('SIGTERM', shutdownDocker);
         dockerProcess.on('exit', (code) => { process.exit(code || 0); });
         return;
     }
@@ -253,11 +255,13 @@ EXAMPLES:
         }, 3000);
     }
     // Handle shutdown
-    process.on('SIGINT', () => {
+    const shutdownLocal = () => {
         console.log('\n👋 Shutting down visualizer...');
         nextProcess.kill();
         process.exit(0);
-    });
+    };
+    process.on('SIGINT', shutdownLocal);
+    process.on('SIGTERM', shutdownLocal);
     nextProcess.on('exit', (code) => {
         process.exit(code || 0);
     });

package/docker-build-push.sh

@@ -0,0 +1,20 @@
+#!/bin/bash
+# Build and push jgwill/coaia:visualizer to Docker Hub
+# Usage: ./docker-build-push.sh [tag]
+# Requires: docker login jgwill (or DOCKERHUB_TOKEN env)
+
+set -e
+
+TAG="${1:-visualizer}"
+IMAGE="jgwill/coaia:$TAG"
+
+echo "🐳 Building $IMAGE..."
+docker build -t "$IMAGE" .
+
+echo "📤 Pushing $IMAGE..."
+docker push "$IMAGE"
+
+echo "✅ Done: $IMAGE"
+echo ""
+echo "Run with:"
+echo "  docker run --rm -p 4321:4321 -v /abs/path/to/file.jsonl:/data/memory.jsonl $IMAGE"

package/docker-entrypoint.sh

@@ -0,0 +1,27 @@
+#!/bin/sh
+set -e
+
+# COAIA Visualizer Docker Entrypoint
+# Serves the pre-built Next.js app with the user-supplied JSONL file.
+#
+# The JSONL file must be mounted into /data/ in the container.
+# COAIAV_MEMORY_PATH defaults to /data/memory.jsonl but can be overridden.
+
+MEMORY_PATH="${COAIAV_MEMORY_PATH:-/data/memory.jsonl}"
+PORT="${PORT:-4321}"
+
+# Validate that the memory file exists (warn but don't block — user may mount it later)
+if [ ! -f "$MEMORY_PATH" ]; then
+  echo "⚠️  Warning: memory file not found at $MEMORY_PATH"
+  echo "   Mount your JSONL file with: -v /your/file.jsonl:$MEMORY_PATH"
+fi
+
+echo "🎨 COAIA Visualizer"
+echo "📁 Memory file: $MEMORY_PATH"
+echo "🌐 http://localhost:$PORT"
+echo ""
+
+export COAIAV_MEMORY_PATH="$MEMORY_PATH"
+export PORT="$PORT"
+
+exec node_modules/.bin/next start -p "$PORT"