feat: the social graph atlas — exploration 0419

.changeset/social-graph-atlas-0419.md

@@ -0,0 +1,22 @@
+---
+'@xnetjs/sqlite': minor
+'@xnetjs/react': minor
+---
+
+Imported social content is now actually in the full-text index, and a saved
+lens can be projected onto a canvas with its relationships.
+
+`extractSearchableContent` read `content`, `description`, `body`, `name` and
+`note` — but not `searchText`, the property imported social records
+denormalize their full text into precisely so it can be searched. Every
+imported post, comment and video transcript was therefore absent from
+`nodes_fts` while the pipeline reported it as indexed: search returned a clean
+empty result rather than an error. `searchText` is now indexed, with
+`textPreview` as the fallback for records that carry no full text. **Existing
+databases need `rebuildFTS()` to pick up already-imported rows** — new writes
+are indexed correctly from here on.
+
+`SavedViewVisualCanvasProjectionRequest` gains an `edges` array (filtered to
+relationships whose endpoints both survived the projection cap), and the new
+`SavedViewCanvasProjectionEdge` type is exported. This is what lets a consumer
+lay a saved view out as a graph rather than an unconnected grid of cards.

apps/electron/src/renderer/components/CanvasView.tsx

@@ -11,6 +11,7 @@
   Rect,
   ShapeType
 } from '@xnetjs/canvas'
+import type { SocialCanvasProjectionPlan } from '@xnetjs/social/projection'
 import {
   Canvas,
   getCanvasObjectsMap,
@@ -132,6 +133,7 @@
   createMindMap: () => boolean
   createPlanningTemplate: (templateId: CanvasPlanningTemplateId) => boolean
   createQueryFrameFromSavedView: (input: SavedViewCanvasQueryFrameInput) => boolean
+  applySocialCanvasProjection: (plan: SocialCanvasProjectionPlan) => boolean
   refreshSelectedQueryFrame: () => boolean
   createExternalReference: (url?: string) => boolean
   createMediaFile: () => boolean
@@ -273,7 +275,8 @@
     selectedQueryFrameNode,
     selectedQueryFrameDefinition,
     createQueryFrameFromSavedView,
-    refreshSelectedQueryFrame
+    refreshSelectedQueryFrame,
+    applySocialCanvasProjection
   } = useCanvasQueryFrames({
     doc,
     sceneRevision,
@@ -282,6 +285,13 @@
     onUndoBoundary: recordSceneUndoBoundary
   })
 
