@buoy-gg/network 7.0.41 → 7.0.43

package/lib/commonjs/network/components/NetworkListScreen.web.js

@@ -1,624 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NetworkListScreen = NetworkListScreen;
-var _react = require("react");
-var _NetworkEventItemCompact = require("./NetworkEventItemCompact.web");
-var _useNetworkEventList = require("../hooks/useNetworkEventList");
-var _useNetworkSaved = require("../hooks/useNetworkSaved");
-var _useOverrideRules = require("../hooks/useOverrideRules");
-var _overriddenRows = require("../overrides/overriddenRows");
-var _withPinnedFirst = require("../utils/withPinnedFirst");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * NetworkListScreen.web — DOM twin of NetworkListScreen.tsx.
- *
- * The network tool's LIST screen: owns the event-store subscription, the
- * scrolling list, the OVERRIDDEN and PINNED strips, empty state, disabled
- * banner, and the free-tier locked-history footer. Identical prop contract,
- * hook usage and derivation order as the native file — the data layer is
- * REUSED, not forked (`useNetworkEventList`, `useNetworkSaved`,
- * `useOverrideRules`, `ruleMatches`, `splitPinned` are all platform-free).
- *
- * Stable-tree contract (rule4): hooks run unconditionally, then the
- * component returns null when not visible. The subscription is gated with
- * `paused || !visible` so a hidden list doesn't subscribe at all.
- *
- * shared-ui RN chrome is replicated as DOM with provenance (web consumers
- * resolve `@buoy-gg/shared-ui` to a minimal shim):
- *  - `macOSColors` / `buoyColors` — inlined verbatim subsets from
- *    shared/src/ui/gameUI/constants/.
- *  - Icons — inline lucide SVGs (shared-ui's icons are lucide re-exports).
- *  - `NetworkUpgradeBanner` (which itself leans on shared-ui `ProBadge` +
- *    `Zap`) — inlined DOM twin below, values from
- *    NetworkUpgradeBanner.tsx + license/FeatureGate.tsx `proBadge` styles.
- *
- * Intentional deviations (all logged):
- *  - FlatList virtualization → a plain scrolled div. The store caps at 500
- *    events and web rows are cheap DOM; the window/batch tuning the native
- *    list carries is a FlatList-only concern.
- *    (`extraData={savedLiveIds}` is likewise moot — plain `map` has no
- *    PureComponent bail-out to bust.)
- *  - The upgrade banner's `ProBadge` renders the static gold "PRO" — the
- *    Weekend Pass variant reads `useProAccess` from @buoy-gg/license, which
- *    is not part of the web port.
- *  - `onEventPress` opens the detail view (ported in F3 as
- *    NetworkEventDetailView.web / NetworkDetailScreen.web) — callers wire the
- *    prop to `networkSelectionStore.select`, the screen just calls it
- *    (native behavior; nothing stubbed here).
- *  - Native's row tap opens the detail view and long-press toggles the pin;
- *    both are wired identically here (long-press = 500ms pointer hold, see
- *    NetworkEventItemCompact.web).
- *
- * F4 integration point: `ignoredPatterns` is a prop (same as native). The
- * native root feeds it from shared-ui's persisted `useIgnoredPatterns` store,
- * which the web shim does not expose — web hosts pass `[]` until the filter
- * feature lands.
- *
- * @platform React DOM Web
- */
-
-// =============================
-// Native palettes (provenance)
-// =============================
-
-/** macOSColors subset — shared/src/ui/gameUI/constants/macOSDesignSystemColors.ts, verbatim. */const macOSColors = {
-  background: {
-    card: "#1A1A1C"
-  },
-  border: {
-    default: "#2D2D2F"
-  },
-  text: {
-    primary: "#F5F5F7",
-    muted: "#8E8E93"
-  },
-  semantic: {
-    warning: "#FFEB3B",
-    warningBackground: "rgba(255, 235, 59, 0.15)",
-    info: "#00B8E6"
-  }
-};
-
-/** buoyColors subset — shared/src/ui/gameUI/constants/gameUIColors.ts (macOS theme), verbatim. */
-const buoy = {
-  card: "#1A1A1A",
-  text: "#E0E0E0",
-  textMuted: "#888888",
-  primary: "#20C997"
-};
-
-// =============================
-// Inline lucide icons (shared-ui icons are lucide re-exports)
-// =============================
-
-function Svg({
-  size = 14,
-  color = "currentColor",
-  children
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: color,
-    strokeWidth: 2,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    style: {
-      flexShrink: 0,
-      display: "block"
-    },
-    children: children
-  });
-}
-const Globe = p => /*#__PURE__*/(0, _jsxRuntime.jsxs)(Svg, {
-  ...p,
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("circle", {
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M2 12h20"
-  })]
-});
-const Pin = ({
-  active,
-  ...p
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Svg, {
-  ...p,
-  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("g", {
-    transform: active ? "rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)" : undefined,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M2.97 21.03 8.18 15.82"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M4.4 10.81 13.19 19.6"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M5.17 10.54 11.43 8.83"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "M13.46 18.83 15.17 12.57"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-      x: "12.15",
-      y: "5.4",
-      width: "9.38",
-      height: "3.52",
-      rx: "1.07",
-      transform: "rotate(-45 16.84 7.16)"
-    })]
-  })
-});
-const Power = p => /*#__PURE__*/(0, _jsxRuntime.jsxs)(Svg, {
-  ...p,
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M12 2v10"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M18.4 6.6a9 9 0 1 1-12.77.04"
-  })]
-});
-const FlaskConical = p => /*#__PURE__*/(0, _jsxRuntime.jsxs)(Svg, {
-  ...p,
-  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M8.5 2h7"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-    d: "M7 16h10"
-  })]
-});
-const Zap = p => /*#__PURE__*/(0, _jsxRuntime.jsx)(Svg, {
-  ...p,
-  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("polygon", {
-    points: "13 2 3 14 12 14 11 22 21 10 12 10 13 2"
-  })
-});
-
-// =============================
-// NetworkUpgradeBanner DOM twin (provenance: NetworkUpgradeBanner.tsx +
-// license/FeatureGate.tsx proBadge styles; ProBadge is static "PRO" — see
-// the deviations log)
-// =============================
-
-function NetworkUpgradeBannerWeb({
-  title,
-  subtitle,
-  onPress
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
-    type: "button",
-    style: styles.upgradeBanner,
-    onClick: onPress,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-      style: styles.upgradeContent,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        style: styles.upgradeLeft,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Zap, {
-          size: 16,
-          color: buoy.primary
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          style: styles.upgradeTitle,
-          children: title
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        style: styles.proBadge,
-        children: "PRO"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      style: styles.upgradeSubtitle,
-      children: subtitle
-    })]
-  });
-}
-
-// =============================
-// Screen (structure mirrors the native file 1:1)
-// =============================
-
-function EmptyState({
-  isEnabled
-}) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: styles.emptyState,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Globe, {
-      size: 32,
-      color: macOSColors.text.muted
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      style: styles.emptyTitle,
-      children: "No network events"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      style: styles.emptyText,
-      children: isEnabled ? "Network requests will appear here" : "Enable interception to start capturing"
-    })]
-  });
-}
-
-/**
- * The PINNED strip above the live list. Renders OUTSIDE the scrolled list on
- * purpose — pins ignore the filters, are bounded at MAX_PINNED in the store,
- * and keeping them out of the list keeps the boundary from moving as events
- * arrive (same rationale as native).
- */
-function PinnedSection({
-  events,
-  onEventPress,
-  onLongPress,
-  savedLiveIds,
-  onClearPinned
-}) {
-  if (events.length === 0) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: styles.pinnedSection,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      style: styles.pinnedHeader,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Pin, {
-        size: 11,
-        active: true,
-        color: macOSColors.semantic.info
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        style: styles.pinnedTitle,
-        children: ["PINNED \xB7 ", events.length]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-        type: "button",
-        onClick: onClearPinned,
-        style: styles.pinnedClear,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          style: styles.pinnedClearText,
-          children: "Unpin all"
-        })
-      })]
-    }), events.map(event => /*#__PURE__*/(0, _jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact, {
-      event: event,
-      onPress: onEventPress,
-      onLongPress: onLongPress,
-      pinned: true,
-      saved: savedLiveIds.has(event.id)
-    }, event.id))]
-  });
-}
-
-/**
- * The OVERRIDDEN strip, above the pins. Rows are matched against the RULES
- * rather than filtered on the `override` mark, and the header button is
- * PAUSE, not "Manage" — same reasoning as native (see NetworkListScreen.tsx).
- */
-function OverriddenSection({
-  events,
-  onEventPress,
-  onLongPress,
-  savedLiveIds,
-  paused,
-  onTogglePaused
-}) {
-  if (events.length === 0) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: {
-      ...styles.overriddenSection,
-      ...(paused ? styles.overriddenSectionOff : null)
-    },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      style: styles.overriddenHeader,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(FlaskConical, {
-        size: 11,
-        color: paused ? macOSColors.text.muted : macOSColors.semantic.warning
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        style: {
-          ...styles.overriddenTitle,
-          ...(paused ? styles.overriddenTitleOff : null)
-        },
-        children: paused ? `PAUSED · ${events.length}` : `OVERRIDDEN · ${events.length}`
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-        type: "button",
-        onClick: onTogglePaused,
-        style: styles.overriddenManage,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          style: {
-            ...styles.overriddenManageText,
-            ...(paused ? styles.overriddenTitleOff : null)
-          },
-          children: paused ? "Resume" : "Pause"
-        })
-      })]
-    }), events.map(event => /*#__PURE__*/(0, _jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact, {
-      event: event,
-      onPress: onEventPress,
-      onLongPress: onLongPress,
-      overridden: true,
-      saved: savedLiveIds.has(event.id)
-    }, event.id))]
-  });
-}
-function NetworkListScreen({
-  visible,
-  paused,
-  filter,
-  ignoredPatterns,
-  isPro,
-  searchText,
-  onEventPress,
-  onUpgradePress
-}) {
-  const {
-    visibleEvents,
-    hasLockedEvents,
-    lockedEventCount
-  } = (0, _useNetworkEventList.useNetworkEventList)({
-    filter,
-    ignoredPatterns,
-    paused: paused || !visible,
-    isPro
-  });
-
-  // Pins come from the persisted saved store, NOT from the live list — that is
-  // what lets a pinned failure survive Clear, the 500-event cap and a reload.
-  const {
-    pinnedEvents,
-    pinnedLiveIds,
-    savedLiveIds,
-    togglePin,
-    clearPinned
-  } = (0, _useNetworkSaved.useNetworkSaved)();
-
-  // Which rules are live right now — the strip below reflects the rules, not
-  // the history, so it's correct the moment a rule is made or removed.
-  const {
-    rules,
-    enabled: overridesEnabled,
-    setEnabled,
-    isRuleSpent
-  } = (0, _useOverrideRules.useOverrideRules)();
-
-  // Stable identity: handed to memoized rows.
-  const handleLongPress = (0, _react.useCallback)(event => {
-    togglePin(event);
-  }, [togglePin]);
-
-  // Everything above is a hook and must run unconditionally; everything below
-  // is work (same rule4 contract as native).
-  if (!visible) return null;
-  const {
-    pinned,
-    rest
-  } = (0, _withPinnedFirst.splitPinned)(visibleEvents, pinnedEvents, pinnedLiveIds);
-
-  // Hoist anything an active rule covers. Done after `splitPinned` so a request
-  // that is both pinned and overridden appears once, in the louder section.
-  const activeRules = rules.filter(rule => rule.enabled && !isRuleSpent(rule));
-  const overridden = (0, _overriddenRows.overriddenEvents)([...pinned, ...rest], activeRules);
-  const overriddenIds = new Set(overridden.map(event => event.id));
-  const pinnedRows = pinned.filter(event => !overriddenIds.has(event.id));
-  const restRows = overriddenIds.size ? rest.filter(event => !overriddenIds.has(event.id)) : rest;
-  const isEnabled = !paused;
-  const renderListFooter = () => {
-    if (!hasLockedEvents) return null;
-    const isSearching = searchText.length > 0;
-    const bannerText = isSearching ? `${lockedEventCount} matching ${lockedEventCount === 1 ? "request" : "requests"} in locked history` : `${lockedEventCount} requests locked`;
-    const subtextMessage = isSearching ? "Upgrade to Pro to search your full request history" : "Upgrade to Pro to unlock full request history";
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(NetworkUpgradeBannerWeb, {
-      title: bannerText,
-      subtitle: subtextMessage,
-      onPress: onUpgradePress
-    });
-  };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    style: styles.root,
-    children: [!isEnabled ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      style: styles.disabledBanner,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Power, {
-        size: 14,
-        color: macOSColors.semantic.warning
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        style: styles.disabledText,
-        children: "Network interception is disabled"
-      })]
-    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(OverriddenSection, {
-      events: overridden,
-      onEventPress: onEventPress,
-      onLongPress: handleLongPress,
-      savedLiveIds: savedLiveIds,
-      paused: !overridesEnabled,
-      onTogglePaused: () => setEnabled(!overridesEnabled)
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PinnedSection, {
-      events: pinnedRows,
-      onEventPress: onEventPress,
-      onLongPress: handleLongPress,
-      savedLiveIds: savedLiveIds,
-      onClearPinned: clearPinned
-    }), restRows.length > 0 || hasLockedEvents ?
-    /*#__PURE__*/
-    // DEVIATION: FlatList → plain scrolled div (see file header). The
-    // list still OWNS scrolling — hosts render this screen without a
-    // scroll wrapper (JsModal's `disableScrollWrapper`), same as native.
-    (0, _jsxRuntime.jsx)("div", {
-      style: styles.list,
-      "aria-label": "Network events list",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        style: styles.listContent,
-        children: [restRows.map(item => /*#__PURE__*/(0, _jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact, {
-          event: item,
-          onPress: onEventPress,
-          onLongPress: handleLongPress,
-          saved: savedLiveIds.has(item.id)
-        }, item.id)), renderListFooter()]
-      })
-    }) : pinnedRows.length > 0 || overridden.length > 0 ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(EmptyState, {
-      isEnabled: isEnabled
-    })]
-  });
-}
-
-// Values mirror the native StyleSheet block 1:1.
-const styles = {
-  root: {
-    display: "flex",
-    flexDirection: "column",
-    flex: 1,
-    minHeight: 0
-  },
-  /**
-   * The strip is separated from the live list by a real rule, not just space:
-   * these rows do NOT obey the filters, and the boundary is what tells the
-   * user why a request they just filtered out is still on screen.
-   */
-  overriddenSection: {
-    borderBottom: `1px solid ${macOSColors.semantic.warning}44`,
-    backgroundColor: macOSColors.semantic.warningBackground
-  },
-  overriddenSectionOff: {
-    borderBottom: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.card
-  },
-  overriddenTitleOff: {
-    color: macOSColors.text.muted
-  },
-  overriddenHeader: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    padding: "8px 12px 4px"
-  },
-  overriddenTitle: {
-    flex: 1,
-    fontSize: 10,
-    fontWeight: 700,
-    letterSpacing: 0.8,
-    color: macOSColors.semantic.warning
-  },
-  overriddenManage: {
-    padding: "2px 6px",
-    background: "none",
-    border: "none",
-    cursor: "pointer",
-    margin: 0
-  },
-  overriddenManageText: {
-    fontSize: 10,
-    fontWeight: 600,
-    color: macOSColors.semantic.warning
-  },
-  pinnedSection: {
-    borderBottom: `1px solid ${macOSColors.border.default}`,
-    paddingBottom: 4
-  },
-  pinnedHeader: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    padding: "10px 20px 6px"
-  },
-  pinnedTitle: {
-    flex: 1,
-    color: macOSColors.semantic.info,
-    fontSize: 10,
-    fontWeight: 700,
-    letterSpacing: 0.6,
-    fontFamily: "ui-monospace, Menlo, monospace"
-  },
-  pinnedClear: {
-    padding: "2px 6px",
-    background: "none",
-    border: "none",
-    cursor: "pointer",
-    margin: 0
-  },
-  pinnedClearText: {
-    color: macOSColors.text.muted,
-    fontSize: 10
-  },
-  disabledBanner: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8,
-    padding: 10,
-    margin: "8px 12px 0",
-    backgroundColor: macOSColors.semantic.warningBackground,
-    borderRadius: 8,
-    border: `1px solid ${macOSColors.semantic.warning}20`
-  },
-  disabledText: {
-    color: macOSColors.semantic.warning,
-    fontSize: 11,
-    flex: 1
-  },
-  list: {
-    flex: 1,
-    minHeight: 0,
-    overflowY: "auto"
-  },
-  listContent: {
-    paddingTop: 8
-  },
-  emptyState: {
-    display: "flex",
-    flexDirection: "column",
-    alignItems: "center",
-    padding: "40px 0"
-  },
-  emptyTitle: {
-    color: macOSColors.text.primary,
-    fontSize: 14,
-    fontWeight: 600,
-    marginTop: 12,
-    marginBottom: 6
-  },
-  emptyText: {
-    color: macOSColors.text.muted,
-    fontSize: 12,
-    textAlign: "center"
-  },
-  // NetworkUpgradeBanner.tsx values (buoyColors), verbatim.
-  upgradeBanner: {
-    display: "block",
-    width: "calc(100% - 24px)",
-    boxSizing: "border-box",
-    backgroundColor: buoy.card,
-    borderRadius: 10,
-    border: `1px solid ${buoy.primary}40`,
-    padding: 12,
-    margin: "12px 12px 34px",
-    textAlign: "left",
-    cursor: "pointer",
-    fontFamily: "inherit"
-  },
-  upgradeContent: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between",
-    marginBottom: 4
-  },
-  upgradeLeft: {
-    display: "inline-flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8
-  },
-  upgradeTitle: {
-    color: buoy.text,
-    fontSize: 13,
-    fontWeight: 600
-  },
-  upgradeSubtitle: {
-    display: "block",
-    color: buoy.textMuted,
-    fontSize: 11
-  },
-  // license/FeatureGate.tsx `proBadge`/`proBadgeText`, verbatim.
-  proBadge: {
-    display: "inline-flex",
-    backgroundColor: `${buoy.primary}15`,
-    borderRadius: 4,
-    border: `1px solid ${buoy.primary}40`,
-    padding: "2px 6px",
-    fontSize: 10,
-    fontWeight: 700,
-    color: buoy.primary,
-    letterSpacing: 0.5
-  }
-};
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.NetworkListScreen=NetworkListScreen;var _react=require("react");var _NetworkEventItemCompact=require("./NetworkEventItemCompact.web");var _useNetworkEventList=require("../hooks/useNetworkEventList");var _useNetworkSaved=require("../hooks/useNetworkSaved");var _useOverrideRules=require("../hooks/useOverrideRules");var _overriddenRows=require("../overrides/overriddenRows");var _withPinnedFirst=require("../utils/withPinnedFirst");var _jsxRuntime=require("react/jsx-runtime");const macOSColors={background:{card:"#1A1A1C"},border:{default:"#2D2D2F"},text:{primary:"#F5F5F7",muted:"#8E8E93"},semantic:{warning:"#FFEB3B",warningBackground:"rgba(255, 235, 59, 0.15)",info:"#00B8E6"}};const buoy={card:"#1A1A1A",text:"#E0E0E0",textMuted:"#888888",primary:"#20C997"};function Svg({size:e=14,color:t="currentColor",children:i}){return(0,_jsxRuntime.jsx)("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:t,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:i})}const Globe=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,_jsxRuntime.jsx)("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"}),(0,_jsxRuntime.jsx)("path",{d:"M2 12h20"})]});const Pin=({active:e,...t})=>(0,_jsxRuntime.jsx)(Svg,{...t,children:(0,_jsxRuntime.jsxs)("g",{transform:e?"rotate(-45 12 12) translate(12 12) scale(0.92) translate(-12 -12)":void 0,children:[(0,_jsxRuntime.jsx)("path",{d:"M2.97 21.03 8.18 15.82"}),(0,_jsxRuntime.jsx)("path",{d:"M4.4 10.81 13.19 19.6"}),(0,_jsxRuntime.jsx)("path",{d:"M5.17 10.54 11.43 8.83"}),(0,_jsxRuntime.jsx)("path",{d:"M13.46 18.83 15.17 12.57"}),(0,_jsxRuntime.jsx)("rect",{x:"12.15",y:"5.4",width:"9.38",height:"3.52",rx:"1.07",transform:"rotate(-45 16.84 7.16)"})]})});const Power=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M12 2v10"}),(0,_jsxRuntime.jsx)("path",{d:"M18.4 6.6a9 9 0 1 1-12.77.04"})]});const FlaskConical=e=>(0,_jsxRuntime.jsxs)(Svg,{...e,children:[(0,_jsxRuntime.jsx)("path",{d:"M10 2v7.527a2 2 0 0 1-.211.896L4.72 20.55a1 1 0 0 0 .9 1.45h12.76a1 1 0 0 0 .9-1.45l-5.069-10.127A2 2 0 0 1 14 9.527V2"}),(0,_jsxRuntime.jsx)("path",{d:"M8.5 2h7"}),(0,_jsxRuntime.jsx)("path",{d:"M7 16h10"})]});const Zap=e=>(0,_jsxRuntime.jsx)(Svg,{...e,children:(0,_jsxRuntime.jsx)("polygon",{points:"13 2 3 14 12 14 11 22 21 10 12 10 13 2"})});function NetworkUpgradeBannerWeb({title:e,subtitle:t,onPress:i}){return(0,_jsxRuntime.jsxs)("button",{type:"button",style:styles.upgradeBanner,onClick:i,children:[(0,_jsxRuntime.jsxs)("span",{style:styles.upgradeContent,children:[(0,_jsxRuntime.jsxs)("span",{style:styles.upgradeLeft,children:[(0,_jsxRuntime.jsx)(Zap,{size:16,color:buoy.primary}),(0,_jsxRuntime.jsx)("span",{style:styles.upgradeTitle,children:e})]}),(0,_jsxRuntime.jsx)("span",{style:styles.proBadge,children:"PRO"})]}),(0,_jsxRuntime.jsx)("span",{style:styles.upgradeSubtitle,children:t})]})}function EmptyState({isEnabled:e}){return(0,_jsxRuntime.jsxs)("div",{style:styles.emptyState,children:[(0,_jsxRuntime.jsx)(Globe,{size:32,color:macOSColors.text.muted}),(0,_jsxRuntime.jsx)("div",{style:styles.emptyTitle,children:"No network events"}),(0,_jsxRuntime.jsx)("div",{style:styles.emptyText,children:e?"Network requests will appear here":"Enable interception to start capturing"})]})}function PinnedSection({events:e,onEventPress:t,onLongPress:i,savedLiveIds:d,onClearPinned:r}){if(e.length===0)return null;return(0,_jsxRuntime.jsxs)("div",{style:styles.pinnedSection,children:[(0,_jsxRuntime.jsxs)("div",{style:styles.pinnedHeader,children:[(0,_jsxRuntime.jsx)(Pin,{size:11,active:true,color:macOSColors.semantic.info}),(0,_jsxRuntime.jsxs)("span",{style:styles.pinnedTitle,children:["PINNED \xB7 ",e.length]}),(0,_jsxRuntime.jsx)("button",{type:"button",onClick:r,style:styles.pinnedClear,children:(0,_jsxRuntime.jsx)("span",{style:styles.pinnedClearText,children:"Unpin all"})})]}),e.map(o=>(0,_jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact,{event:o,onPress:t,onLongPress:i,pinned:true,saved:d.has(o.id)},o.id))]})}function OverriddenSection({events:e,onEventPress:t,onLongPress:i,savedLiveIds:d,paused:r,onTogglePaused:o}){if(e.length===0)return null;return(0,_jsxRuntime.jsxs)("div",{style:{...styles.overriddenSection,...r?styles.overriddenSectionOff:null},children:[(0,_jsxRuntime.jsxs)("div",{style:styles.overriddenHeader,children:[(0,_jsxRuntime.jsx)(FlaskConical,{size:11,color:r?macOSColors.text.muted:macOSColors.semantic.warning}),(0,_jsxRuntime.jsx)("span",{style:{...styles.overriddenTitle,...r?styles.overriddenTitleOff:null},children:r?`PAUSED \xB7 ${e.length}`:`OVERRIDDEN \xB7 ${e.length}`}),(0,_jsxRuntime.jsx)("button",{type:"button",onClick:o,style:styles.overriddenManage,children:(0,_jsxRuntime.jsx)("span",{style:{...styles.overriddenManageText,...r?styles.overriddenTitleOff:null},children:r?"Resume":"Pause"})})]}),e.map(s=>(0,_jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact,{event:s,onPress:t,onLongPress:i,overridden:true,saved:d.has(s.id)},s.id))]})}function NetworkListScreen({visible:e,paused:t,filter:i,ignoredPatterns:d,isPro:r,searchText:o,onEventPress:s,onUpgradePress:b}){const{visibleEvents:k,hasLockedEvents:g,lockedEventCount:l}=(0,_useNetworkEventList.useNetworkEventList)({filter:i,ignoredPatterns:d,paused:t||!e,isPro:r});const{pinnedEvents:w,pinnedLiveIds:S,savedLiveIds:a,togglePin:h,clearPinned:C}=(0,_useNetworkSaved.useNetworkSaved)();const{rules:E,enabled:f,setEnabled:P,isRuleSpent:T}=(0,_useOverrideRules.useOverrideRules)();const c=(0,_react.useCallback)(n=>{h(n)},[h]);if(!e)return null;const{pinned:m,rest:p}=(0,_withPinnedFirst.splitPinned)(k,w,S);const L=E.filter(n=>n.enabled&&!T(n));const x=(0,_overriddenRows.overriddenEvents)([...m,...p],L);const u=new Set(x.map(n=>n.id));const v=m.filter(n=>!u.has(n.id));const y=u.size?p.filter(n=>!u.has(n.id)):p;const j=!t;const B=()=>{if(!g)return null;const n=o.length>0;const N=n?`${l} matching ${l===1?"request":"requests"} in locked history`:`${l} requests locked`;const M=n?"Upgrade to Pro to search your full request history":"Upgrade to Pro to unlock full request history";return(0,_jsxRuntime.jsx)(NetworkUpgradeBannerWeb,{title:N,subtitle:M,onPress:b})};return(0,_jsxRuntime.jsxs)("div",{style:styles.root,children:[!j?(0,_jsxRuntime.jsxs)("div",{style:styles.disabledBanner,children:[(0,_jsxRuntime.jsx)(Power,{size:14,color:macOSColors.semantic.warning}),(0,_jsxRuntime.jsx)("span",{style:styles.disabledText,children:"Network interception is disabled"})]}):null,(0,_jsxRuntime.jsx)(OverriddenSection,{events:x,onEventPress:s,onLongPress:c,savedLiveIds:a,paused:!f,onTogglePaused:()=>P(!f)}),(0,_jsxRuntime.jsx)(PinnedSection,{events:v,onEventPress:s,onLongPress:c,savedLiveIds:a,onClearPinned:C}),y.length>0||g?(0,_jsxRuntime.jsx)("div",{style:styles.list,"aria-label":"Network events list",children:(0,_jsxRuntime.jsxs)("div",{style:styles.listContent,children:[y.map(n=>(0,_jsxRuntime.jsx)(_NetworkEventItemCompact.NetworkEventItemCompact,{event:n,onPress:s,onLongPress:c,saved:a.has(n.id)},n.id)),B()]})}):v.length>0||x.length>0?null:(0,_jsxRuntime.jsx)(EmptyState,{isEnabled:j})]})}const styles={root:{display:"flex",flexDirection:"column",flex:1,minHeight:0},overriddenSection:{borderBottom:`1px solid ${macOSColors.semantic.warning}44`,backgroundColor:macOSColors.semantic.warningBackground},overriddenSectionOff:{borderBottom:`1px solid ${macOSColors.border.default}`,backgroundColor:macOSColors.background.card},overriddenTitleOff:{color:macOSColors.text.muted},overriddenHeader:{display:"flex",flexDirection:"row",alignItems:"center",gap:6,padding:"8px 12px 4px"},overriddenTitle:{flex:1,fontSize:10,fontWeight:700,letterSpacing:.8,color:macOSColors.semantic.warning},overriddenManage:{padding:"2px 6px",background:"none",border:"none",cursor:"pointer",margin:0},overriddenManageText:{fontSize:10,fontWeight:600,color:macOSColors.semantic.warning},pinnedSection:{borderBottom:`1px solid ${macOSColors.border.default}`,paddingBottom:4},pinnedHeader:{display:"flex",flexDirection:"row",alignItems:"center",gap:6,padding:"10px 20px 6px"},pinnedTitle:{flex:1,color:macOSColors.semantic.info,fontSize:10,fontWeight:700,letterSpacing:.6,fontFamily:"ui-monospace, Menlo, monospace"},pinnedClear:{padding:"2px 6px",background:"none",border:"none",cursor:"pointer",margin:0},pinnedClearText:{color:macOSColors.text.muted,fontSize:10},disabledBanner:{display:"flex",flexDirection:"row",alignItems:"center",gap:8,padding:10,margin:"8px 12px 0",backgroundColor:macOSColors.semantic.warningBackground,borderRadius:8,border:`1px solid ${macOSColors.semantic.warning}20`},disabledText:{color:macOSColors.semantic.warning,fontSize:11,flex:1},list:{flex:1,minHeight:0,overflowY:"auto"},listContent:{paddingTop:8},emptyState:{display:"flex",flexDirection:"column",alignItems:"center",padding:"40px 0"},emptyTitle:{color:macOSColors.text.primary,fontSize:14,fontWeight:600,marginTop:12,marginBottom:6},emptyText:{color:macOSColors.text.muted,fontSize:12,textAlign:"center"},upgradeBanner:{display:"block",width:"calc(100% - 24px)",boxSizing:"border-box",backgroundColor:buoy.card,borderRadius:10,border:`1px solid ${buoy.primary}40`,padding:12,margin:"12px 12px 34px",textAlign:"left",cursor:"pointer",fontFamily:"inherit"},upgradeContent:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:4},upgradeLeft:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:8},upgradeTitle:{color:buoy.text,fontSize:13,fontWeight:600},upgradeSubtitle:{display:"block",color:buoy.textMuted,fontSize:11},proBadge:{display:"inline-flex",backgroundColor:`${buoy.primary}15`,borderRadius:4,border:`1px solid ${buoy.primary}40`,padding:"2px 6px",fontSize:10,fontWeight:700,color:buoy.primary,letterSpacing:.5}};