import { createRoot } from "react-dom/client";
import "./index.css";
import { patchWebStorage } from "./lib/patchWebStorage";
import { initNativeShell } from "./lib/nativeShell";
import { initDeviceUi } from "./lib/initDeviceUi";
import { prefetchForYouFeedAtBoot } from "./lib/forYouFeedCache";

patchWebStorage();
prefetchForYouFeedAtBoot();

/**
 * Dev-only: ensure no production PWA service worker controls the dev server.
 * A stale SW can hijack requests and cause odd flashes before the app loads.
 */
async function unregisterServiceWorkersInDev(): Promise<void> {
  if (!import.meta.env.DEV) return;
  if (!("serviceWorker" in navigator)) return;

  const url = new URL(window.location.href);
  if (url.searchParams.has("swdevreset")) return;

  try {
    const regs = await navigator.serviceWorker.getRegistrations();
    if (regs.length === 0) return;
    await Promise.all(regs.map((reg) => reg.unregister()));

    // Avoid deleting caches globally; just hard-refresh once.
    url.searchParams.set("swdevreset", String(Date.now()));
    window.location.replace(url.toString());
  } catch (e) {
    console.warn("[dev] SW unregister skipped:", e);
  }
}

void unregisterServiceWorkersInDev();

/** Standalone PWA: direct naar For You vóór React mount (voorkomt flash van Pulseboard). */
function applyStandaloneLaunchRedirect(): void {
  const standalone =
    window.matchMedia("(display-mode: standalone)").matches ||
    !!(navigator as Navigator & { standalone?: boolean }).standalone;
  if (!standalone) return;

  const path = window.location.pathname;
  if (path.startsWith("/auth/callback") || path.startsWith("/reset-password")) return;

  if (path !== "/") {
    window.history.replaceState(null, "", "/");
  }
}

applyStandaloneLaunchRedirect();
initDeviceUi();
void initNativeShell();

/**
 * Eenmalige SW/cache reset fallback voor hardnekkige witte PWA schermen.
 * Draait 1x per browser-profiel en slaat auth/reset routes over.
 */
async function runOneTimeServiceWorkerResetFallback(): Promise<void> {
  if (!import.meta.env.PROD) return;
  if (import.meta.env.VITE_ENABLE_SW_RESET !== "true") return;

  const resetKey = "pulse_sw_reset_v1_done";
  const path = window.location.pathname;
  if (path.startsWith("/auth/callback") || path.startsWith("/reset-password")) return;

  const url = new URL(window.location.href);
  if (url.searchParams.has("swreset")) return;

  try {
    if (localStorage.getItem(resetKey) === "1") return;
  } catch {
    // storage kan geblokkeerd zijn; dan gewoon proberen
  }

  if (!("serviceWorker" in navigator)) return;

  try {
    const regs = await navigator.serviceWorker.getRegistrations();
    await Promise.all(regs.map((reg) => reg.unregister()));

    if ("caches" in window) {
      const keys = await caches.keys();
      await Promise.all(keys.map((k) => caches.delete(k)));
    }

    try {
      localStorage.setItem(resetKey, "1");
    } catch {
      // no-op
    }

    // Harde cache-bust na cleanup
    const url = new URL(window.location.href);
    url.searchParams.set("swreset", String(Date.now()));
    window.location.replace(url.toString());
  } catch (err) {
    console.warn("SW reset fallback mislukt", err);
  }
}

void runOneTimeServiceWorkerResetFallback();

// Warm For You chunk before React paints (PWA / home screen)
if (
  window.matchMedia("(display-mode: standalone)").matches ||
  !!(navigator as Navigator & { standalone?: boolean }).standalone
) {
  void import("./pages/Index");
}

const rootEl = document.getElementById("root");
if (!rootEl) {
  throw new Error("Root element #root not found");
}

// Dynamic import ensures our storage patch runs before any module that might
// touch localStorage/sessionStorage (e.g. auth client init).
import("./App.tsx")
  .then(({ default: App }) => {
    createRoot(rootEl).render(<App />);
  })
  .catch((err) => {
    console.error("Failed to boot app", err);

    // Never show a blank screen.
    rootEl.innerHTML = `
      <div style="min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;">
        <div style="max-width:520px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;">
          <h1 style="margin:0 0 8px;font-size:18px;">App kon niet laden</h1>
          <p style="margin:0 0 12px;opacity:.8;line-height:1.4;">Ververs de pagina. Als dit blijft gebeuren, zit er waarschijnlijk een browser storage (localStorage) blokkade of een corrupte cache.</p>
          <pre style="white-space:pre-wrap;word-break:break-word;opacity:.8;font-size:12px;">${String(err?.message || err)}</pre>
        </div>
      </div>
    `;
  });