+  // The imperative handle reports success as a boolean; the hook returns the
+  // richer result for callers that want the placed/omitted counts.
+  const applySocialCanvasProjectionHandle = useCallback(
+    (plan: SocialCanvasProjectionPlan): boolean => Boolean(applySocialCanvasProjection(plan)),
+    [applySocialCanvasProjection]
+  )
+
   const selectedDatabaseSourceId =
     selectedCanvasObject?.displayType === 'database' ? (selectedCanvasObject.sourceId ?? '') : ''
   const undoLadder = useCanvasUndoLadder({
@@ -396,19 +406,19 @@
       canvasRef.current.fitToRect(getNodeRect(targetNode), 140)
       return snapshot
     },
     [doc]
   )
 
   const restoreViewport = useCallback((snapshot: ViewportSnapshot) => {
     lastViewportSnapshotRef.current = snapshot
     canvasRef.current?.setViewportSnapshot(snapshot)
   }, [])
 
   const clearCanvasSelection = useCallback(() => {
     closeSelectionPanel()
     closePeekSurface()
     canvasRef.current?.clearSelection()
   }, [closePeekSurface, closeSelectionPanel])
 
   const zoomCanvas = useCallback((direction: 'out' | 'in'): boolean => {
     const handle = canvasRef.current
@@ -432,7 +442,7 @@
     lastViewportSnapshotRef.current = nextSnapshot
     handle.setViewportSnapshot(nextSnapshot)
     return true
   }, [])
 
   const fitCanvasContent = useCallback((): boolean => {
     const handle = canvasRef.current
@@ -443,7 +453,7 @@
     handle.fitToContent(50)
     lastViewportSnapshotRef.current = handle.getViewportSnapshot()
     return true
   }, [])
 
   const resetCanvasView = useCallback((): boolean => {
     const handle = canvasRef.current
@@ -454,7 +464,7 @@
     handle.resetView()
     lastViewportSnapshotRef.current = handle.getViewportSnapshot()
     return true
   }, [])
 
   const fitSelection = useCallback((): boolean => {
     if (selectedNodes.length === 0) {
@@ -473,11 +483,11 @@
 
     canvasRef.current?.fitToRect(selectionBounds, 140)
     return true
   }, [selectedNodes])
 
   const toggleSelectionLock = useCallback((): boolean => {
     return canvasRef.current?.toggleSelectionLock() ?? false
   }, [])
 
   const alignSelection = useCallback(
     (alignment: Extract<CanvasAlignment, 'left' | 'right' | 'top' | 'bottom'>): boolean => {
@@ -784,6 +794,7 @@
       createMindMap,
       createPlanningTemplate,
       createQueryFrameFromSavedView,
+      applySocialCanvasProjection: applySocialCanvasProjectionHandle,
       refreshSelectedQueryFrame,
       createExternalReference,
       createMediaFile,
@@ -804,6 +815,7 @@
       createMindMap,
       createPlanningTemplate,
       createQueryFrameFromSavedView,
+      applySocialCanvasProjectionHandle,
       createMediaFile,
       createShape,
       connectSelection,

apps/electron/src/renderer/components/DataWorkspaceView.tsx

@@ -5,9 +5,14 @@
  * and inserting saved lenses onto the canvas as frames.
  */
 import { upsertSocialImportJobProgress } from '@xnetjs/social/import/core'
-import { useDataWorkspace, DataWorkspaceBody, type SavedViewCanvasFrameInput } from '@xnetjs/views'
+import {
+  useDataWorkspace,
+  useSocialFeedEnrichment,
+  DataWorkspaceBody,
+  type SavedViewCanvasFrameInput
+} from '@xnetjs/views'
 import { Database, Import, Loader2, X } from 'lucide-react'
-import React, { useEffect } from 'react'
+import React, { useEffect, useMemo } from 'react'
 
 export type { SavedViewCanvasFrameInput }
 
@@ -25,6 +30,8 @@ export function DataWorkspaceView({
     onInsertSavedLensAsCanvasFrame
   })
   const { seeding, handleSeedWorkspace, refreshSocialImportJobs } = workspace
+  const feedEnrichment = useSocialFeedEnrichment()
+  const savedViewRunnerProps = useMemo(() => ({ feedEnrichment }), [feedEnrichment])
 
   // Bridge main-process commit jobs into the renderer's import-job store so
   // progress started from the main process shows up in the shared panel.
@@ -84,7 +91,7 @@ export function DataWorkspaceView({
             </p>
           </div>
 
-          <DataWorkspaceBody workspace={workspace} />
+          <DataWorkspaceBody workspace={workspace} savedViewRunnerProps={savedViewRunnerProps} />
         </div>
       </div>
     </div>

apps/electron/src/renderer/shell/use-document-shell.ts

@@ -385,15 +385,18 @@ export function useDocumentShell(): DocumentShell {
 
   const handleInsertSavedLensAsCanvasFrame = useCallback(
     (view: SavedViewCanvasFrameInput) => {
-      const inserted =
-        canvasViewRef.current?.createQueryFrameFromSavedView({
-          viewId: view.id,
-          title: view.title ?? 'Saved lens',
-          descriptorJson: view.descriptor ?? null
-        }) ?? false
+      // A projection places the cards and the connections between them; a
+      // plain lens becomes a live query frame instead (0419).
+      const inserted = view.projection
+        ? (canvasViewRef.current?.applySocialCanvasProjection(view.projection) ?? false)
+        : (canvasViewRef.current?.createQueryFrameFromSavedView({
+            viewId: view.id,
+            title: view.title ?? 'Saved lens',
+            descriptorJson: view.descriptor ?? null
+          }) ?? false)
 
       if (!inserted) {
-        console.error('Failed to insert saved lens as a canvas query frame', view.id)
+        console.error('Failed to place saved lens on the canvas', view.id)
         return
       }
 

apps/web/src/components/CanvasView.tsx

@@ -41,6 +41,7 @@ import {
   isPeekableCanvasDisplayType,
   shouldActivateDatabasePreviewSurface,
   shouldActivateInlinePageSurface,
+  takePendingCanvasLens,
   useCanvasCommands,
   useCanvasQueryFrames,
   useCanvasSourceReferences,
@@ -279,7 +280,9 @@ export function CanvasView({ docId }: CanvasViewProps): JSX.Element {
     queryFrameTargets,
     manualQueryFrameRefreshRequests,
     selectedQueryFrameDefinition,
-    refreshSelectedQueryFrame
+    refreshSelectedQueryFrame,
+    createQueryFrameFromSavedView,
+    applySocialCanvasProjection
   } = useCanvasQueryFrames({
     doc,
     sceneRevision,
@@ -288,6 +291,34 @@ export function CanvasView({ docId }: CanvasViewProps): JSX.Element {
     onUndoBoundary: recordSceneUndoBoundary
   })
 
+  // A lens sent here from the Data Workspace (0419). The workspace parks the
+  // request and navigates; this claims it once the doc is live. Claiming is
+  // one-shot, so revisiting the canvas does not re-insert the frame.
+  useEffect(() => {
+    if (!doc) return
+
+    const pending = takePendingCanvasLens(docId)
+    if (!pending) return
+
+    // A projection places the cards and their connections; without one the
+    // request is for a live lens frame instead.
+    if (pending.projection) {
+      if (!applySocialCanvasProjection(pending.projection)) {
+        console.error('Failed to project saved lens onto the canvas', pending.viewId)
+      }
+      return
+    }
+
+    const inserted = createQueryFrameFromSavedView({
+      viewId: pending.viewId,
+      title: pending.title,
+      descriptorJson: pending.descriptorJson
+    })
+    if (!inserted) {
+      console.error('Failed to insert saved lens as a canvas query frame', pending.viewId)
+    }
+  }, [applySocialCanvasProjection, createQueryFrameFromSavedView, doc, docId])
+
   // Peek (0277 E4): modal preview of the selected card's source without
   // leaving the board; inline editing activates on zoomed-in selection.
   const { peekState, peekedObject, openPeek, closePeekSurface } = useCanvasPeek({

apps/web/src/components/DataWorkspaceView.tsx

@@ -3,11 +3,19 @@
  * (@xnetjs/views, exploration 0276). Web-specific concerns: OPFS store-backed
  * seeding, social feed enrichment, and the moderation render gate.
  */
+import { useNavigate } from '@tanstack/react-router'
+import { useIdentity } from '@xnetjs/react'
 import { useNodeStore } from '@xnetjs/react/internal'
-import { useDataWorkspace, DataWorkspaceBody } from '@xnetjs/views'
+import {
+  useDataWorkspace,
+  DataWorkspaceBody,
+  stashPendingCanvasLens,
+  useSocialFeedEnrichment,
+  type SavedViewCanvasFrameInput
+} from '@xnetjs/views'
 import { Database, Import, Loader2 } from 'lucide-react'
-import { useMemo, type ReactNode } from 'react'
-import { useSocialFeedEnrichment } from '../hooks/useSocialFeedEnrichment'
+import { useCallback, useMemo, type ReactNode } from 'react'
+import { deskIdFor } from '../lib/desk'
 import { ModeratedMedia } from './ModeratedMedia'
 
 /**
@@ -22,10 +30,41 @@ const gateVisualItem = (nodeId: string, content: ReactNode): ReactNode => (
 export function DataWorkspaceView(): JSX.Element {
   const { store, isReady: storeReady } = useNodeStore()
   const feedEnrichment = useSocialFeedEnrichment()
+  const navigate = useNavigate()
+  const { identity } = useIdentity()
+  const did = identity?.did
+
+  /**
+   * Send a saved lens to the Desk as a live query frame.
+   *
+   * The Desk is the right target because its id is derived from the identity
+   * and visiting it provisions it — so this needs no "which canvas?" prompt
+   * and no separate create. The request is parked, then claimed by the canvas
+   * once it mounts.
+   */
+  const handleInsertSavedLensAsCanvasFrame = useCallback(
+    (view: SavedViewCanvasFrameInput) => {
+      if (!did) return
+
+      const canvasId = deskIdFor(did)
+      stashPendingCanvasLens({
+        canvasId,
+        viewId: view.id,
+        title: view.title ?? 'Saved lens',
+        descriptorJson: view.descriptor ?? null,
+        ...(view.projection ? { projection: view.projection } : {})
+      })
+      void navigate({ to: '/canvas/$canvasId', params: { canvasId } })
+    },
+    [did, navigate]
+  )
 
   const workspace = useDataWorkspace({
     seedReady: Boolean(store && storeReady),
-    getExistingNode: (id) => (store ? Promise.resolve(store.get(id)) : Promise.resolve(undefined))
+    getExistingNode: (id) => (store ? Promise.resolve(store.get(id)) : Promise.resolve(undefined)),
+    // Without an identity there is no Desk to target, so the canvas actions
+    // stay hidden rather than failing when pressed.
+    ...(did ? { onInsertSavedLensAsCanvasFrame: handleInsertSavedLensAsCanvasFrame } : {})
   })
   const { seeding, seedReady, handleSeedWorkspace } = workspace
 

apps/web/src/components/SavedViewTab.tsx

@@ -5,8 +5,8 @@
 import { validateSavedViewDescriptor, type SavedViewDescriptor } from '@xnetjs/data'
 import { SavedViewSchema } from '@xnetjs/data'
 import { SavedViewRunner, useQuery } from '@xnetjs/react'
+import { useSocialFeedEnrichment } from '@xnetjs/views'
 import { useMemo } from 'react'
-import { useSocialFeedEnrichment } from '../hooks/useSocialFeedEnrichment'
 import { WORKBENCH_SAVED_VIEW_REGISTRY } from '../lib/saved-view-registry'
 import { usePublishTitle } from '../workbench/route-title'
 

apps/web/src/lib/social-import-worker-client.ts

@@ -38,6 +38,7 @@ export type BrowserSocialImportStageInput = {
   manifest: ArchiveManifest
   buckets: string[]
   includeSensitive: boolean
+  fetchTranscripts?: boolean
   importedAt?: string
 }
 
@@ -76,6 +77,7 @@ type MainThreadStagedResult = {
   manifest: ArchiveManifest
   buckets: string[]
   includeSensitive: boolean
+  fetchTranscripts: boolean
   importedAt: string
   result: SocialImportNodeDraftStreamResult
   streams: Map<string, MainThreadStageDraftStream>
@@ -316,6 +318,7 @@ async function stageOnMainThread(
     readTextEntry,
     buckets: input.buckets,
     includeSensitive: input.includeSensitive,
+    fetchTranscripts: input.fetchTranscripts === true,
     importedAt,
     includeSourceRecords: true,
     onComplete: (result) => {
@@ -331,6 +334,7 @@ async function stageOnMainThread(
     manifest: input.manifest,
     buckets: input.buckets,
     includeSensitive: input.includeSensitive,
+    fetchTranscripts: input.fetchTranscripts === true,
     importedAt,
     result,
     streams: new Map()
@@ -376,6 +380,7 @@ export async function stageBrowserSocialArchive(
         manifest: input.manifest,
         buckets: input.buckets,
         includeSensitive: input.includeSensitive,
+        fetchTranscripts: input.fetchTranscripts === true,
         importedAt: input.importedAt
       },
       isStageResponse
@@ -496,6 +501,7 @@ async function getMainThreadStageDraftStream(
       readTextEntry,
       buckets: stagedResult.buckets,
       includeSensitive: stagedResult.includeSensitive,
+      fetchTranscripts: stagedResult.fetchTranscripts,
       importedAt: stagedResult.importedAt,
       includeSourceRecords
     }),

apps/web/src/lib/social-import-worker-protocol.ts

@@ -46,6 +46,8 @@ export type SocialImportWorkerStageRequest = {
   manifest: ArchiveManifest
   buckets: string[]
   includeSensitive: boolean
+  /** Fetch video transcripts for this run (0419). */
+  fetchTranscripts?: boolean
   importedAt?: string
 }
 

apps/web/src/routes/social-import.tsx

@@ -75,6 +75,9 @@ function SocialImportPage(): React.ReactElement {
   const [selectedBuckets, setSelectedBuckets] = useState<string[]>([])
   const [includeSensitive, setIncludeSensitive] = useState(false)
   const [includeSourceRecords, setIncludeSourceRecords] = useState(false)
+  // Transcript fetching is per-run and off by default (0419): the decision is
+  // about this archive, not a standing preference.
+  const [fetchTranscripts, setFetchTranscripts] = useState(false)
   const [stageResult, setStageResult] = useState<BrowserSocialImportStageResult | null>(null)
   const [status, setStatus] = useState<ImportStatus>('idle')
   const [error, setError] = useState<string | null>(null)
@@ -169,15 +172,16 @@ function SocialImportPage(): React.ReactElement {
         file: archive.file,
         manifest: archive.manifest,
         buckets: selectedBuckets,
-        includeSensitive
+        includeSensitive,
+        fetchTranscripts
       })
       setStageResult(result)
       setStatus('staged')
     } catch (err) {
       setStatus('picked')
       setError(toErrorMessage(err))
     }
-  }, [archive, includeSensitive, selectedBuckets])
+  }, [archive, fetchTranscripts, includeSensitive, selectedBuckets])
 
   const handleCommit = useCallback(async () => {
     if (!archive || !stageResult || !store || !storeReady) return
@@ -678,6 +682,26 @@ function SocialImportPage(): React.ReactElement {
                   </div>
                 </div>
               </label>
+              <label className="flex items-start gap-3 rounded-md border border-border p-3">
+                <input
+                  type="checkbox"
+                  className="mt-1"
+                  checked={fetchTranscripts}
+                  onChange={(event) => {
+                    setFetchTranscripts(event.currentTarget.checked)
+                    setStageResult(null)
+                    setCommitSummary(null)
+                    setCommitProgress(null)
+                  }}
+                />
+                <div>
+                  <div className="text-sm font-medium">Fetch video transcripts</div>
+                  <div className="mt-1 text-xs text-muted-foreground">
+                    Looks up captions for videos this archive brings in, from this device, at a slow
+                    trickle. Videos without captions are recorded as such and never retried.
+                  </div>
+                </div>
+              </label>
             </section>
 
             <section className="space-y-3">