feat: Session Lineage — related plans from the same agent session

packages/app/src/client/App.tsx

@@ -302,7 +302,12 @@ function Dashboard() {
           <OfflineView />
         ) : selectedPlan ? (
           <div className="overflow-auto main-scroll" style={{ height: '100%' }}>
-            <PlanViewer plan={selectedPlan} outlineHidden={outlineHidden} />
+            <PlanViewer
+              plan={selectedPlan}
+              allPlans={plans}
+              onSelectRelatedPlan={setSelectedPlan}
+              outlineHidden={outlineHidden}
+            />
           </div>
         ) : (
           <div className="overflow-auto main-scroll" style={{ height: '100%' }}>

packages/ee/src/App.tsx

@@ -854,6 +854,8 @@ function CloudPlanReviewWorkspace({
   actionToolbarExtra,
   outlineHidden,
   chartHidden,
+  allPlans,
+  onSelectRelatedPlan,
   onEdit,
   onHistory,
   onShare,
@@ -872,6 +874,8 @@ function CloudPlanReviewWorkspace({
   actionToolbarExtra?: ReactNode;
   outlineHidden?: boolean;
   chartHidden?: boolean;
+  allPlans?: readonly Plan[];
+  onSelectRelatedPlan?: (plan: Plan) => void;
   onEdit: () => void;
   onHistory: () => void;
   onShare: () => void;
@@ -985,6 +989,8 @@ function CloudPlanReviewWorkspace({
         <div className="plannotator-review-document">
           <PlanViewer
             plan={plan}
+            allPlans={allPlans}
+            onSelectRelatedPlan={onSelectRelatedPlan}
             onEdit={onEdit}
             onChartWideChange={onChartWideChange}
             onToggleChart={onToggleChart}
@@ -1131,6 +1137,8 @@ function DashboardMain({
   agents,
   totalPlans,
   selectedPlan,
+  allPlans,
+  onSelectRelatedPlan,
   onClose,
   onSaved,
   onCreated,
@@ -1160,6 +1168,8 @@ function DashboardMain({
   agents: AgentStats[];
   totalPlans: number;
   selectedPlan: Plan | undefined;
+  allPlans: readonly Plan[];
+  onSelectRelatedPlan: (plan: Plan) => void;
   onClose: () => void;
   onSaved: () => void;
   onCreated: (plan: Plan) => void;
@@ -1295,6 +1305,8 @@ function DashboardMain({
         <div className="main-scroll overflow-auto" style={{ minWidth: 0 }}>
           <PlanViewer
             plan={selectedPlan}
+            allPlans={allPlans}
+            onSelectRelatedPlan={onSelectRelatedPlan}
             mode="split"
             onEdit={onEdit}
             onChartWideChange={onChartWideChange}
@@ -1327,6 +1339,8 @@ function DashboardMain({
         <div className="overflow-auto border-l border-border" style={{ minWidth: 0 }}>
           <PlanViewer
             plan={splitPlan}
+            allPlans={allPlans}
+            onSelectRelatedPlan={onSelectRelatedPlan}
             mode="split"
             onChartWideChange={onChartWideChange}
             onToggleChart={onToggleChart}
@@ -1447,6 +1461,8 @@ function DashboardMain({
                 actionToolbarExtra={actionToolbarExtra}
                 outlineHidden={outlineHidden}
                 chartHidden={chartHidden}
+                allPlans={allPlans}
+                onSelectRelatedPlan={onSelectRelatedPlan}
                 onEdit={onEdit}
                 onHistory={onHistory}
                 onShare={onShare}
@@ -1456,6 +1472,8 @@ function DashboardMain({
             ) : (
               <PlanViewer
                 plan={selectedPlan}
+                allPlans={allPlans}
+                onSelectRelatedPlan={onSelectRelatedPlan}
                 onEdit={onEdit}
                 onChartWideChange={onChartWideChange}
                 onToggleChart={onToggleChart}
@@ -2411,6 +2429,8 @@ function Dashboard({ autoMode }: { autoMode: DashboardMode }) {
         agents={agents}
         totalPlans={totalPlans}
         selectedPlan={selectedPlan}
+        allPlans={plans}
+        onSelectRelatedPlan={(plan) => startViewTransition(() => setSelectedPlan(plan))}
         onClose={() => startViewTransition(() => setActivePanel(null))}
         onSaved={handleSaved}
         onCreated={(plan) => {

packages/web/src/client/components/PlanList.tsx

@@ -5,6 +5,7 @@ import { getAgentLabel } from '../lib/agent-colors.ts';
 import type { Plan } from '../lib/api.ts';
 import { isCustomDirPlan } from '../lib/custom-plan-tree.ts';
 import type { FolderState } from '../lib/plan-folders.ts';
+import { plansWithSessionSiblings } from '../lib/plan-lineage.ts';
 import type { PlanState } from '../lib/plan-state.ts';
 import { AgentIcon } from './AgentIcon.tsx';
 import { CustomDirTree } from './CustomDirTree.tsx';
@@ -25,6 +26,7 @@ function PlanRow({
   plan,
   selected,
   unseen,
+  hasSessionSiblings,
   onClick,
   isSplit,
   onContextMenu,
@@ -37,6 +39,7 @@ function PlanRow({
   plan: Plan;
   selected: boolean;
   unseen: boolean;
+  hasSessionSiblings?: boolean;
   onClick: () => void;
   isSplit?: boolean;
   onContextMenu?: (e: React.MouseEvent) => void;
@@ -103,6 +106,14 @@ function PlanRow({
         <span className="sidebar-plan-meta-label">{getAgentLabel(plan.agent)}</span>
         <span aria-hidden="true">·</span>
         <span>{timeAgo(plan.updatedAt)}</span>
+        {hasSessionSiblings && (
+          <>
+            <span aria-hidden="true">·</span>
+            <span className="sidebar-plan-session" title="Shares a session with other plans">
+              session
+            </span>
+          </>
+        )}
       </div>
     </button>
   );
@@ -194,6 +205,7 @@ export function PlanList(props: PlanListProps) {
   const [renamingPlanId, setRenamingPlanId] = useState<string | null>(null);
   const [renameValue, setRenameValue] = useState('');
   const lastAutoSeenKeyRef = useRef<string | null>(null);
+  const sessionSiblingIds = useMemo(() => plansWithSessionSiblings(plans), [plans]);
 
   useEffect(() => {
     if (!contextMenu) return;
@@ -323,6 +335,7 @@ export function PlanList(props: PlanListProps) {
                 plan={plan}
                 selected={plan.id === selectedId}
                 unseen={isPro && planState.isUnseen(plan.id, plan.updatedAt)}
+                hasSessionSiblings={sessionSiblingIds.has(plan.id)}
                 onClick={() => handleClick(plan)}
                 isSplit={isPro && plan.id === splitPlanId}
                 onContextMenu={(e) => handleContextMenu(e, plan)}
@@ -358,6 +371,7 @@ export function PlanList(props: PlanListProps) {
               plan={plan}
               selected={plan.id === selectedId}
               unseen={planState.isUnseen(plan.id, plan.updatedAt)}
+              hasSessionSiblings={sessionSiblingIds.has(plan.id)}
               onClick={() => handleClick(plan)}
               isSplit={plan.id === splitPlanId}
               onContextMenu={(e) => handleContextMenu(e, plan)}
@@ -394,6 +408,7 @@ export function PlanList(props: PlanListProps) {
               plan={plan}
               selected={plan.id === selectedId}
               unseen
+              hasSessionSiblings={sessionSiblingIds.has(plan.id)}
               onClick={() => handleClick(plan)}
               isSplit={plan.id === splitPlanId}
               onContextMenu={(e) => handleContextMenu(e, plan)}
@@ -417,6 +432,7 @@ export function PlanList(props: PlanListProps) {
               plan={plan}
               selected={plan.id === selectedId}
               unseen={isPro && planState.isUnseen(plan.id, plan.updatedAt)}
+              hasSessionSiblings={sessionSiblingIds.has(plan.id)}
               onClick={() => handleClick(plan)}
               isSplit={isPro && plan.id === splitPlanId}
               onContextMenu={(e) => handleContextMenu(e, plan)}
@@ -435,6 +451,7 @@ export function PlanList(props: PlanListProps) {
             plan={plan}
             selected={plan.id === selectedId}
             unseen={isPro && planState.isUnseen(plan.id, plan.updatedAt)}
+            hasSessionSiblings={sessionSiblingIds.has(plan.id)}
             onClick={() => handleClick(plan)}
             isSplit={isPro && plan.id === splitPlanId}
             onContextMenu={isPro || folderState ? (e) => handleContextMenu(e, plan) : undefined}

packages/web/src/client/components/PlanViewer.tsx

@@ -20,6 +20,12 @@ import {
 } from '../lib/annotations.ts';
 import type { Plan } from '../lib/api.ts';
 import { buildPlanOutline } from '../lib/extract-headings.ts';
+import {
+  getRelatedPlans,
+  type LineageConfidence,
+  type LineageRelation,
+  type RelatedPlanEntry,
+} from '../lib/plan-lineage.ts';
 import { extractSyncOrigin, formatSyncOriginLabel } from '../lib/sync-origin.ts';
 import { AgentIcon } from './AgentIcon.tsx';
 import { ExitFullscreenIcon, FullscreenIcon } from './FullscreenIcons.tsx';
@@ -154,8 +160,85 @@ function intersectsNestedBlockedSelection(root: HTMLElement, range: Range): bool
   return false;
 }
 
+function lineageSectionTitle(confidence: LineageConfidence | undefined): string {
+  if (confidence === 'workspace-fallback') return 'Nearby in workspace';
+  if (confidence === 'thread') return 'Session thread';
+  return 'Same session';
+}
+
+function lineageRelationLabel(relation: LineageRelation): string | undefined {
+  if (relation === 'parent') return 'Parent';
+  if (relation === 'child') return 'Child';
+  if (relation === 'self') return 'Current';
+  return undefined;
+}
+
+function PlanLineageSection({
+  entries,
+  confidence,
+  onSelectRelatedPlan,
+}: {
+  entries: RelatedPlanEntry[];
+  confidence: LineageConfidence | undefined;
+  onSelectRelatedPlan?: (plan: Plan) => void;
+}) {
+  return (
+    <section className="plan-lineage" aria-label={lineageSectionTitle(confidence)}>
+      <div className="plan-lineage-heading">
+        <span className="plan-lineage-title">{lineageSectionTitle(confidence)}</span>
+        {confidence === 'workspace-fallback' && (
+          <span className="plan-lineage-hint">Approximate match</span>
+        )}
+      </div>
+      <ol className="plan-lineage-list">
+        {entries.map((entry) => {
+          const relationLabel = lineageRelationLabel(entry.relation);
+          const isSelf = entry.relation === 'self';
+          const content = (
+            <>
+              <span className="plan-lineage-item-title">{entry.plan.title}</span>
+              <span className="plan-lineage-item-meta">
+                {relationLabel && (
+                  <span className="plan-lineage-item-relation">{relationLabel}</span>
+                )}
+                <span>{timeAgo(entry.plan.createdAt)}</span>
+              </span>
+            </>
+          );
+
+          return (
+            <li
+              key={entry.plan.id}
+              className={
+                isSelf ? 'plan-lineage-item plan-lineage-item--current' : 'plan-lineage-item'
+              }
+            >
+              {isSelf || !onSelectRelatedPlan ? (
+                <div className="plan-lineage-item-body" aria-current={isSelf ? 'true' : undefined}>
+                  {content}
+                </div>
+              ) : (
+                <button
+                  type="button"
+                  className="plan-lineage-item-body plan-lineage-item-button"
+                  onClick={() => onSelectRelatedPlan(entry.plan)}
+                >
+                  {content}
+                </button>
+              )}
+            </li>
+          );
+        })}
+      </ol>
+    </section>
+  );
+}
+
 type PlanViewerProps = {
   plan: Plan;
+  /** Full indexed plan list used to resolve session lineage. */
+  allPlans?: readonly Plan[];
+  onSelectRelatedPlan?: (plan: Plan) => void;
   headerExtra?: ReactNode;
   actionToolbarExtra?: ReactNode;
   onEdit?: () => void;
@@ -180,6 +263,8 @@ type PlanViewerProps = {
 
 export function PlanViewer({
   plan,
+  allPlans,
+  onSelectRelatedPlan,
   headerExtra,
   actionToolbarExtra,
   onEdit,
@@ -250,6 +335,17 @@ export function PlanViewer({
   };
   const workspace = extractWorkspace(plan);
   const syncOrigin = extractSyncOrigin(plan);
+  const lineage = useMemo(
+    () => (allPlans ? getRelatedPlans(plan, allPlans) : null),
+    [allPlans, plan],
+  );
+  const lineageConfidence = useMemo((): LineageConfidence | undefined => {
+    if (!lineage?.hasRelated) return undefined;
+    const related = lineage.items.filter((entry) => entry.relation !== 'self');
+    if (related.some((entry) => entry.confidence === 'session')) return 'session';
+    if (related.some((entry) => entry.confidence === 'thread')) return 'thread';
+    return related[0]?.confidence ?? 'workspace-fallback';
+  }, [lineage]);
 
   const outline = useMemo(
     () =>
@@ -741,6 +837,14 @@ export function PlanViewer({
                 actionToolbar
               )}
             </div>
+
+            {lineage?.hasRelated && (
+              <PlanLineageSection
+                entries={lineage.items}
+                confidence={lineageConfidence}
+                onSelectRelatedPlan={onSelectRelatedPlan}
+              />
+            )}
           </header>
 
           {onChartWideChange && !chartHidden && (