Function computeSplitExtraLeaves

src/views/DataThread.tsx:2505–2582

* For each long thread, identify intermediate tables to "promote" as extra * leaves so the thread renders as multiple stacked segments. * * Item-count strategy (no pixel estimates): * * 1. Count "items" per thread: each trigger contributes 1 + #effective * interaction entries + #charts

(
    leafTables: DictTable[],
    allTables: DictTable[],
    chartElements: { tableId: string }[],
    fittableColumns: number,
)

 * instruction with the promoted table shown as a dimmed ghost.
 */
function computeSplitExtraLeaves(
    leafTables: DictTable[],
    allTables: DictTable[],
    chartElements: { tableId: string }[],
    fittableColumns: number,
): DictTable[] {
    if (fittableColumns <= 1) return [];
    const tableById = new Map(allTables.map(t => [t.id, t]));

    // Per-trigger item count = 1 (table) + interaction entries + charts.
    const itemsForTrigger = (resultTableId: string, interaction: InteractionEntry[] | undefined): number => {
        const charts = chartElements.filter(ce => ce.tableId === resultTableId).length;
        return 1 + effectiveEntryCount(interaction) + charts;
    };

    // Compute per-thread totals up front so we can pick the budget.
    const triggersByLeaf: Trigger[][] = [];
    const threadItems: number[] = [];
    for (const lt of leafTables) {
        const triggers = getTriggers(lt, allTables);
        triggersByLeaf.push(triggers);
        let items = 0;
        for (const tp of triggers) items += itemsForTrigger(tp.resultTableId, tp.interaction);
        // Leaf trigger contributes its own row count + leaf table + leaf charts.
        items += itemsForTrigger(lt.id, lt.derive?.trigger?.interaction);
        threadItems.push(items);
    }
    const totalItems = threadItems.reduce((s, v) => s + v, 0);
    if (totalItems === 0) return [];

    const budget = totalItems / fittableColumns;

    const extras: DictTable[] = [];
    for (let li = 0; li < leafTables.length; li++) {
        const lt = leafTables[li];
        if (!lt.derive) continue;
        const triggers = triggersByLeaf[li];
        if (triggers.length < 3) continue;

        const K = Math.max(1, Math.round(threadItems[li] / budget));
        if (K <= 1) continue;

        // Per-trigger items, with the leaf weight folded into the LAST entry
        // (the leaf step renders inside the trailing segment but isn't part
        // of the `triggers` array).
        const triggerItems = triggers.map(tp => itemsForTrigger(tp.resultTableId, tp.interaction));
        triggerItems[triggerItems.length - 1] += itemsForTrigger(lt.id, lt.derive.trigger?.interaction);

        // Stability strategy: prefer greedy cuts (which only shift when
        // earlier content changes) over balanced ones (which redistribute
        // on every new trigger).  Only re-balance when the trailing segment
        // grows past 1.5× the previous segment — i.e. greedy has produced
        // a noticeably lopsided layout that warrants a reshuffle.
        let cuts = greedyPartitionCuts(triggerItems, K, budget);
        if (cuts.length === 0) {
            // Greedy couldn't find K segments at this budget — fall back to
            // balanced (which uses binary search and always finds a valid
            // partition when one exists).