@buoy-gg/time-machine 7.0.41 → 7.0.42

package/lib/module/components/preview/RestorePreviewScreen.js

@@ -1,1005 +1 @@
-"use strict";
-
-/**
- * Restore Preview — "what will restoring this snapshot actually change?"
- *
- * ONE virtualized FlatList is the scrollable area (the section header, the
- * source rows, their item rows and the inline diffs are all list rows) with
- * a sticky Restore CTA footer — no nested scroll regions, so thousands of
- * storage keys stay cheap.
- *
- * Layout follows the Time Machine mockup: source sections are card
- * dropdowns with tool-icon tiles, a "N keys · M changed" detection subtitle,
- * ±≈ badges, a search field with an expand/collapse-all button, and a bottom
- * "Restore State" pill. Only rows a restore would touch (or can't touch)
- * render — unchanged items never do. Every applicable item keeps its
- * INCLUDE checkbox (source headers toggle their whole section) — unchecked
- * items are passed to restore as exclusions and left untouched.
- */
-import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { ActivityIndicator, FlatList, StyleSheet, Text, TouchableOpacity, View } from "react-native";
-import { ChevronUp, AlertTriangle, RefreshCw, useSafeAreaInsets } from "@buoy-gg/shared-ui";
-import { useToolHeader, useToolHost } from "@buoy-gg/core";
-import { TimeMachineHeaderActions } from "../HeaderActions";
-import { DisclosureChevron, Group, SectionLabel } from "../../ui/primitives";
-import { TM_MONO, tm } from "../../ui/tmTheme";
-import { timeMachineStore, willRestoreRoute } from "../../store/timeMachineStore";
-import { ItemDiffPanel } from "./ItemDiffPanel";
-import { RestorePointNameRow } from "./RestorePointNameRow";
-import { VERDICT_META } from "./verdictMeta";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const SOURCE_NOUNS = {
-  storage: "keys",
-  redux: "slices",
-  zustand: "stores",
-  jotai: "atoms",
-  query: "queries"
-};
-
-/**
- * Where a row sits in the one card that holds the whole list. The list has
- * to stay flat to stay virtualized, so each row paints its own share of the
- * card: the first row rounds its top, the last rounds its bottom, and every
- * other row draws the hairline above it.
- */
-
-/**
- * The route leg, as a row in the same card as the sources. It is not a
- * source — nothing diffs it — but "will this also take me back to
- * /checkout?" is a decision about THIS restore, so it belongs beside the
- * other things the restore is about to do rather than on the list screen.
- */
-
-/** Shared empty selection — a stable identity for "nothing is excluded". */
-const EMPTY_SELECTION = new Set();
-function sameSelection(a, b) {
-  if (a.size !== b.size) return false;
-  for (const key of a) if (!b.has(key)) return false;
-  return true;
-}
-
-/** Compound exclusion key — what timeMachineStore.restore expects. */
-function cKey(sourceId, itemKey) {
-  return `${sourceId}::${itemKey}`;
-}
-function shortPreview(value) {
-  if (value === undefined) return "∅";
-  try {
-    const s = typeof value === "string" ? `"${value}"` : JSON.stringify(value);
-    if (!s) return String(value);
-    return s.length > 46 ? `${s.slice(0, 43)}…` : s;
-  } catch {
-    return "[complex]";
-  }
-}
-
-/**
- * The grouped-card shell one row paints. Rounds the ends, insets the card
- * from the sheet, and draws the hairline that separates it from the row
- * above — the same shape the home list's <Group> makes, rebuilt per row so
- * the list stays virtualized.
- */
-function CardRow({
-  position,
-  children
-}) {
-  return /*#__PURE__*/_jsxs(View, {
-    style: [styles.cardRow, position.first ? styles.cardRowFirst : null, position.last ? styles.cardRowLast : null],
-    children: [position.first ? null : /*#__PURE__*/_jsx(View, {
-      style: styles.cardSeparator
-    }), children]
-  });
-}
-function CountPill({
-  glyph,
-  count,
-  color,
-  testID
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: [styles.countPill, {
-      backgroundColor: `${color}26`
-    }],
-    children: /*#__PURE__*/_jsxs(Text, {
-      style: [styles.countPillText, {
-        color
-      }],
-      testID: testID,
-      children: [glyph, count]
-    })
-  });
-}
-function Checkbox({
-  state
-}) {
-  return /*#__PURE__*/_jsx(View, {
-    style: [styles.checkbox, state !== "none" && styles.checkboxChecked],
-    children: state === "none" ? null : /*#__PURE__*/_jsx(Text, {
-      style: styles.checkboxGlyph,
-      children: state === "all" ? "✓" : "−"
-    })
-  });
-}
-const ItemRow = /*#__PURE__*/memo(function ItemRow({
-  row,
-  expanded,
-  onOpen,
-  onToggle
-}) {
-  const meta = VERDICT_META[row.item.verdict];
-  const dimmed = !meta.applies || row.excluded;
-  const openable = row.item.verdict === "changed" || row.item.verdict === "added" || row.item.verdict === "removed";
-  // One stem for the row and every part of it, so a test that found the row
-  // can read its label, its before/after and its exclusion note without
-  // rebuilding the compound key three times.
-  const id = `tm-preview-item-${row.sourceId}-${row.item.key}`;
-  return /*#__PURE__*/_jsx(CardRow, {
-    position: row,
-    children: /*#__PURE__*/_jsxs(View, {
-      style: [styles.itemRow, dimmed && styles.dimmed],
-      children: [/*#__PURE__*/_jsx(TouchableOpacity, {
-        onPress: onToggle,
-        disabled: !meta.applies,
-        hitSlop: {
-          top: 10,
-          bottom: 10,
-          left: 8,
-          right: 8
-        },
-        testID: `tm-preview-toggle-${row.sourceId}-${row.item.key}`,
-        accessibilityRole: "checkbox",
-        accessibilityState: {
-          checked: !(!meta.applies || row.excluded)
-        },
-        accessibilityLabel: `Include ${row.item.label}`,
-        children: /*#__PURE__*/_jsx(Checkbox, {
-          state: !meta.applies || row.excluded ? "none" : "all"
-        })
-      }), /*#__PURE__*/_jsxs(TouchableOpacity, {
-        style: styles.itemBodyTouch,
-        onPress: () => openable && onOpen(),
-        disabled: !openable,
-        testID: id,
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: [styles.itemGlyph, {
-            color: meta.color
-          }],
-          children: meta.glyph
-        }), /*#__PURE__*/_jsxs(View, {
-          style: styles.itemBody,
-          children: [/*#__PURE__*/_jsx(Text, {
-            style: styles.itemLabel,
-            numberOfLines: 1,
-            testID: `${id}-label`,
-            children: row.item.label
-          }), row.item.verdict === "changed" && /*#__PURE__*/_jsxs(Text, {
-            style: styles.itemPreview,
-            numberOfLines: 1,
-            testID: `${id}-values`,
-            children: [shortPreview(row.item.oldValue), " \u2192", " ", shortPreview(row.item.newValue)]
-          }), row.item.verdict === "added" && /*#__PURE__*/_jsx(Text, {
-            style: styles.itemPreview,
-            numberOfLines: 1,
-            testID: `${id}-values`,
-            children: shortPreview(row.item.newValue)
-          }), row.item.verdict === "removed" && /*#__PURE__*/_jsx(Text, {
-            style: [styles.itemPreview, styles.itemPreviewRemoved],
-            numberOfLines: 1,
-            testID: `${id}-values`,
-            children: shortPreview(row.item.oldValue)
-          }), row.excluded ? /*#__PURE__*/_jsx(Text, {
-            style: styles.itemExcluded,
-            testID: `${id}-excluded`,
-            children: "excluded \u2014 restore leaves this untouched"
-          }) : row.item.reason && /*#__PURE__*/_jsx(Text, {
-            style: styles.itemReason,
-            numberOfLines: 2,
-            testID: `${id}-reason`,
-            children: row.item.reason
-          })]
-        }), openable ? expanded ? /*#__PURE__*/_jsx(ChevronUp, {
-          size: 16,
-          color: tm.color.labelTertiary
-        }) : /*#__PURE__*/_jsx(DisclosureChevron, {}) : null]
-      })]
-    })
-  });
-});
-export function RestorePreviewScreen({
-  preview,
-  snapshots,
-  busy,
-  onBack,
-  onRestore
-}) {
-  const host = useToolHost();
-  const hosted = host.instanceId !== undefined;
-  // `minBottom` is a floor, not a preference: the dimension map can't know
-  // about a device that ships next year, and an unmapped one falls through to
-  // `bottom: 0`. This keeps the CTA off the home indicator either way.
-  const insets = useSafeAreaInsets({
-    minBottom: 16
-  });
-  const [collapsed, setCollapsed] = useState({});
-  const [excluded, setExcluded] = useState(new Set());
-  /** Set by every checkbox interaction — see the auto-save effect below. */
-  const userEditedRef = useRef(false);
-  /** Item rows whose diff is expanded inline, by compound key. */
-  const [openDiffs, setOpenDiffs] = useState(EMPTY_SELECTION);
-  const toggleDiff = useCallback(key => {
-    setOpenDiffs(prev => {
-      const next = new Set(prev);
-      if (next.has(key)) next.delete(key);else next.add(key);
-      return next;
-    });
-  }, []);
-  // Filtering lives in the shared modal header (the magnifier), same as the
-  // restore-point list and every other Buoy tool — one place to look for it.
-  const search = host.search;
-  const rightMeta = preview.right === "current" ? undefined : snapshots.find(s => s.id === preview.right.snapshotId);
-  // Latest-ref: `renderRow` is memoized on its handlers, so this one has to
-  // keep a stable identity while still reading the current snapshot.
-  const rightMetaRef = useRef(rightMeta);
-  rightMetaRef.current = rightMeta;
-
-  /** Flip whether this restore also navigates back to the captured route. */
-  const toggleRoute = useCallback(() => {
-    if (!rightMetaRef.current) return;
-    const meta = rightMetaRef.current;
-    void timeMachineStore.setRestoreRoute(meta.id, !willRestoreRoute(meta));
-  }, []);
-  const isBaseline = rightMeta?.baseline === true;
-  const liveLeft = preview.left === "current";
-
-  /**
-   * The selection this restore point already remembers, as exclusions. Null
-   * until there is a snapshot on the right-hand side to have one.
-   */
-  const savedExcluded = useMemo(() => {
-    if (!rightMeta) return null;
-    return rightMeta.excludedKeys?.length ? new Set(rightMeta.excludedKeys) : EMPTY_SELECTION;
-  }, [rightMeta]);
-
-  /**
-   * A snapshot still carrying the older `scope` include-list ("only ever
-   * touch these", set via MCP). It seeds the checkboxes and is converted to
-   * exclusions on read — a restore of it would otherwise still apply include
-   * semantics, and the two forms would disagree about what one tap does.
-   */
-  const legacyScoped = !!rightMeta?.scope?.length && !rightMeta?.excludedKeys?.length;
-  const legacySeed = useMemo(() => {
-    if (!legacyScoped || !rightMeta?.scope) return EMPTY_SELECTION;
-    const scopeSet = new Set(rightMeta.scope);
-    const next = new Set();
-    for (const src of preview.sources) {
-      for (const item of src.items) {
-        const key = cKey(src.id, item.key);
-        if (VERDICT_META[item.verdict].applies && !scopeSet.has(key)) {
-          next.add(key);
-        }
-      }
-    }
-    return next;
-  }, [legacyScoped, rightMeta, preview.sources]);
-
-  // Open with the saved selection already applied — once per snapshot, and
-  // only once there is a diff to apply it to.
-  const seededFor = useRef(null);
-  useEffect(() => {
-    if (!rightMeta || preview.building || !savedExcluded) return;
-    if (seededFor.current === rightMeta.id) return;
-    seededFor.current = rightMeta.id;
-    userEditedRef.current = false;
-    const seed = savedExcluded.size > 0 ? savedExcluded : legacySeed;
-    if (seed.size > 0) setExcluded(new Set(seed));
-    // Convert an older include-list scope the moment it's read, so the two
-    // forms never disagree about what a restore will do.
-    if (legacyScoped && seed.size > 0) {
-      void timeMachineStore.setExclusions(rightMeta.id, Array.from(seed));
-    }
-  }, [rightMeta, preview.building, savedExcluded, legacySeed, legacyScoped]);
-
-  /**
-   * Auto-save. The checkboxes ARE the restore point's setting, so there is
-   * nothing to confirm — every edit persists as EXCLUSIONS (the items to
-   * leave alone), and every later restore of this point honors them, one-tap
-   * RESTORE and MCP included.
-   *
-   * Never an include list: unchecking one of ten keys must keep restoring the
-   * other nine AND anything that only starts differing tomorrow, which a list
-   * built from today's diff cannot do.
-   *
-   * Gated on a ref rather than on comparing to what's stored, because on the
-   * frames before the seed lands `excluded` is legitimately empty — writing
-   * that would erase the saved selection we are about to load.
-   */
-  useEffect(() => {
-    if (!rightMeta || !savedExcluded || !userEditedRef.current) return;
-    if (sameSelection(excluded, savedExcluded)) return;
-    const keys = Array.from(excluded);
-    void timeMachineStore.setExclusions(rightMeta.id, keys.length ? keys : null);
-  }, [excluded, rightMeta, savedExcluded]);
-  const toggleItem = useCallback(key => {
-    userEditedRef.current = true;
-    setExcluded(prev => {
-      const next = new Set(prev);
-      if (next.has(key)) next.delete(key);else next.add(key);
-      return next;
-    });
-  }, []);
-  const toggleSource = useCallback((source, includeState) => {
-    userEditedRef.current = true;
-    setExcluded(prev => {
-      const next = new Set(prev);
-      for (const item of source.items) {
-        if (!VERDICT_META[item.verdict].applies) continue;
-        const key = cKey(source.id, item.key);
-        if (includeState === "all") next.add(key);else next.delete(key);
-      }
-      return next;
-    });
-  }, []);
-
-  // Takes the EFFECTIVE collapsed state — the map is sparse (defaults come
-  // from the ?? fallback), so `!map[id]` would no-op the first tap on a
-  // default-collapsed card.
-  const toggleCollapse = useCallback((id, currentlyCollapsed) => {
-    setCollapsed(c => ({
-      ...c,
-      [id]: !currentlyCollapsed
-    }));
-  }, []);
-  const totals = useMemo(() => {
-    let applies = 0;
-    let excludedCount = 0;
-    let wontApply = 0;
-    const perSource = [];
-    for (const src of preview.sources) {
-      let n = 0;
-      for (const item of src.items) {
-        const m = VERDICT_META[item.verdict];
-        if (m.applies) {
-          if (excluded.has(cKey(src.id, item.key))) excludedCount += 1;else {
-            applies += 1;
-            n += 1;
-          }
-        } else if (item.verdict === "wont-apply") wontApply += 1;
-      }
-      if (n > 0) perSource.push(`${n} ${src.label.toLowerCase()}`);
-    }
-    return {
-      applies,
-      excludedCount,
-      wontApply,
-      perSource
-    };
-  }, [preview.sources, excluded]);
-
-  // Hosted: back + identity in the shared modal header. Restore lives in the
-  // bottom CTA; the preset's labeled RELOAD APP action stays available.
-  useToolHeader(hosted ? {
-    title: "Restore Preview",
-    subtitle: rightMeta?.name ?? "preview",
-    onBack,
-    // BAR from here arms the point being previewed.
-    actions: /*#__PURE__*/_jsx(TimeMachineHeaderActions, {
-      armId: rightMeta?.id
-    })
-  } : null,
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [hosted, rightMeta?.name, rightMeta?.id]);
-  const {
-    rows,
-    blockedSources
-  } = useMemo(() => {
-    const q = search.trim().toLowerCase();
-    const out = [];
-    // Sources the restore would not touch at all get no card: "no changes"
-    // rows are noise on a screen about what WILL change.
-    /** Sources holding a won't-apply item, so the note can name where to look. */
-    const blocked = [];
-    for (const src of preview.sources) {
-      // Every detected source gets a card whose subtitle carries the
-      // detection proof ("60 keys · 7 changed" / "2 slices · no changes"),
-      // so clean sources need no expansion. Unchanged ITEMS never render.
-      const relevant = src.items.some(i => i.verdict !== "unchanged");
-      if (!relevant && !src.error) continue;
-      const expandable = relevant || src.notes.length > 0 || !!src.error;
-      const applicable = src.items.filter(i => VERDICT_META[i.verdict].applies);
-      const wontApplyCount = src.items.filter(i => i.verdict === "wont-apply").length;
-      if (wontApplyCount > 0) blocked.push(src.label);
-      const noun = src.items.length === 1 ? (SOURCE_NOUNS[src.id] ?? "items").replace(/ies$/, "y").replace(/s$/, "") : SOURCE_NOUNS[src.id] ?? "items";
-      const summary = `${src.items.length} ${noun} · ` + (applicable.length > 0 ? `${applicable.length} changed` : wontApplyCount > 0 ? `${wontApplyCount} won't apply` : "no changes");
-      const excludedInSource = applicable.filter(i => excluded.has(cKey(src.id, i.key))).length;
-      const includeState = applicable.length === 0 || excludedInSource === 0 ? "all" : excludedInSource === applicable.length ? "none" : "some";
-      const counts = {
-        added: 0,
-        removed: 0,
-        changed: 0
-      };
-      for (const i of src.items) {
-        if (excluded.has(cKey(src.id, i.key))) continue;
-        if (i.verdict === "added") counts.added += 1;else if (i.verdict === "removed") counts.removed += 1;else if (i.verdict === "changed" || i.verdict === "too-large") counts.changed += 1;
-      }
-      const visible = src.items.filter(item => {
-        // Unchanged items never render — the dropdowns show only what a
-        // restore would touch (changed) or can't touch (won't-apply).
-        if (item.verdict === "unchanged") return false;
-        if (q && !item.label.toLowerCase().includes(q)) return false;
-        return true;
-      });
-      // Everything starts collapsed. The screen's job on open is "which
-      // sources would this touch, and how much" — expanding a source with
-      // 58 keys before you asked buries that under its own contents.
-      const isCollapsed = expandable ? collapsed[src.id] ?? true : true;
-      out.push({
-        kind: "source",
-        source: src,
-        collapsed: isCollapsed,
-        includeState,
-        applicableCount: applicable.length,
-        counts,
-        expandable,
-        summary,
-        first: false,
-        last: false
-      });
-      if (!isCollapsed) {
-        for (const note of src.notes) {
-          out.push({
-            kind: "note",
-            id: `${src.id}:${note}`,
-            text: note,
-            first: false,
-            last: false
-          });
-        }
-        if (src.error) {
-          out.push({
-            kind: "note",
-            id: `${src.id}:err`,
-            text: `⚠ ${src.error}`,
-            first: false,
-            last: false
-          });
-        }
-        for (const item of visible) {
-          const key = cKey(src.id, item.key);
-          out.push({
-            kind: "item",
-            sourceId: src.id,
-            item,
-            excluded: excluded.has(key),
-            first: false,
-            last: false
-          });
-          if (openDiffs.has(key)) {
-            out.push({
-              kind: "diff",
-              sourceId: src.id,
-              item,
-              first: false,
-              last: false
-            });
-          }
-        }
-      }
-    }
-    if (rightMeta?.route) {
-      out.push({
-        kind: "route",
-        href: rightMeta.route.href,
-        on: willRestoreRoute(rightMeta),
-        first: false,
-        last: false
-      });
-    }
-    // ONE card holds every source — the ends of the LIST round, and every
-    // other boundary is just a hairline. Per-source cards would read as
-    // separate groups, which they aren't: this is one list of what a restore
-    // would touch.
-    if (out.length > 0) {
-      out[0].first = true;
-      out[out.length - 1].last = true;
-    }
-    return {
-      rows: out,
-      blockedSources: blocked
-    };
-  }, [preview.sources, search, collapsed, excluded, openDiffs, rightMeta]);
-  const renderRow = useCallback(({
-    item: row
-  }) => {
-    if (row.kind === "source") {
-      const src = row.source;
-      const {
-        counts
-      } = row;
-      return /*#__PURE__*/_jsx(CardRow, {
-        position: row,
-        children: /*#__PURE__*/_jsxs(View, {
-          style: styles.sourceCard,
-          children: [/*#__PURE__*/_jsx(TouchableOpacity, {
-            onPress: () => toggleSource(src, row.includeState),
-            disabled: row.applicableCount === 0,
-            hitSlop: {
-              top: 10,
-              bottom: 10,
-              left: 8,
-              right: 8
-            },
-            testID: `tm-preview-source-toggle-${src.id}`,
-            children: /*#__PURE__*/_jsx(Checkbox, {
-              state: row.applicableCount === 0 ? "none" : row.includeState
-            })
-          }), /*#__PURE__*/_jsxs(TouchableOpacity, {
-            style: styles.sourceCardTouch,
-            onPress: () => row.expandable && toggleCollapse(src.id, row.collapsed),
-            disabled: !row.expandable,
-            testID: `tm-preview-source-${src.id}`,
-            children: [/*#__PURE__*/_jsxs(View, {
-              style: styles.sourceNameBlock,
-              children: [/*#__PURE__*/_jsx(Text, {
-                style: styles.sourceName,
-                numberOfLines: 1,
-                testID: `tm-preview-source-${src.id}-name`,
-                children: src.label
-              }), /*#__PURE__*/_jsx(Text, {
-                style: styles.sourceSummary,
-                numberOfLines: 1,
-                testID: `tm-preview-source-${src.id}-summary`,
-                children: row.includeState === "none" && row.applicableCount > 0 ? `${row.summary} · excluded` : row.summary
-              })]
-            }), /*#__PURE__*/_jsxs(View, {
-              style: styles.sourceBadges,
-              children: [counts.removed > 0 ? /*#__PURE__*/_jsx(CountPill, {
-                glyph: "\u2212",
-                count: counts.removed,
-                color: tm.color.danger,
-                testID: `tm-preview-source-${src.id}-removed`
-              }) : null, counts.added > 0 ? /*#__PURE__*/_jsx(CountPill, {
-                glyph: "+",
-                count: counts.added,
-                color: tm.color.accent,
-                testID: `tm-preview-source-${src.id}-added`
-              }) : null, counts.changed > 0 ? /*#__PURE__*/_jsx(CountPill, {
-                glyph: "\u2248",
-                count: counts.changed,
-                color: tm.color.info,
-                testID: `tm-preview-source-${src.id}-changed`
-              }) : null]
-            }), row.expandable ? row.collapsed ? /*#__PURE__*/_jsx(DisclosureChevron, {}) : /*#__PURE__*/_jsx(ChevronUp, {
-              size: 16,
-              color: tm.color.labelTertiary
-            }) : null]
-          })]
-        })
-      });
-    }
-    if (row.kind === "note") {
-      return /*#__PURE__*/_jsx(CardRow, {
-        position: row,
-        children: /*#__PURE__*/_jsx(Text, {
-          style: styles.noteRow,
-          testID: `tm-preview-note-${row.id}`,
-          children: row.text
-        })
-      });
-    }
-    if (row.kind === "route") {
-      return /*#__PURE__*/_jsx(CardRow, {
-        position: row,
-        children: /*#__PURE__*/_jsxs(TouchableOpacity, {
-          style: styles.routeRow,
-          onPress: toggleRoute,
-          accessibilityRole: "switch",
-          accessibilityState: {
-            checked: row.on
-          },
-          accessibilityLabel: `Also return to ${row.href}`,
-          testID: "tm-preview-route",
-          children: [/*#__PURE__*/_jsx(Checkbox, {
-            state: row.on ? "all" : "none"
-          }), /*#__PURE__*/_jsxs(View, {
-            style: styles.routeText,
-            children: [/*#__PURE__*/_jsx(Text, {
-              style: styles.routeTitle,
-              children: "Return to this screen"
-            }), /*#__PURE__*/_jsx(Text, {
-              style: styles.routeHref,
-              numberOfLines: 1,
-              testID: "tm-preview-route-href",
-              children: row.href
-            })]
-          })]
-        })
-      });
-    }
-    if (row.kind === "diff") {
-      return /*#__PURE__*/_jsx(CardRow, {
-        position: row,
-        children: /*#__PURE__*/_jsx(ItemDiffPanel, {
-          item: row.item,
-          testID: `tm-preview-diff-${row.sourceId}-${row.item.key}`
-        })
-      });
-    }
-    return /*#__PURE__*/_jsx(ItemRow, {
-      row: row,
-      expanded: openDiffs.has(cKey(row.sourceId, row.item.key)),
-      onOpen: () => toggleDiff(cKey(row.sourceId, row.item.key)),
-      onToggle: () => toggleItem(cKey(row.sourceId, row.item.key))
-    });
-  }, [openDiffs, toggleDiff, toggleCollapse, toggleItem, toggleSource, toggleRoute]);
-  const keyExtractor = useCallback(row => {
-    if (row.kind === "source") return `s:${row.source.id}`;
-    if (row.kind === "note") return `n:${row.id}`;
-    if (row.kind === "route") return "route";
-    if (row.kind === "diff") return `d:${row.sourceId}:${row.item.key}`;
-    return `i:${row.sourceId}:${row.item.key}`;
-  }, []);
-  const header = /*#__PURE__*/_jsxs(View, {
-    children: [!hosted && /*#__PURE__*/_jsxs(View, {
-      style: styles.fallbackHeader,
-      children: [/*#__PURE__*/_jsx(TouchableOpacity, {
-        onPress: onBack,
-        hitSlop: HIT,
-        testID: "tm-preview-back",
-        children: /*#__PURE__*/_jsx(Text, {
-          style: styles.backText,
-          children: "\u2039 Back"
-        })
-      }), /*#__PURE__*/_jsx(Text, {
-        style: styles.screenTitle,
-        numberOfLines: 1,
-        children: "Restore Preview"
-      })]
-    }), rightMeta ? /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx(SectionLabel, {
-        children: "Restore Point"
-      }), /*#__PURE__*/_jsx(Group, {
-        children: /*#__PURE__*/_jsx(RestorePointNameRow, {
-          name: rightMeta.name,
-          onRename: next => void timeMachineStore.rename(rightMeta.id, next)
-        })
-      })]
-    }) : null, /*#__PURE__*/_jsx(SectionLabel, {
-      children: "Changes to Restore"
-    })]
-  });
-  const ctaDisabled = busy || preview.building || totals.applies === 0;
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.container,
-    children: [/*#__PURE__*/_jsx(FlatList, {
-      testID: "tm-preview-list",
-      data: rows,
-      renderItem: renderRow,
-      keyExtractor: keyExtractor,
-      ListHeaderComponent: header,
-      ListEmptyComponent: preview.building ? /*#__PURE__*/_jsx(ActivityIndicator, {
-        style: styles.buildingSpinner,
-        size: "small",
-        color: tm.color.accent
-      }) : /*#__PURE__*/_jsx(Text, {
-        style: styles.emptyText,
-        testID: "tm-preview-empty",
-        children: search ? "Nothing matches this filter." : "No changes — restoring would change nothing."
-      }),
-      ListFooterComponent: /*#__PURE__*/_jsx(View, {
-        children: totals.wontApply > 0 ? /*#__PURE__*/_jsxs(View, {
-          style: styles.warnNote,
-          children: [/*#__PURE__*/_jsx(AlertTriangle, {
-            size: 12,
-            color: tm.color.warning
-          }), /*#__PURE__*/_jsxs(Text, {
-            style: styles.warnNoteText,
-            testID: "tm-preview-wont-apply",
-            children: [totals.wontApply, " item", totals.wontApply === 1 ? "" : "s", " ", "won't apply \u2014 expand", " ", blockedSources.length > 0 ? blockedSources.join(" and ") : "the source", " ", "to see the reason."]
-          })]
-        }) : null
-      })
-      // The name row is a TextInput inside this list: without "handled",
-      // the first tap after renaming only dismisses the keyboard, so the
-      // Restore CTA and every checkbox silently swallow one press.
-      ,
-      keyboardShouldPersistTaps: "handled",
-      removeClippedSubviews: true,
-      initialNumToRender: 20,
-      windowSize: 7,
-      contentContainerStyle: styles.listContent
-    }), liveLeft && rightMeta && /*#__PURE__*/_jsxs(View, {
-      style: [styles.footer, {
-        paddingBottom: insets.bottom
-      }],
-      children: [/*#__PURE__*/_jsxs(TouchableOpacity, {
-        style: [styles.cta, isBaseline && styles.ctaDanger, ctaDisabled && styles.ctaDisabled],
-        onPress: () => onRestore(isBaseline ? "reload" : "live", Array.from(excluded)),
-        disabled: isBaseline ? busy || preview.building : ctaDisabled,
-        testID: "tm-preview-restore",
-        children: [/*#__PURE__*/_jsx(RefreshCw, {
-          size: 16,
-          color: isBaseline ? tm.color.onDanger : tm.color.onAccent
-        }), /*#__PURE__*/_jsx(Text, {
-          style: [styles.ctaText, isBaseline ? styles.ctaTextDanger : null],
-          children: isBaseline ? "Wipe & Reload" : "Restore State"
-        })]
-      }), /*#__PURE__*/_jsx(Text, {
-        style: styles.ctaCaption,
-        testID: "tm-preview-cta-caption",
-        children: isBaseline ? "This wipes all app storage and reloads the app." : totals.excludedCount > 0 ? `Restores ${totals.applies} of ${totals.applies + totals.excludedCount} change${totals.applies + totals.excludedCount === 1 ? "" : "s"} — everything else stays as it is.` : "This will replace the current state with the snapshot."
-      })]
-    })]
-  });
-}
-const HIT = {
-  top: 10,
-  bottom: 10,
-  left: 10,
-  right: 10
-};
-const styles = StyleSheet.create({
-  // Transparent so JsModal's ToolBackground shows through (the modal paints opaque base beneath it).
-  container: {
-    flex: 1,
-    backgroundColor: "transparent"
-  },
-  fallbackHeader: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingHorizontal: tm.gutter,
-    paddingVertical: 10,
-    gap: 10
-  },
-  backText: {
-    color: tm.color.accent,
-    fontSize: tm.font.control
-  },
-  screenTitle: {
-    color: tm.color.label,
-    fontSize: 20,
-    fontWeight: "700",
-    letterSpacing: tm.tracking.row,
-    flex: 1
-  },
-  dimmed: {
-    opacity: 0.5
-  },
-  listContent: {
-    paddingTop: 14,
-    paddingBottom: 12
-  },
-  // ── The grouped card each list row paints its own share of ──────────────
-  cardRow: {
-    marginHorizontal: tm.gutter,
-    backgroundColor: tm.color.group
-  },
-  cardRowFirst: {
-    borderTopLeftRadius: tm.radius.group,
-    borderTopRightRadius: tm.radius.group
-  },
-  cardRowLast: {
-    borderBottomLeftRadius: tm.radius.group,
-    borderBottomRightRadius: tm.radius.group,
-    marginBottom: 10
-  },
-  cardSeparator: {
-    height: StyleSheet.hairlineWidth,
-    marginLeft: 51,
-    backgroundColor: tm.color.separator
-  },
-  // ── Selection card ──────────────────────────────────────────────────────
-
-  // ── The "won't apply" heads-up under the card ───────────────────────────
-  warnNote: {
-    flexDirection: "row",
-    alignItems: "flex-start",
-    gap: 6,
-    paddingHorizontal: tm.gutter + tm.textInset,
-    paddingTop: 8
-  },
-  warnNoteText: {
-    flex: 1,
-    color: tm.color.labelSecondary,
-    fontSize: tm.font.footnote,
-    lineHeight: tm.font.footnote * 1.35
-  },
-  // ── Count pills on a source row ─────────────────────────────────────────
-  countPill: {
-    borderRadius: tm.radius.pill,
-    paddingHorizontal: 9,
-    paddingVertical: 3
-  },
-  countPillText: {
-    fontFamily: TM_MONO,
-    fontSize: tm.font.footnote,
-    fontWeight: "600"
-  },
-  // ── Include checkbox ────────────────────────────────────────────────────
-  checkbox: {
-    width: 23,
-    height: 23,
-    borderRadius: tm.radius.pill,
-    borderWidth: 1.7,
-    borderColor: tm.color.labelTertiary,
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  checkboxChecked: {
-    borderColor: tm.color.accent,
-    backgroundColor: tm.color.accent
-  },
-  checkboxGlyph: {
-    color: tm.color.onAccent,
-    fontSize: 13,
-    fontWeight: "700",
-    lineHeight: 15
-  },
-  // ── Route row ───────────────────────────────────────────────────────────
-  routeRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    minHeight: 58,
-    paddingHorizontal: tm.textInset,
-    paddingVertical: 9,
-    gap: 12
-  },
-  routeText: {
-    flex: 1,
-    minWidth: 0,
-    gap: 2
-  },
-  routeTitle: {
-    color: tm.color.label,
-    fontSize: tm.font.row,
-    fontWeight: "600",
-    letterSpacing: tm.tracking.row
-  },
-  routeHref: {
-    color: tm.color.labelSecondary,
-    fontFamily: TM_MONO,
-    fontSize: tm.font.mono
-  },
-  // ── Source header row (first row of its card) ───────────────────────────
-  sourceCard: {
-    flexDirection: "row",
-    alignItems: "center",
-    minHeight: 58,
-    paddingHorizontal: tm.textInset,
-    paddingVertical: 9,
-    gap: 12
-  },
-  sourceCardTouch: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 12,
-    minWidth: 0
-  },
-  sourceNameBlock: {
-    flex: 1,
-    minWidth: 0,
-    gap: 2
-  },
-  sourceName: {
-    color: tm.color.label,
-    fontSize: tm.font.row,
-    fontWeight: "600",
-    letterSpacing: tm.tracking.row
-  },
-  sourceSummary: {
-    color: tm.color.labelSecondary,
-    fontSize: tm.font.footnote,
-    fontVariant: ["tabular-nums"]
-  },
-  sourceBadges: {
-    flexDirection: "row",
-    gap: 6
-  },
-  noteRow: {
-    color: tm.color.labelTertiary,
-    fontSize: tm.font.footnote,
-    lineHeight: tm.font.footnote * 1.35,
-    paddingHorizontal: tm.textInset,
-    paddingVertical: 9
-  },
-  // ── Item rows (further rows of the same card) ───────────────────────────
-  itemRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    paddingLeft: tm.textInset,
-    paddingRight: tm.textInset,
-    paddingVertical: 10,
-    gap: 12
-  },
-  itemBodyTouch: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 10,
-    minWidth: 0
-  },
-  itemGlyph: {
-    fontSize: 14,
-    fontWeight: "700",
-    width: 14,
-    textAlign: "center"
-  },
-  itemBody: {
-    flex: 1,
-    minWidth: 0
-  },
-  itemLabel: {
-    color: tm.color.label,
-    fontSize: tm.font.control,
-    letterSpacing: tm.tracking.control
-  },
-  itemPreview: {
-    color: tm.color.labelSecondary,
-    fontFamily: TM_MONO,
-    fontSize: tm.font.mono,
-    marginTop: 3
-  },
-  itemPreviewRemoved: {
-    textDecorationLine: "line-through"
-  },
-  itemReason: {
-    color: tm.color.warning,
-    fontSize: tm.font.mono,
-    marginTop: 3
-  },
-  itemExcluded: {
-    color: tm.color.labelTertiary,
-    fontSize: tm.font.mono,
-    marginTop: 3,
-    fontStyle: "italic"
-  },
-  buildingSpinner: {
-    marginTop: 28
-  },
-  emptyText: {
-    color: tm.color.labelSecondary,
-    fontSize: tm.font.footnote,
-    textAlign: "center",
-    marginTop: 28
-  },
-  // ── Sticky restore CTA ──────────────────────────────────────────────────
-  footer: {
-    paddingHorizontal: tm.gutter,
-    paddingTop: 10,
-    gap: 8,
-    borderTopColor: tm.color.separator,
-    borderTopWidth: StyleSheet.hairlineWidth,
-    backgroundColor: tm.color.sheet
-  },
-  cta: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "center",
-    gap: 8,
-    height: 50,
-    backgroundColor: tm.color.accent,
-    borderRadius: tm.radius.group
-  },
-  ctaDanger: {
-    backgroundColor: tm.color.danger
-  },
-  ctaTextDanger: {
-    color: tm.color.onDanger
-  },
-  ctaDisabled: {
-    opacity: 0.4
-  },
-  ctaText: {
-    color: tm.color.onAccent,
-    fontSize: tm.font.row,
-    fontWeight: "600",
-    letterSpacing: tm.tracking.row
-  },
-  ctaCaption: {
-    color: tm.color.labelSecondary,
-    fontSize: tm.font.footnote,
-    lineHeight: tm.font.footnote * 1.35,
-    textAlign: "center"
-  }
-});
-//# sourceMappingURL=RestorePreviewScreen.js.map
+"use strict";import{memo as Ce,useCallback as T,useEffect as ae,useMemo as N,useRef as _,useState as G}from"react";import{ActivityIndicator as De,FlatList as $e,StyleSheet as K,Text as u,TouchableOpacity as C,View as m}from"react-native";import{ChevronUp as de,AlertTriangle as ze,RefreshCw as Le,useSafeAreaInsets as Pe}from"@buoy-gg/shared-ui";import{useToolHeader as we,useToolHost as He}from"@buoy-gg/core";import{TimeMachineHeaderActions as Ae}from"../HeaderActions";import{DisclosureChevron as ue,Group as Oe,SectionLabel as fe}from"../../ui/primitives";import{TM_MONO as q,tm as t}from"../../ui/tmTheme";import{timeMachineStore as W,willRestoreRoute as me}from"../../store/timeMachineStore";import{ItemDiffPanel as Ee}from"./ItemDiffPanel";import{RestorePointNameRow as Ne}from"./RestorePointNameRow";import{VERDICT_META as P}from"./verdictMeta";import{jsx as o,jsxs as f,Fragment as We}from"react/jsx-runtime";const pe={storage:"keys",redux:"slices",zustand:"stores",jotai:"atoms",query:"queries"};const U=new Set;function Be(r,i){if(r.size!==i.size)return false;for(const x of r)if(!i.has(x))return false;return true}function I(r,i){return`${r}::${i}`}function B(r){if(r===void 0)return"\u2205";try{const i=typeof r==="string"?`"${r}"`:JSON.stringify(r);if(!i)return String(r);return i.length>46?`${i.slice(0,43)}\u2026`:i}catch{return"[complex]"}}function w({position:r,children:i}){return f(m,{style:[n.cardRow,r.first?n.cardRowFirst:null,r.last?n.cardRowLast:null],children:[r.first?null:o(m,{style:n.cardSeparator}),i]})}function J({glyph:r,count:i,color:x,testID:D}){return o(m,{style:[n.countPill,{backgroundColor:`${x}26`}],children:f(u,{style:[n.countPillText,{color:x}],testID:D,children:[r,i]})})}function Y({state:r}){return o(m,{style:[n.checkbox,r!=="none"&&n.checkboxChecked],children:r==="none"?null:o(u,{style:n.checkboxGlyph,children:r==="all"?"\u2713":"\u2212"})})}const Ve=Ce(function r({row:i,expanded:x,onOpen:D,onToggle:V}){const S=P[i.item.verdict];const $=!S.applies||i.excluded;const z=i.item.verdict==="changed"||i.item.verdict==="added"||i.item.verdict==="removed";const h=`tm-preview-item-${i.sourceId}-${i.item.key}`;return o(w,{position:i,children:f(m,{style:[n.itemRow,$&&n.dimmed],children:[o(C,{onPress:V,disabled:!S.applies,hitSlop:{top:10,bottom:10,left:8,right:8},testID:`tm-preview-toggle-${i.sourceId}-${i.item.key}`,accessibilityRole:"checkbox",accessibilityState:{checked:!(!S.applies||i.excluded)},accessibilityLabel:`Include ${i.item.label}`,children:o(Y,{state:!S.applies||i.excluded?"none":"all"})}),f(C,{style:n.itemBodyTouch,onPress:()=>z&&D(),disabled:!z,testID:h,children:[o(u,{style:[n.itemGlyph,{color:S.color}],children:S.glyph}),f(m,{style:n.itemBody,children:[o(u,{style:n.itemLabel,numberOfLines:1,testID:`${h}-label`,children:i.item.label}),i.item.verdict==="changed"&&f(u,{style:n.itemPreview,numberOfLines:1,testID:`${h}-values`,children:[B(i.item.oldValue)," \u2192"," ",B(i.item.newValue)]}),i.item.verdict==="added"&&o(u,{style:n.itemPreview,numberOfLines:1,testID:`${h}-values`,children:B(i.item.newValue)}),i.item.verdict==="removed"&&o(u,{style:[n.itemPreview,n.itemPreviewRemoved],numberOfLines:1,testID:`${h}-values`,children:B(i.item.oldValue)}),i.excluded?o(u,{style:n.itemExcluded,testID:`${h}-excluded`,children:"excluded \u2014 restore leaves this untouched"}):i.item.reason&&o(u,{style:n.itemReason,numberOfLines:2,testID:`${h}-reason`,children:i.item.reason})]}),z?x?o(de,{size:16,color:t.color.labelTertiary}):o(ue,{}):null]})]})})});export function RestorePreviewScreen({preview:r,snapshots:i,busy:x,onBack:D,onRestore:V}){const S=He();const $=S.instanceId!==void 0;const z=Pe({minBottom:16});const[h,he]=G({});const[g,F]=G(new Set);const H=_(false);const[A,ge]=G(U);const Q=T(e=>{ge(l=>{const a=new Set(l);if(a.has(e))a.delete(e);else a.add(e);return a})},[]);const M=S.search;const c=r.right==="current"?void 0:i.find(e=>e.id===r.right.snapshotId);const j=_(c);j.current=c;const X=T(()=>{if(!j.current)return;const e=j.current;void W.setRestoreRoute(e.id,!me(e))},[]);const v=c?.baseline===true;const ye=r.left==="current";const R=N(()=>{if(!c)return null;return c.excludedKeys?.length?new Set(c.excludedKeys):U},[c]);const O=!!c?.scope?.length&&!c?.excludedKeys?.length;const Z=N(()=>{if(!O||!c?.scope)return U;const e=new Set(c.scope);const l=new Set;for(const a of r.sources){for(const s of a.items){const p=I(a.id,s.key);if(P[s.verdict].applies&&!e.has(p)){l.add(p)}}}return l},[O,c,r.sources]);const ee=_(null);ae(()=>{if(!c||r.building||!R)return;if(ee.current===c.id)return;ee.current=c.id;H.current=false;const e=R.size>0?R:Z;if(e.size>0)F(new Set(e));if(O&&e.size>0){void W.setExclusions(c.id,Array.from(e))}},[c,r.building,R,Z,O]);ae(()=>{if(!c||!R||!H.current)return;if(Be(g,R))return;const e=Array.from(g);void W.setExclusions(c.id,e.length?e:null)},[g,c,R]);const te=T(e=>{H.current=true;F(l=>{const a=new Set(l);if(a.has(e))a.delete(e);else a.add(e);return a})},[]);const oe=T((e,l)=>{H.current=true;F(a=>{const s=new Set(a);for(const p of e.items){if(!P[p.verdict].applies)continue;const k=I(e.id,p.key);if(l==="all")s.add(k);else s.delete(k)}return s})},[]);const ne=T((e,l)=>{he(a=>({...a,[e]:!l}))},[]);const y=N(()=>{let e=0;let l=0;let a=0;const s=[];for(const p of r.sources){let k=0;for(const b of p.items){const L=P[b.verdict];if(L.applies){if(g.has(I(p.id,b.key)))l+=1;else{e+=1;k+=1}}else if(b.verdict==="wont-apply")a+=1}if(k>0)s.push(`${k} ${p.label.toLowerCase()}`)}return{applies:e,excludedCount:l,wontApply:a,perSource:s}},[r.sources,g]);we($?{title:"Restore Preview",subtitle:c?.name??"preview",onBack:D,actions:o(Ae,{armId:c?.id})}:null,[$,c?.name,c?.id]);const{rows:be,blockedSources:ie}=N(()=>{const e=M.trim().toLowerCase();const l=[];const a=[];for(const s of r.sources){const p=s.items.some(d=>d.verdict!=="unchanged");if(!p&&!s.error)continue;const k=p||s.notes.length>0||!!s.error;const b=s.items.filter(d=>P[d.verdict].applies);const L=s.items.filter(d=>d.verdict==="wont-apply").length;if(L>0)a.push(s.label);const Ie=s.items.length===1?(pe[s.id]??"items").replace(/ies$/,"y").replace(/s$/,""):pe[s.id]??"items";const ve=`${s.items.length} ${Ie} \xB7 `+(b.length>0?`${b.length} changed`:L>0?`${L} won't apply`:"no changes");const le=b.filter(d=>g.has(I(s.id,d.key))).length;const Re=b.length===0||le===0?"all":le===b.length?"none":"some";const E={added:0,removed:0,changed:0};for(const d of s.items){if(g.has(I(s.id,d.key)))continue;if(d.verdict==="added")E.added+=1;else if(d.verdict==="removed")E.removed+=1;else if(d.verdict==="changed"||d.verdict==="too-large")E.changed+=1}const Te=s.items.filter(d=>{if(d.verdict==="unchanged")return false;if(e&&!d.label.toLowerCase().includes(e))return false;return true});const se=k?h[s.id]??true:true;l.push({kind:"source",source:s,collapsed:se,includeState:Re,applicableCount:b.length,counts:E,expandable:k,summary:ve,first:false,last:false});if(!se){for(const d of s.notes){l.push({kind:"note",id:`${s.id}:${d}`,text:d,first:false,last:false})}if(s.error){l.push({kind:"note",id:`${s.id}:err`,text:`\u26A0 ${s.error}`,first:false,last:false})}for(const d of Te){const ce=I(s.id,d.key);l.push({kind:"item",sourceId:s.id,item:d,excluded:g.has(ce),first:false,last:false});if(A.has(ce)){l.push({kind:"diff",sourceId:s.id,item:d,first:false,last:false})}}}}if(c?.route){l.push({kind:"route",href:c.route.href,on:me(c),first:false,last:false})}if(l.length>0){l[0].first=true;l[l.length-1].last=true}return{rows:l,blockedSources:a}},[r.sources,M,h,g,A,c]);const xe=T(({item:e})=>{if(e.kind==="source"){const l=e.source;const{counts:a}=e;return o(w,{position:e,children:f(m,{style:n.sourceCard,children:[o(C,{onPress:()=>oe(l,e.includeState),disabled:e.applicableCount===0,hitSlop:{top:10,bottom:10,left:8,right:8},testID:`tm-preview-source-toggle-${l.id}`,children:o(Y,{state:e.applicableCount===0?"none":e.includeState})}),f(C,{style:n.sourceCardTouch,onPress:()=>e.expandable&&ne(l.id,e.collapsed),disabled:!e.expandable,testID:`tm-preview-source-${l.id}`,children:[f(m,{style:n.sourceNameBlock,children:[o(u,{style:n.sourceName,numberOfLines:1,testID:`tm-preview-source-${l.id}-name`,children:l.label}),o(u,{style:n.sourceSummary,numberOfLines:1,testID:`tm-preview-source-${l.id}-summary`,children:e.includeState==="none"&&e.applicableCount>0?`${e.summary} \xB7 excluded`:e.summary})]}),f(m,{style:n.sourceBadges,children:[a.removed>0?o(J,{glyph:"\u2212",count:a.removed,color:t.color.danger,testID:`tm-preview-source-${l.id}-removed`}):null,a.added>0?o(J,{glyph:"+",count:a.added,color:t.color.accent,testID:`tm-preview-source-${l.id}-added`}):null,a.changed>0?o(J,{glyph:"\u2248",count:a.changed,color:t.color.info,testID:`tm-preview-source-${l.id}-changed`}):null]}),e.expandable?e.collapsed?o(ue,{}):o(de,{size:16,color:t.color.labelTertiary}):null]})]})})}if(e.kind==="note"){return o(w,{position:e,children:o(u,{style:n.noteRow,testID:`tm-preview-note-${e.id}`,children:e.text})})}if(e.kind==="route"){return o(w,{position:e,children:f(C,{style:n.routeRow,onPress:X,accessibilityRole:"switch",accessibilityState:{checked:e.on},accessibilityLabel:`Also return to ${e.href}`,testID:"tm-preview-route",children:[o(Y,{state:e.on?"all":"none"}),f(m,{style:n.routeText,children:[o(u,{style:n.routeTitle,children:"Return to this screen"}),o(u,{style:n.routeHref,numberOfLines:1,testID:"tm-preview-route-href",children:e.href})]})]})})}if(e.kind==="diff"){return o(w,{position:e,children:o(Ee,{item:e.item,testID:`tm-preview-diff-${e.sourceId}-${e.item.key}`})})}return o(Ve,{row:e,expanded:A.has(I(e.sourceId,e.item.key)),onOpen:()=>Q(I(e.sourceId,e.item.key)),onToggle:()=>te(I(e.sourceId,e.item.key))})},[A,Q,ne,te,oe,X]);const Se=T(e=>{if(e.kind==="source")return`s:${e.source.id}`;if(e.kind==="note")return`n:${e.id}`;if(e.kind==="route")return"route";if(e.kind==="diff")return`d:${e.sourceId}:${e.item.key}`;return`i:${e.sourceId}:${e.item.key}`},[]);const ke=f(m,{children:[!$&&f(m,{style:n.fallbackHeader,children:[o(C,{onPress:D,hitSlop:Fe,testID:"tm-preview-back",children:o(u,{style:n.backText,children:"\u2039 Back"})}),o(u,{style:n.screenTitle,numberOfLines:1,children:"Restore Preview"})]}),c?f(We,{children:[o(fe,{children:"Restore Point"}),o(Oe,{children:o(Ne,{name:c.name,onRename:e=>void W.rename(c.id,e)})})]}):null,o(fe,{children:"Changes to Restore"})]});const re=x||r.building||y.applies===0;return f(m,{style:n.container,children:[o($e,{testID:"tm-preview-list",data:be,renderItem:xe,keyExtractor:Se,ListHeaderComponent:ke,ListEmptyComponent:r.building?o(De,{style:n.buildingSpinner,size:"small",color:t.color.accent}):o(u,{style:n.emptyText,testID:"tm-preview-empty",children:M?"Nothing matches this filter.":"No changes \u2014 restoring would change nothing."}),ListFooterComponent:o(m,{children:y.wontApply>0?f(m,{style:n.warnNote,children:[o(ze,{size:12,color:t.color.warning}),f(u,{style:n.warnNoteText,testID:"tm-preview-wont-apply",children:[y.wontApply," item",y.wontApply===1?"":"s"," ","won't apply \u2014 expand"," ",ie.length>0?ie.join(" and "):"the source"," ","to see the reason."]})]}):null}),keyboardShouldPersistTaps:"handled",removeClippedSubviews:true,initialNumToRender:20,windowSize:7,contentContainerStyle:n.listContent}),ye&&c&&f(m,{style:[n.footer,{paddingBottom:z.bottom}],children:[f(C,{style:[n.cta,v&&n.ctaDanger,re&&n.ctaDisabled],onPress:()=>V(v?"reload":"live",Array.from(g)),disabled:v?x||r.building:re,testID:"tm-preview-restore",children:[o(Le,{size:16,color:v?t.color.onDanger:t.color.onAccent}),o(u,{style:[n.ctaText,v?n.ctaTextDanger:null],children:v?"Wipe & Reload":"Restore State"})]}),o(u,{style:n.ctaCaption,testID:"tm-preview-cta-caption",children:v?"This wipes all app storage and reloads the app.":y.excludedCount>0?`Restores ${y.applies} of ${y.applies+y.excludedCount} change${y.applies+y.excludedCount===1?"":"s"} \u2014 everything else stays as it is.`:"This will replace the current state with the snapshot."})]})]})}const Fe={top:10,bottom:10,left:10,right:10};const n=K.create({container:{flex:1,backgroundColor:"transparent"},fallbackHeader:{flexDirection:"row",alignItems:"center",paddingHorizontal:t.gutter,paddingVertical:10,gap:10},backText:{color:t.color.accent,fontSize:t.font.control},screenTitle:{color:t.color.label,fontSize:20,fontWeight:"700",letterSpacing:t.tracking.row,flex:1},dimmed:{opacity:.5},listContent:{paddingTop:14,paddingBottom:12},cardRow:{marginHorizontal:t.gutter,backgroundColor:t.color.group},cardRowFirst:{borderTopLeftRadius:t.radius.group,borderTopRightRadius:t.radius.group},cardRowLast:{borderBottomLeftRadius:t.radius.group,borderBottomRightRadius:t.radius.group,marginBottom:10},cardSeparator:{height:K.hairlineWidth,marginLeft:51,backgroundColor:t.color.separator},warnNote:{flexDirection:"row",alignItems:"flex-start",gap:6,paddingHorizontal:t.gutter+t.textInset,paddingTop:8},warnNoteText:{flex:1,color:t.color.labelSecondary,fontSize:t.font.footnote,lineHeight:t.font.footnote*1.35},countPill:{borderRadius:t.radius.pill,paddingHorizontal:9,paddingVertical:3},countPillText:{fontFamily:q,fontSize:t.font.footnote,fontWeight:"600"},checkbox:{width:23,height:23,borderRadius:t.radius.pill,borderWidth:1.7,borderColor:t.color.labelTertiary,alignItems:"center",justifyContent:"center"},checkboxChecked:{borderColor:t.color.accent,backgroundColor:t.color.accent},checkboxGlyph:{color:t.color.onAccent,fontSize:13,fontWeight:"700",lineHeight:15},routeRow:{flexDirection:"row",alignItems:"center",minHeight:58,paddingHorizontal:t.textInset,paddingVertical:9,gap:12},routeText:{flex:1,minWidth:0,gap:2},routeTitle:{color:t.color.label,fontSize:t.font.row,fontWeight:"600",letterSpacing:t.tracking.row},routeHref:{color:t.color.labelSecondary,fontFamily:q,fontSize:t.font.mono},sourceCard:{flexDirection:"row",alignItems:"center",minHeight:58,paddingHorizontal:t.textInset,paddingVertical:9,gap:12},sourceCardTouch:{flex:1,flexDirection:"row",alignItems:"center",gap:12,minWidth:0},sourceNameBlock:{flex:1,minWidth:0,gap:2},sourceName:{color:t.color.label,fontSize:t.font.row,fontWeight:"600",letterSpacing:t.tracking.row},sourceSummary:{color:t.color.labelSecondary,fontSize:t.font.footnote,fontVariant:["tabular-nums"]},sourceBadges:{flexDirection:"row",gap:6},noteRow:{color:t.color.labelTertiary,fontSize:t.font.footnote,lineHeight:t.font.footnote*1.35,paddingHorizontal:t.textInset,paddingVertical:9},itemRow:{flexDirection:"row",alignItems:"center",paddingLeft:t.textInset,paddingRight:t.textInset,paddingVertical:10,gap:12},itemBodyTouch:{flex:1,flexDirection:"row",alignItems:"center",gap:10,minWidth:0},itemGlyph:{fontSize:14,fontWeight:"700",width:14,textAlign:"center"},itemBody:{flex:1,minWidth:0},itemLabel:{color:t.color.label,fontSize:t.font.control,letterSpacing:t.tracking.control},itemPreview:{color:t.color.labelSecondary,fontFamily:q,fontSize:t.font.mono,marginTop:3},itemPreviewRemoved:{textDecorationLine:"line-through"},itemReason:{color:t.color.warning,fontSize:t.font.mono,marginTop:3},itemExcluded:{color:t.color.labelTertiary,fontSize:t.font.mono,marginTop:3,fontStyle:"italic"},buildingSpinner:{marginTop:28},emptyText:{color:t.color.labelSecondary,fontSize:t.font.footnote,textAlign:"center",marginTop:28},footer:{paddingHorizontal:t.gutter,paddingTop:10,gap:8,borderTopColor:t.color.separator,borderTopWidth:K.hairlineWidth,backgroundColor:t.color.sheet},cta:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:8,height:50,backgroundColor:t.color.accent,borderRadius:t.radius.group},ctaDanger:{backgroundColor:t.color.danger},ctaTextDanger:{color:t.color.onDanger},ctaDisabled:{opacity:.4},ctaText:{color:t.color.onAccent,fontSize:t.font.row,fontWeight:"600",letterSpacing:t.tracking.row},ctaCaption:{color:t.color.labelSecondary,fontSize:t.font.footnote,lineHeight:t.font.footnote*1.35,textAlign:"center"}});