import { createInertiaApp } from "@inertiajs/react";
import NavigationProgress from "@/components/navigation-progress";
import { Toaster } from "@/components/ui/sonner";
import { TooltipProvider } from "@/components/ui/tooltip";
import { initializeTheme } from "@/hooks/use-appearance";
import AppLayout from "@/layouts/app-layout";
import AdminLayout from "@/layouts/admin-layout";
import AuthLayout from "@/layouts/auth-layout";
import SettingsLayout from "@/layouts/settings/layout";
import { configureEcho } from "@laravel/echo-react";

configureEcho({
    broadcaster: "reverb",
});

declare global {
    interface Window {
        __APP_NAME__?: string;
    }
}

const appName =
    window.__APP_NAME__ || import.meta.env.VITE_APP_NAME || "Bulec Engine";

void createInertiaApp({
    title: (title) => (title ? `${title} - ${appName}` : appName),
    layout: (name) => {
        switch (true) {
            case name === "welcome":
                return null;
            case name.startsWith("auth/"):
                return AuthLayout;
            case name.startsWith("admin/"):
                return AdminLayout;
            case name.startsWith("settings/"):
                return [AppLayout, SettingsLayout];
            default:
                return AppLayout;
        }
    },
    strictMode: true,
    withApp(app) {
        return (
            <TooltipProvider delayDuration={0}>
                <NavigationProgress />
                {app}
                <Toaster />
            </TooltipProvider>
        );
    },
    progress: false,
});

// This will set light / dark mode on load...
initializeTheme();