feat: flexible intake — deferred variables + prepared sessions (#103)

* feat: flexible intake — deferred variables + prepared sessions

Remove blocking intake form modal. Variables are now filled inline during
flow execution or pre-filled via prepared sessions. Adds PATCH /sessions/{id}/variables
endpoint, POST /sessions/prepare for session pre-staging, inline variable prompts
in StepDetail, editable Session Variables panel, and "Prepared for You" dashboard section.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* fix: pass treeData directly to startSession to avoid stale state

setTree(treeData) hasn't committed when startSession runs immediately
after, so tree is still null and getStepsFromTree returns []. This
caused the step detail area to render empty on new session start.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* feat: wire PrepareSessionModal entry point in Flow Library

Add "Prepare session" button (clipboard icon) to grid, list, and table
views for procedural/maintenance flows. Clicking fetches tree intake
fields and account members, then opens PrepareSessionModal.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit was merged in pull request #103.
This commit is contained in:
chihlasm
2026-03-10 09:49:51 -04:00
committed by GitHub
parent 4727106141
commit ccd06c9ed4
25 changed files with 1214 additions and 102 deletions

View File

@@ -1,5 +1,5 @@
import { Link } from 'react-router-dom'
import { Pencil, Globe, Lock, Trash2, GitBranch, FileText, Wrench, Star, Download } from 'lucide-react'
import { Pencil, Globe, Lock, Trash2, GitBranch, FileText, Wrench, Star, Download, ClipboardList } from 'lucide-react'
import type { TreeListItem } from '@/types'
import { TagBadges } from '@/components/common/TagBadges'
import { StaggerList } from '@/components/common/StaggerList'
@@ -10,6 +10,7 @@ import { getTreeEditorPath } from '@/lib/routing'
interface TreeGridViewProps {
trees: TreeListItem[]
onStartSession: (treeId: string, treeType?: string) => void
onPrepareSession?: (tree: TreeListItem) => void
onTagClick: (tag: string) => void
onFolderCreated: (parentId?: string | null) => void
onDeleteTree: (tree: TreeListItem) => void
@@ -23,6 +24,7 @@ interface TreeGridViewProps {
export function TreeGridView({
trees,
onStartSession,
onPrepareSession,
onTagClick,
onDeleteTree,
onForkTree,
@@ -169,6 +171,20 @@ export function TreeGridView({
<Trash2 className="h-4 w-4" />
</button>
)}
{onPrepareSession && tree.tree_type !== 'troubleshooting' && (
<button
type="button"
onClick={() => onPrepareSession(tree)}
className={cn(
'rounded-md border border-border p-2 text-muted-foreground',
'hover:bg-cyan-500/10 hover:text-cyan-400 hover:border-cyan-500/30'
)}
title="Prepare session for engineer"
aria-label="Prepare session"
>
<ClipboardList className="h-4 w-4" />
</button>
)}
<button
type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)}

View File

@@ -1,5 +1,5 @@
import { Link } from 'react-router-dom'
import { Pencil, Globe, Lock, GitBranch, FileText, Trash2, Wrench, Star, Download } from 'lucide-react'
import { Pencil, Globe, Lock, GitBranch, FileText, Trash2, Wrench, Star, Download, ClipboardList } from 'lucide-react'
import type { TreeListItem } from '@/types'
import { TagBadges } from '@/components/common/TagBadges'
import { cn } from '@/lib/utils'
@@ -9,6 +9,7 @@ import { getTreeEditorPath } from '@/lib/routing'
interface TreeListViewProps {
trees: TreeListItem[]
onStartSession: (treeId: string, treeType?: string) => void
onPrepareSession?: (tree: TreeListItem) => void
onTagClick: (tag: string) => void
onFolderCreated: (parentId?: string | null) => void
onDeleteTree: (tree: TreeListItem) => void
@@ -22,6 +23,7 @@ interface TreeListViewProps {
export function TreeListView({
trees,
onStartSession,
onPrepareSession,
onTagClick,
onDeleteTree,
onForkTree,
@@ -172,6 +174,20 @@ export function TreeListView({
</button>
</>
)}
{onPrepareSession && tree.tree_type !== 'troubleshooting' && (
<button
type="button"
onClick={() => onPrepareSession(tree)}
className={cn(
'rounded-md border border-border p-1.5 text-muted-foreground',
'hover:bg-cyan-500/10 hover:text-cyan-400 hover:border-cyan-500/30'
)}
title="Prepare session for engineer"
aria-label="Prepare session"
>
<ClipboardList className="h-4 w-4" />
</button>
)}
<button
type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)}

View File

@@ -1,6 +1,6 @@
import { useState } from 'react'
import { Link } from 'react-router-dom'
import { Pencil, Globe, Lock, ChevronUp, ChevronDown, GitBranch, FileText, Trash2, Wrench, Star, Download } from 'lucide-react'
import { Pencil, Globe, Lock, ChevronUp, ChevronDown, GitBranch, FileText, Trash2, Wrench, Star, Download, ClipboardList } from 'lucide-react'
import type { TreeListItem } from '@/types'
import { TagBadges } from '@/components/common/TagBadges'
import { cn } from '@/lib/utils'
@@ -10,6 +10,7 @@ import { getTreeEditorPath } from '@/lib/routing'
interface TreeTableViewProps {
trees: TreeListItem[]
onStartSession: (treeId: string, treeType?: string) => void
onPrepareSession?: (tree: TreeListItem) => void
onTagClick: (tag: string) => void
onFolderCreated: (parentId?: string | null) => void
onDeleteTree: (tree: TreeListItem) => void
@@ -26,6 +27,7 @@ type SortColumn = 'name' | 'category' | 'version' | 'usage' | 'updated'
export function TreeTableView({
trees,
onStartSession,
onPrepareSession,
onTagClick,
onDeleteTree,
onSortChange,
@@ -283,6 +285,20 @@ export function TreeTableView({
</button>
</>
)}
{onPrepareSession && tree.tree_type !== 'troubleshooting' && (
<button
type="button"
onClick={() => onPrepareSession(tree)}
className={cn(
'rounded-md border border-border p-1.5 text-muted-foreground',
'hover:bg-cyan-500/10 hover:text-cyan-400 hover:border-cyan-500/30'
)}
title="Prepare session for engineer"
aria-label="Prepare session"
>
<ClipboardList className="h-3.5 w-3.5" />
</button>
)}
<button
type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)}