import { getPaths } from "yt-dlp-transcript-common/lib/paths";
import { cleanableTotalBytes } from "../cleanup/lib/loadCleanup";
import { CleanableBadgeLive } from "./SidebarBadges";

// The sidebar's reclaimable-disk pill, as its own async component so the layout
// can stream it behind a Suspense boundary.
//
// ⚠️ Read this before moving the boundary: a Suspense boundary in the ROOT
// LAYOUT does nothing for sibling navigation. On a client navigation Next only
// re-renders below the layout the source and destination share — for two
// sidebar links that shared layout IS this one, so it is not re-rendered at all
// and this component never re-suspends. The boundary exists for the two cases
// where the layout DOES render: a full document load, and router.refresh().
//
// It matters for those because loading.tsx cannot cover a layout's own async
// work — "if the layout accesses uncached or runtime data, loading.js will not
// show a fallback for it; navigation blocks until the layout finishes
// rendering". This is hardening rather than a fix: after the corpus walk was
// removed from cleanableTotalBytes it costs ~40 ms, not ~4.4 s. The point is
// that it can never put the whole document behind it again.
// The server render produces the SEED; CleanableBadgeLive keeps it current from
// the shared pulse poller thereafter, so this number no longer depends on the
// layout being re-rendered.
export async function CleanableBadge() {
  const bytes = await cleanableTotalBytes(getPaths());
  return <CleanableBadgeLive seed={bytes} />;
}