"use client";
import React, { useEffect, useState } from "react";
import DashboardDrawer from "./drawer";
import {
  adminMenuItems,
  HRMenuItems,
  HRTenantMenuItems,
  InventoryMenuItems,
  ClientMenuItems,
  superAdminOnlyMenuItems,
  buildClientWorkspaceMenu,
} from "@/lib/menu-items";
import ClientWorkspaceRouteGuard from "@/features/client/client-workspace-route-guard";
import { ComplaintsNotifyProvider } from "@/context/complaints-notify-context";
import { workspacePersonaFromMe } from "@/lib/workspace-persona";
import DashboardHeader from "./header";
import Topbar from "./topbar";
import useIsMobile from "@/hooks/is-mobile";
import { useParams, usePathname, useRouter } from "next/navigation";
import { MenuItemProp } from "@/types/navigation/menu";
import DataService from "@/config/axios";
import { fetchMyActiveModulesDetail } from "@/platform/api/modules-api";
import { fetchMyPermissions } from "@/platform/api/access-api";
import { filterClientMenuByActiveModules } from "@/platform/lib/client-menu-filter";
import { permissionsForWorkspaceUser } from "@/platform/lib/permissions";
import { CLIENT_WORKSPACE_CHANGE_EVENT, CLIENT_WORKSPACE_STORAGE_KEY } from "@/features/client/constants";
import { ActiveTenantProvider } from "@/platform/context/active-tenant-context";
import { getTenantSlugFromLocation } from "@/lib/tenant-routing";

async function loadClientWorkspaceMenu(): Promise<MenuItemProp[]> {
  const res = await DataService.get("/user/me");
  const u = res.data?.data;
  const persona = workspacePersonaFromMe(u);
  let menu = buildClientWorkspaceMenu(persona);

  const isSuperAdmin = u?.type === "super_admin";
  let orgKey: string | null = null;
  if (isSuperAdmin) {
    try {
      orgKey = sessionStorage.getItem(CLIENT_WORKSPACE_STORAGE_KEY);
    } catch {
      orgKey = null;
    }
  } else {
    orgKey = u?.client?.clientId || null;
  }

  const active = await fetchMyActiveModulesDetail(orgKey).catch(() => ({
    moduleIds: [] as string[],
    featuresByModule: {} as Record<string, string[]>,
  }));

  let fetched: string[] = [];
  if (!isSuperAdmin && orgKey) {
    fetched = await fetchMyPermissions(orgKey).catch(() => []);
  }
  const permissions = permissionsForWorkspaceUser(u, isSuperAdmin ? ["*"] : fetched);

  return filterClientMenuByActiveModules(menu, active.moduleIds, {
    isSuperAdmin,
    permissions,
    enabledFeaturesByModule: active.featuresByModule,
  });
}

const DashboardLayout = ({
  children,
  forceApp,
}: {
  children: React.ReactNode;
  /** When set (e.g. tenant slug routes), behave as this portal without changing URL params. */
  forceApp?: string;
}) => {
  const params = useParams();
  const pathname = usePathname() || "";
  const router = useRouter();
  const slug = getTenantSlugFromLocation(pathname, params?.slug as string | undefined);
  const app =
    forceApp ||
    (params.app as string | undefined) ||
    (slug ? "client" : undefined);
  const [isOpen, setIsOpen] = useState(true);
  const [currentMenu, setCurrentMenu] = useState<MenuItemProp[]>([]);
  const isMobile = useIsMobile();
  const toggleDrawer = () => {
    setIsOpen(!isOpen);
  };

  useEffect(() => {
    if (app === "super-admin") {
      setCurrentMenu(superAdminOnlyMenuItems);
      let cancelled = false;
      (async () => {
        try {
          const res = await DataService.get("/user/me");
          const u = res.data?.data;
          if (cancelled) return;
          if (u?.type !== "super_admin") {
            const dest =
              u?.client &&
              (!u.client.enabledModules?.length ||
                u.client.enabledModules.includes("property"))
                ? "/client/dashboard"
                : "/hr/dashboard";
            router.replace(dest);
          }
        } catch {
          if (!cancelled) router.replace("/");
        }
      })();
      return () => {
        cancelled = true;
      };
    }

    if (app === "hr") {
      let cancelled = false;
      (async () => {
        try {
          const res = await DataService.get("/user/me");
          const u = res.data?.data;
          if (cancelled) return;
          if (u?.client) {
            setCurrentMenu(HRTenantMenuItems);
            return;
          }
          setCurrentMenu(HRMenuItems);
        } catch {
          if (!cancelled) setCurrentMenu(HRMenuItems);
        }
      })();
      return () => {
        cancelled = true;
      };
    }

    if (app === "inventory") {
      setCurrentMenu(InventoryMenuItems);
    } else if (app === "client" || app === "property") {
      setCurrentMenu(ClientMenuItems);
      let cancelled = false;
      (async () => {
        try {
          const menu = await loadClientWorkspaceMenu();
          if (!cancelled) setCurrentMenu(menu);
        } catch {
          if (!cancelled) setCurrentMenu(ClientMenuItems);
        }
      })();

      const onModulesChanged = () => {
        if (cancelled) return;
        loadClientWorkspaceMenu()
          .then((menu) => {
            if (!cancelled) setCurrentMenu(menu);
          })
          .catch(() => {
            /* keep current menu */
          });
      };

      window.addEventListener("nizamify:modules-changed", onModulesChanged);
      window.addEventListener(CLIENT_WORKSPACE_CHANGE_EVENT, onModulesChanged);

      return () => {
        cancelled = true;
        window.removeEventListener("nizamify:modules-changed", onModulesChanged);
        window.removeEventListener(CLIENT_WORKSPACE_CHANGE_EVENT, onModulesChanged);
      };
    } else if (app) {
      setCurrentMenu(adminMenuItems);
    }
  }, [app, router, pathname]);

  const shell = (
    <div>
      <DashboardDrawer
        isMobile={isMobile}
        menu={currentMenu}
        isOpen={isOpen}
        toggleDrawer={toggleDrawer}
      />
      <div
        className={`${!isMobile ? (isOpen ? "ml-64" : "ml-20") : ""} w-auto`}
      >
        <DashboardHeader isOpen={isOpen} toggleDrawer={toggleDrawer} />
        <Topbar />
        <div className="md:px-10 p-5 bg-gray-100 min-h-screen space-y-4">
          {app === "client" || app === "property" ? (
            <ClientWorkspaceRouteGuard>{children}</ClientWorkspaceRouteGuard>
          ) : (
            children
          )}
        </div>
      </div>
    </div>
  );

  if (app === "client" || app === "property") {
    return (
      <ActiveTenantProvider>
        <ComplaintsNotifyProvider>{shell}</ComplaintsNotifyProvider>
      </ActiveTenantProvider>
    );
  }

  return <ActiveTenantProvider>{shell}</ActiveTenantProvider>;
};

export default DashboardLayout;