import { trackEvent } from "./analytics.js";
import {
  getAppAccessLevel,
  getPendingProtectedAction,
  setPendingProtectedAction,
} from "./state.js";

/** @type {((action: string) => void) | null} */
let geoGateHandler = null;

/** @type {{ waiter?: () => void, bill?: () => void }} */
let protectedActionHandlers = {};

export function setGeoGateHandler(handler) {
  geoGateHandler = handler;
}

export function setProtectedActionHandlers(handlers) {
  protectedActionHandlers = handlers || {};
}

export function updateNavAccessState() {
  const locked = getAppAccessLevel() === "menu";
  ["navStatus", "navWaiter", "navBill"].forEach((id) => {
    const el = document.getElementById(id);
    if (el) el.classList.toggle("nav-locked", locked);
  });
  const banner = document.getElementById("menuOnlyBanner");
  if (banner) {
    banner.classList.remove("hidden");
    banner.classList.toggle("is-hidden", getAppAccessLevel() !== "menu");
  }
}

export function showBottomNav() {
  const bottomNav = document.getElementById("bottomNav");
  if (bottomNav) bottomNav.style.display = "";
  updateNavAccessState();
}

export function requireFullAccess(action, onGranted) {
  if (getAppAccessLevel() === "full") {
    onGranted();
    return;
  }
  setPendingProtectedAction(action);
  trackEvent("geo_gate_prompted", { action });
  if (getAppAccessLevel() === "menu") {
    trackEvent("geo_retry_from_menu", { action });
  }
  geoGateHandler?.(action);
}

export function runPendingProtectedAction() {
  const action = getPendingProtectedAction();
  setPendingProtectedAction(null);
  if (!action) return;

  setTimeout(() => {
    if (action === "status") switchTabInternal("status");
    else if (action === "waiter") protectedActionHandlers.waiter?.();
    else if (action === "bill") protectedActionHandlers.bill?.();
  }, 150);
}

export function switchTabInternal(tabName) {
  // 1. Zdejmij .active z widoków i ikonek nav
  document.querySelectorAll(".view-section").forEach((el) => el.classList.add("hidden"));
  document.querySelectorAll(".view-section").forEach((el) => el.classList.remove("active"));

  document.getElementById("navStatus").classList.remove("active");
  document.getElementById("navMenu").classList.remove("active");

  const header = document.getElementById("mainHeader");
  const greetingBanner = document.getElementById("greetingBanner");

  // 2. Nadaj .active wybranym elementom
  if (tabName === "status") {
    trackEvent("view_status");
    const view = document.getElementById("statusView");
    view.classList.remove("hidden");
    view.classList.add("active");
    document.getElementById("navStatus").classList.add("active");
    if (header) header.style.display = "";
    if (greetingBanner && greetingBanner.innerHTML.trim() !== "") greetingBanner.style.display = "";
  } else if (tabName === "menu") {
    trackEvent("view_menu", { flow: getAppAccessLevel() === "menu" ? "menu_only" : "full_app" });
    const view = document.getElementById("menuView");
    view.classList.remove("hidden");
    view.classList.add("active");
    document.getElementById("navMenu").classList.add("active");
    if (header) header.style.display = "none";
    if (greetingBanner) greetingBanner.style.display = "none";
  }
  window.scrollTo(0, 0);
}

export function switchTab(tabName) {
  if (tabName === "menu") {
    switchTabInternal("menu");
    return;
  }
  if (tabName === "status") {
    requireFullAccess("status", () => switchTabInternal("status"));
  }
}

export function promptGeoForFullAccess() {
  const pending = getPendingProtectedAction() || "status";
  setPendingProtectedAction(pending);
  trackEvent("geo_gate_prompted", { action: pending, source: "menu_banner" });
  trackEvent("geo_retry_from_menu", { action: pending, source: "menu_banner" });
  geoGateHandler?.(pending);
}