@buoy-gg/assets 7.0.29 → 7.0.31

package/src/capture/measure.ts

@@ -1,167 +0,0 @@
-/**
- * Byte-size measurement.
- *
- * Dev only in practice: each scale variant is fetched from the Metro dev
- * server (HEAD first for Content-Length, GET-blob fallback since Metro
- * doesn't reliably answer HEAD) and the per-variant sizes are summed onto
- * the record. Android release resource ids and iOS file:// URIs are not
- * measurable from JS — those records keep `estDecodedBytes` as their only
- * size signal and the UI marks them as estimates.
- */
-
-import { assetsState } from "../state";
-import { getSnapshot, invalidate, updateRecord } from "../store/assetStore";
-import { getDevServerOrigin } from "./metroGraph";
-import type { AssetRecord } from "../types";
-
-const CONCURRENCY = 4;
-
-/**
- * Best displayable URL for a record: the resolved runtime URI, or (dev) the
- * same dev-server URL the measurement pass uses — this is what gives graph-
- * only (never-loaded) images real thumbnails.
- */
-export function previewURL(record: AssetRecord): string | null {
-  if (record.resolvedUri) return record.resolvedUri;
-  const variants = variantURLs(record);
-  return variants.length ? variants[0]!.url : null;
-}
-
-/**
- * Image source for thumbnails/previews. On device the NUMERIC registry id is
- * preferred (resolves natively — works for Android release resource ids too).
- * On dashboard mirrors that id belongs to the DEVICE's registry and rn-web
- * throws "asset with ID N could not be found" — use the device's http(s)
- * URL instead (the Metro dev server is reachable from the desktop).
- */
-export function displaySource(
-  record: AssetRecord
-): number | { uri: string } | null {
-  const mirror = assetsState().captureDisabled;
-  if (!mirror && record.registryId != null) return record.registryId;
-  const uri = previewURL(record);
-  if (!uri) return null;
-  if (mirror && !/^https?:\/\//.test(uri)) return null;
-  return { uri };
-}
-
-/** All scale-variant URLs for a record, derived without re-encoding pitfalls. */
-export function variantURLs(record: AssetRecord): Array<{ scale: number; url: string }> {
-  const scales = record.scales.length ? record.scales : [1];
-
-  // Preferred: string surgery on the URL resolveAssetSource already proved
-  // works (handles Expo's ?unstable_path= form and monorepo rewrites).
-  const resolved = record.resolvedUri;
-  if (resolved && /^https?:\/\//.test(resolved) && record.resolvedScale != null) {
-    const pickedSuffix = record.resolvedScale === 1 ? "" : `@${record.resolvedScale}x`;
-    const marker = `${pickedSuffix}.${record.type}`;
-    if (resolved.includes(marker) || pickedSuffix === "") {
-      return scales.map((scale) => {
-        const suffix = scale === 1 ? "" : `@${scale}x`;
-        const url = (
-          pickedSuffix === ""
-            ? resolved.replace(`.${record.type}`, `${suffix}.${record.type}`)
-            : resolved.replace(marker, `${suffix}.${record.type}`)
-        ).replace(/ /g, "%20"); // RN's asset path builder doesn't encode spaces
-        return { scale, url };
-      });
-    }
-  }
-
-  // Graph-only records: rebuild the dev-server URL the way Metro's
-  // AssetSourceResolver does (plain concatenation), encoding only spaces —
-  // full encodeURI would double-encode Expo's pre-escaped unstable_path.
-  const origin = getDevServerOrigin();
-  if (!origin || !record.httpServerLocation) return [];
-  return scales.map((scale) => {
-    const suffix = scale === 1 ? "" : `@${scale}x`;
-    const path = `${record.httpServerLocation}/${record.name}${suffix}.${record.type}`;
-    const sep = path.includes("?") ? "&" : "?";
-    const url = `${origin}${path}${sep}platform=${platformName()}${
-      record.hash ? `&hash=${record.hash}` : ""
-    }`.replace(/ /g, "%20");
-    return { scale, url };
-  });
-}
-
-function platformName(): string {
-  try {
-    return require("react-native").Platform.OS;
-  } catch {
-    return "ios";
-  }
-}
-
-async function fetchSize(url: string): Promise<number | null> {
-  try {
-    const head = await fetch(url, { method: "HEAD" });
-    if (head.ok) {
-      const length = Number(head.headers.get("content-length"));
-      if (Number.isFinite(length) && length > 0) return length;
-    }
-  } catch {
-    // fall through to GET
-  }
-  try {
-    const response = await fetch(url);
-    if (!response.ok) return null;
-    const blob = await response.blob();
-    return blob.size > 0 ? blob.size : null;
-  } catch {
-    return null;
-  }
-}
-
-async function measureRecord(record: AssetRecord): Promise<void> {
-  const variants = variantURLs(record);
-  if (!variants.length) {
-    updateRecord(record.id, { sizeSource: "estimate" });
-    return;
-  }
-  const sizesByScale: Record<string, number> = {};
-  let total = 0;
-  for (const { scale, url } of variants) {
-    const size = await fetchSize(url);
-    if (size != null) {
-      sizesByScale[String(scale)] = size;
-      total += size;
-    }
-  }
-  if (total > 0) {
-    updateRecord(record.id, { sizesByScale, sizeBytes: total, sizeSource: "measured" });
-  } else {
-    updateRecord(record.id, { sizeSource: "estimate" });
-  }
-}
-
-/** Measure every unmeasured record; safe to re-run (skips measured ones). */
-export async function measureSizes(): Promise<{ measured: number; total: number }> {
-  const s = assetsState();
-  if (s.measuring) return { measured: s.measuredCount, total: getSnapshot().length };
-  const pending = getSnapshot().filter((r) => r.sizeSource !== "measured");
-  s.measuring = true;
-  invalidate();
-  try {
-    let index = 0;
-    const worker = async () => {
-      for (;;) {
-        const next = pending[index++];
-        if (!next) return;
-        await measureRecord(next);
-        s.measuredCount = getSnapshot().filter(
-          (r) => r.sizeSource === "measured"
-        ).length;
-      }
-    };
-    await Promise.all(
-      Array.from({ length: Math.min(CONCURRENCY, pending.length) }, worker)
-    );
-  } finally {
-    s.measuring = false;
-    invalidate();
-  }
-  return {
-    measured: s.measuredCount,
-    total: getSnapshot().length,
-  };
-}

package/src/capture/metroGraph.ts

@@ -1,146 +0,0 @@
-/**
- * Metro dev-server graph fetch.
- *
- * The dev server serves `<entry>.assets` next to `<entry>.bundle` — the full
- * dependency graph's AssetData[], INCLUDING assets never required at runtime
- * and the `fileSystemLocation`/`files` fields Metro strips from runtime
- * records. Deriving the URL by swapping `.bundle` → `.assets` on the running
- * bundle's scriptURL keeps the entry path and platform/dev query params
- * intact for both RN CLI (index.bundle) and Expo (…/entry.bundle) layouts.
- *
- * Graph-only records (in the graph, not the registry) are exactly the
- * "shipped but never loaded" set. Dev-only: no server, no graph.
- */
-
-import { assetsState } from "../state";
-import { assetKey, invalidate, upsertRecord } from "../store/assetStore";
-
-interface GraphAssetData {
-  __packager_asset?: boolean;
-  fileSystemLocation?: string;
-  httpServerLocation: string;
-  width?: number | null;
-  height?: number | null;
-  scales: number[];
-  files?: string[];
-  fileHashes?: string[];
-  hash: string;
-  name: string;
-  type: string;
-}
-
-export function getScriptURL(): string | null {
-  try {
-    const { NativeModules } = require("react-native");
-    const sourceCode = NativeModules?.SourceCode;
-    const url: unknown =
-      sourceCode?.getConstants?.().scriptURL ?? sourceCode?.scriptURL;
-    return typeof url === "string" ? url : null;
-  } catch {
-    return null;
-  }
-}
-
-/** http(s) origin of the Metro dev server, or null when running embedded. */
-export function getDevServerOrigin(): string | null {
-  const scriptURL = getScriptURL();
-  const match = scriptURL?.match(/^https?:\/\/[^/]+/);
-  return match ? match[0] : null;
-}
-
-/**
- * Candidate graph URLs, most-likely first. The straight `.bundle`→`.assets`
- * swap works for RN CLI, but Expo dev builds serve a VIRTUAL entry
- * (.expo/.virtual-metro-entry.bundle) that only exists for .bundle requests —
- * its .assets twin 404s — so the real entry modules are tried next, keeping
- * the original query string (platform/dev/etc.) intact.
- */
-export function getGraphURLCandidates(): string[] {
-  const scriptURL = getScriptURL();
-  if (!scriptURL || !/^https?:\/\//.test(scriptURL)) return [];
-  const origin = getDevServerOrigin();
-  const queryIndex = scriptURL.indexOf("?");
-  const query = queryIndex >= 0 ? scriptURL.slice(queryIndex) : "?platform=ios&dev=true";
-  const candidates: string[] = [];
-  if (scriptURL.includes(".bundle")) {
-    candidates.push(scriptURL.replace(".bundle", ".assets"));
-  }
-  if (origin) {
-    candidates.push(
-      `${origin}/node_modules/expo-router/entry.assets${query}`,
-      `${origin}/node_modules/expo/AppEntry.assets${query}`,
-      `${origin}/index.assets${query}`
-    );
-  }
-  return candidates;
-}
-
-/** Fetch the full asset graph from the dev server and merge it into the store. */
-export async function fetchAssetGraph(): Promise<
-  { ok: true; count: number } | { ok: false; message: string }
-> {
-  const s = assetsState();
-  const candidates = getGraphURLCandidates();
-  if (!candidates.length) {
-    s.graphSupported = false;
-    s.graphError = "No Metro dev server (embedded bundle)";
-    invalidate();
-    return { ok: false, message: s.graphError };
-  }
-  if (s.graphFetchInFlight) return { ok: false, message: "Graph fetch already running" };
-  s.graphFetchInFlight = true;
-  try {
-    let data: unknown = null;
-    let lastError = "";
-    for (const url of candidates) {
-      try {
-        const response = await fetch(url);
-        if (!response.ok) {
-          lastError = `Metro responded ${response.status} for ${url}`;
-          continue;
-        }
-        const parsed: unknown = await response.json();
-        if (Array.isArray(parsed)) {
-          data = parsed;
-          break;
-        }
-        lastError = "Unexpected .assets payload shape";
-      } catch (error) {
-        lastError = String((error as Error)?.message ?? error);
-      }
-    }
-    if (!Array.isArray(data)) throw new Error(lastError || "No graph endpoint answered");
-    const graph = data as GraphAssetData[];
-    for (const asset of graph) {
-      if (!asset || typeof asset.name !== "string" || typeof asset.type !== "string") {
-        continue;
-      }
-      upsertRecord({
-        key: assetKey(asset.httpServerLocation, asset.name, asset.type),
-        name: asset.name,
-        type: asset.type,
-        origin: "graph",
-        hash: asset.hash,
-        httpServerLocation: asset.httpServerLocation,
-        width: asset.width ?? undefined,
-        height: asset.height ?? undefined,
-        scales: asset.scales,
-        fileSystemLocation: asset.fileSystemLocation,
-        files: asset.files,
-        fileHashes: asset.fileHashes,
-      });
-    }
-    s.graphSupported = true;
-    s.graphCount = graph.length;
-    s.graphError = null;
-    invalidate();
-    return { ok: true, count: graph.length };
-  } catch (error) {
-    s.graphSupported = getDevServerOrigin() != null;
-    s.graphError = String((error as Error)?.message ?? error);
-    invalidate();
-    return { ok: false, message: s.graphError };
-  } finally {
-    s.graphFetchInFlight = false;
-  }
-}

package/src/capture/registry.ts

@@ -1,137 +0,0 @@
-/**
- * Runtime access to @react-native/assets-registry.
- *
- * Asset ids are contiguous 1..N (`assets.push` return value), so a plain
- * getAssetByID walk enumerates every asset registered so far — including
- * everything registered BEFORE this tool was evaluated. That's why, unlike
- * the images tool, there is no "must be the first import" requirement here:
- * the walk backfills whatever the patch missed.
- *
- * registerAsset is patched (plain non-frozen CommonJS export, looked up at
- * call time by Metro's generated asset modules) purely for LIVE updates as
- * lazily-required assets register later.
- */
-
-import { upsertRecord, assetKey } from "../store/assetStore";
-import type { AssetRecord } from "../types";
-
-/** Runtime shape of a registry entry (fileSystemLocation/files are stripped by Metro). */
-export interface PackagerAsset {
-  __packager_asset: boolean;
-  httpServerLocation: string;
-  width?: number | null;
-  height?: number | null;
-  scales: number[];
-  hash: string;
-  name: string;
-  type: string;
-}
-
-interface RegistryModule {
-  registerAsset: (asset: PackagerAsset) => number;
-  getAssetByID: (assetId: number) => PackagerAsset | undefined;
-}
-
-let cachedRegistry: RegistryModule | null | undefined;
-
-export function getRegistryModule(): RegistryModule | null {
-  if (cachedRegistry !== undefined) return cachedRegistry;
-  let mod: RegistryModule | null = null;
-  try {
-    mod = require("@react-native/assets-registry/registry");
-  } catch {
-    // Old RN layouts (< 0.72) don't ship @react-native/assets-registry as a
-    // resolvable package — the registry only exists at this deep path. RN's
-    // deep-import deprecation warning fires when this executes, but it only
-    // executes on those old layouts, where there is no other way in.
-    try {
-      mod = require("react-native/Libraries/Image/AssetRegistry");
-    } catch {
-      mod = null;
-    }
-  }
-  cachedRegistry =
-    mod && typeof mod.getAssetByID === "function" ? mod : null;
-  return cachedRegistry;
-}
-
-/** resolveAssetSource(id) → this environment's URI (dev URL / file:// / res id). */
-export function resolveRegistryAsset(
-  registryId: number
-): { uri: string; scale: number } | null {
-  try {
-    const { Image } = require("react-native");
-    const resolved = Image.resolveAssetSource(registryId);
-    if (resolved && typeof resolved.uri === "string") {
-      return { uri: resolved.uri, scale: resolved.scale ?? 1 };
-    }
-  } catch {
-    // resolution is enrichment — never let it break the walk
-  }
-  return null;
-}
-
-export function upsertFromPackagerAsset(
-  registryId: number,
-  asset: PackagerAsset
-): AssetRecord {
-  const resolved = resolveRegistryAsset(registryId);
-  return upsertRecord({
-    key: assetKey(asset.httpServerLocation, asset.name, asset.type),
-    name: asset.name,
-    type: asset.type,
-    origin: "registry",
-    registryId,
-    hash: asset.hash,
-    httpServerLocation: asset.httpServerLocation,
-    width: asset.width ?? undefined,
-    height: asset.height ?? undefined,
-    scales: asset.scales,
-    resolvedUri: resolved?.uri,
-    resolvedScale: resolved?.scale,
-    loaded: true,
-  });
-}
-
-/** Enumerate every asset registered so far. Returns the highest id seen. */
-export function walkRegistry(): number {
-  const registry = getRegistryModule();
-  if (!registry) return 0;
-  let id = 0;
-  for (;;) {
-    const asset = registry.getAssetByID(id + 1);
-    if (!asset) break;
-    id++;
-    upsertFromPackagerAsset(id, asset);
-  }
-  return id;
-}
-
-const PATCH_MARKER = "__buoyAssetsPatched";
-
-/**
- * Wrap registerAsset so future registrations stream in live. Safe to call
- * more than once (marker guard); the walk covers anything registered before.
- */
-export function patchRegisterAsset(): boolean {
-  const registry = getRegistryModule();
-  if (!registry) return false;
-  const original = registry.registerAsset;
-  if ((original as unknown as Record<string, unknown>)[PATCH_MARKER]) return true;
-  const wrapped = (asset: PackagerAsset): number => {
-    const id = original.call(registry, asset);
-    try {
-      upsertFromPackagerAsset(id, asset);
-    } catch {
-      // never break app asset registration
-    }
-    return id;
-  };
-  (wrapped as unknown as Record<string, unknown>)[PATCH_MARKER] = true;
-  try {
-    registry.registerAsset = wrapped;
-  } catch {
-    return false;
-  }
-  return true;
-}

package/src/components/AssetDetail.tsx

@@ -1,207 +0,0 @@
-/**
- * AssetDetail — full metadata for one asset: preview, identity, dimensions,
- * per-scale sizes, resolution info, and which audit findings apply.
- *
- * Image previews render through the numeric registry id (works in every
- * environment); fonts render a pangram with fontFamily set to the asset name
- * — a best-effort guess (family ≠ filename for many fonts) that falls back
- * to the system font silently when it misses.
- */
-
-import { Image, ScrollView, StyleSheet, Text, View } from "react-native";
-import { night } from "@buoy-gg/shared-ui";
-import { displaySource } from "../capture/measure";
-import { formatBytes, formatDimensions, formatScales } from "../format";
-import { estDecodedBytes } from "../store/assetStore";
-import type { AssetRecord, AssetsInsights } from "../types";
-
-interface AssetDetailProps {
-  record: AssetRecord;
-  insights: AssetsInsights;
-}
-
-function Row({ label, value }: { label: string; value: string }) {
-  return (
-    <View style={styles.kvRow}>
-      <Text style={styles.kvLabel}>{label}</Text>
-      <Text style={styles.kvValue} selectable>
-        {value}
-      </Text>
-    </View>
-  );
-}
-
-function Preview({ record }: { record: AssetRecord }) {
-  if (record.kind === "image") {
-    const source = displaySource(record);
-    if (source == null) return null;
-    return (
-      <View style={styles.previewBox}>
-        <Image
-          testID="buoy-internal-assets-preview"
-          source={source}
-          style={styles.previewImage}
-          resizeMode="contain"
-        />
-      </View>
-    );
-  }
-  if (record.kind === "font") {
-    return (
-      <View style={styles.previewBox}>
-        <Text style={[styles.fontPreview, { fontFamily: record.name }]}>
-          The quick brown fox jumps over the lazy dog 0123456789
-        </Text>
-      </View>
-    );
-  }
-  return null;
-}
-
-export function AssetDetail({ record, insights }: AssetDetailProps) {
-  const findings: string[] = [];
-  if (insights.neverLoaded.includes(record.id)) {
-    findings.push("Never loaded — shipped in the bundle but no code required it");
-  }
-  if (insights.scaleGaps.includes(record.id)) {
-    findings.push("Scale gap — no variant covers this device's pixel ratio");
-  }
-  if (insights.webpCandidates.includes(record.id)) {
-    findings.push("WebP candidate — large png/jpeg, converting typically saves 20–40%");
-  }
-  const duplicate = insights.duplicates.find((d) => d.ids.includes(record.id));
-  if (duplicate) {
-    findings.push(
-      `Duplicate content — identical bytes shipped ${duplicate.ids.length} times`
-    );
-  }
-  if (insights.overDecode.includes(record.id)) {
-    findings.push(
-      "Decodes larger than 2× this entire screen — resize the source, no view can need this many pixels"
-    );
-  }
-  if (insights.heavyGifs.includes(record.id)) {
-    findings.push(
-      "Heavy GIF — every frame decodes into memory; a video or Lottie is typically ~90% smaller"
-    );
-  }
-  if (insights.heavyFonts.includes(record.id)) {
-    findings.push(
-      "Heavy font — likely an unsubset icon font; subsetting to used glyphs usually saves most of it"
-    );
-  }
-  if (insights.scaleAnomalies.includes(record.id)) {
-    findings.push(
-      "Scale anomaly — a higher-resolution variant is smaller in bytes than a lower one; check the exports"
-    );
-  }
-
-  const estimate = estDecodedBytes(record);
-
-  return (
-    <ScrollView style={styles.scroll} contentContainerStyle={styles.content}>
-      <Preview record={record} />
-
-      {findings.length > 0 ? (
-        <View style={styles.findings}>
-          {findings.map((finding) => (
-            <Text key={finding} style={styles.findingText}>
-              {finding}
-            </Text>
-          ))}
-        </View>
-      ) : null}
-
-      <Row label="Name" value={`${record.name}.${record.type}`} />
-      <Row label="Kind" value={record.kind} />
-      <Row
-        label="Status"
-        value={record.loaded ? "Loaded (registered at runtime)" : "In bundle, never loaded"}
-      />
-      {record.kind === "image" ? (
-        <Row label="Dimensions" value={`${formatDimensions(record)} (logical)`} />
-      ) : null}
-      {record.kind === "image" && record.scales.length ? (
-        <Row label="Scales" value={formatScales(record.scales)} />
-      ) : null}
-
-      {record.sizesByScale
-        ? Object.entries(record.sizesByScale).map(([scale, bytes]) => (
-            <Row key={scale} label={`Size @${scale}x`} value={formatBytes(bytes)} />
-          ))
-        : null}
-      {record.sizeBytes != null && record.sizeSource === "measured" ? (
-        <Row label="Total size" value={formatBytes(record.sizeBytes)} />
-      ) : null}
-      {estimate > 0 ? (
-        <Row label="Decoded memory" value={`~${formatBytes(estimate)} (RGBA)`} />
-      ) : null}
-
-      {record.registryId != null ? (
-        <Row label="Registry id" value={String(record.registryId)} />
-      ) : null}
-      {record.hash ? <Row label="Hash" value={record.hash} /> : null}
-      {record.httpServerLocation ? (
-        <Row label="Location" value={record.httpServerLocation} />
-      ) : null}
-      {record.fileSystemLocation ? (
-        <Row label="Source dir" value={record.fileSystemLocation} />
-      ) : null}
-      {record.resolvedUri ? <Row label="Resolved URI" value={record.resolvedUri} /> : null}
-    </ScrollView>
-  );
-}
-
-const styles = StyleSheet.create({
-  scroll: {
-    flex: 1,
-  },
-  content: {
-    padding: 12,
-    gap: 8,
-  },
-  previewBox: {
-    borderRadius: 8,
-    backgroundColor: night.color.bg,
-    padding: 12,
-    alignItems: "center",
-    justifyContent: "center",
-    minHeight: 96,
-  },
-  previewImage: {
-    width: "100%",
-    height: 140,
-  },
-  fontPreview: {
-    color: night.color.text,
-    fontSize: 16,
-    textAlign: "center",
-  },
-  findings: {
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    backgroundColor: night.color.surface,
-    padding: 10,
-    gap: 6,
-  },
-  findingText: {
-    color: night.color.textSecondary,
-    fontSize: 11,
-    lineHeight: 15,
-  },
-  kvRow: {
-    gap: 2,
-  },
-  kvLabel: {
-    color: night.color.textTertiary,
-    fontSize: 9,
-    fontWeight: "700",
-    letterSpacing: 0.5,
-    textTransform: "uppercase",
-  },
-  kvValue: {
-    color: night.color.text,
-    fontSize: 12,
-  },
-});