import {
    Refine,
    Authenticated,
} from "@refinedev/core";
import {
    useNotificationProvider,
    ThemedLayout,
    ErrorComponent,
} from "@refinedev/antd";
import {
    DashboardOutlined,
    UserOutlined,
    SettingOutlined,
    TeamOutlined,
    FieldTimeOutlined,
    ThunderboltOutlined,
    CopyOutlined,
} from "@ant-design/icons";
import routerProvider, {
    NavigateToResource,
    CatchAllNavigate,
    UnsavedChangesNotifier,
    DocumentTitleHandler,
} from "@refinedev/react-router";
import { BrowserRouter, Routes, Route, Outlet } from "react-router";
import { App as AntdApp } from "antd";
import { useTranslation } from "react-i18next";
import "./i18n";

import "@ant-design/v5-patch-for-react-19";
import "@refinedev/antd/dist/reset.css";

import { DashboardPage } from "./pages/dashboard";
import {
    authProvider,
    dataProvider,
    // {NO_CHAT_START}
    Header,
    // {NO_CHAT_END}
    LoginPage,
    KeycloakLoginPage,
    AuthCallback,
    ApplicationUserList,
    ApplicationUserCreate,
    ApplicationUserEdit,
    RoleList,
    RoleCreate,
    RoleEdit,
    ColorModeContextProvider,
    BackgroundJobList,
    TriggerRuleList,
    TriggerRuleCreate,
    TriggerRuleEdit,
    TriggerLogList,
    MirrorTypeMappingConfigList,
    MirrorTypeMappingConfigCreate,
    MirrorTypeMappingConfigEdit,
    CustomSider,
} from "@cundi/refine-xaf";

import { accessControlProvider } from "./accessControlProvider";

// {CHAT_START}
import { ChatProvider } from "./components/ChatPanel";
import { HeaderWithChat } from "./components/HeaderWithChat";
// {CHAT_END}

const API_URL = import.meta.env.VITE_API_URL + "/api/odata";

const InnerApp: React.FC = () => {
    const { t, i18n } = useTranslation();

    const i18nProvider = {
        translate: (key: string, params: any) => t(key, params) as string,
        changeLocale: (lang: string) => i18n.changeLanguage(lang),
        getLocale: () => i18n.language,
    };

    return (
        <BrowserRouter>
            <AntdApp>
                <Refine
                    authProvider={authProvider}
                    accessControlProvider={accessControlProvider}
                    dataProvider={{ default: dataProvider(API_URL) }}
                    i18nProvider={i18nProvider}
                    routerProvider={routerProvider}
                    resources={[
                        {
                            name: "dashboard",
                            list: "/",
                            meta: {
                                label: t("sider.dashboard"),
                                icon: <DashboardOutlined />,
                            },
                        },
                        {
                            name: "ApplicationUser",
                            list: "/ApplicationUsers",
                            create: "/ApplicationUsers/create",
                            edit: "/ApplicationUsers/edit/:id",
                            meta: {
                                label: t("sider.users"),
                                icon: <UserOutlined />,
                                parent: "Settings",
                            },
                        },
                        {
                            name: "PermissionPolicyRole",
                            list: "/PermissionPolicyRoles",
                            create: "/PermissionPolicyRoles/create",
                            edit: "/PermissionPolicyRoles/edit/:id",
                            meta: {
                                label: t("sider.roles"),
                                parent: "Settings",
                                icon: <TeamOutlined />,
                            },
                        },
                        {
                            name: "BackgroundJobs",
                            list: "/background-jobs",
                            meta: {
                                label: t("sider.backgroundJobs"),
                                icon: <FieldTimeOutlined />,
                                parent: "Settings",
                            },
                        },
                        {
                            name: "TriggerRule",
                            list: "/TriggerRules",
                            create: "/TriggerRules/create",
                            edit: "/TriggerRules/edit/:id",
                            meta: {
                                label: t("sider.triggerRules"),
                                parent: "Settings",
                                icon: <ThunderboltOutlined />,
                            },
                        },
                        {
                            name: "TriggerLog",
                            list: "/TriggerLogs",
                            meta: {
                                label: t("sider.triggerLogs"),
                                parent: "Settings",
                                icon: <ThunderboltOutlined />,
                            },
                        },
                        {
                            name: "MirrorTypeMappingConfig",
                            list: "/MirrorTypeMappingConfigs",
                            create: "/MirrorTypeMappingConfigs/create",
                            edit: "/MirrorTypeMappingConfigs/edit/:id",
                            meta: {
                                label: t("sider.mirrorConfigs"),
                                parent: "Settings",
                                icon: <CopyOutlined />,
                            },
                        },
                        {
                            name: "Settings",
                            meta: {
                                label: t("sider.settings"),
                                icon: <SettingOutlined />,
                            },
                        },
                    ]}
                    notificationProvider={useNotificationProvider}
                    options={{
                        syncWithLocation: true,
                        warnWhenUnsavedChanges: true,
                    }}
                >
                    <Routes>
                        <Route
                            element={
                                <Authenticated
                                    key="authenticated-routes"
                                    fallback={<CatchAllNavigate to="/login" />}
                                >
                                    { /* {CHAT_START} */}
                                    <ThemedLayout Header={HeaderWithChat} Sider={CustomSider}>
                                        { /* {CHAT_END} */}
                                        { /* {NO_CHAT_START}
                                    <ThemedLayout Header={Header} Sider={CustomSider}>
                                    {NO_CHAT_END} */ }
                                        <Outlet />
                                    </ThemedLayout>
                                </Authenticated>
                            }
                        >
                            <Route index element={<DashboardPage />} />

                            <Route path="/ApplicationUsers">
                                <Route index element={<ApplicationUserList />} />
                                <Route path="create" element={<ApplicationUserCreate />} />
                                <Route path="edit/:id" element={<ApplicationUserEdit />} />
                            </Route>

                            <Route path="/PermissionPolicyRoles">
                                <Route index element={<RoleList />} />
                                <Route path="create" element={<RoleCreate />} />
                                <Route path="edit/:id" element={<RoleEdit />} />
                            </Route>

                            <Route path="/background-jobs" element={<BackgroundJobList title={t("sider.backgroundJobs")} />} />

                            <Route path="/TriggerRules">
                                <Route index element={<TriggerRuleList />} />
                                <Route path="create" element={<TriggerRuleCreate />} />
                                <Route path="edit/:id" element={<TriggerRuleEdit />} />
                            </Route>
                            <Route path="/TriggerLogs">
                                <Route index element={<TriggerLogList />} />
                            </Route>
                            <Route path="/MirrorTypeMappingConfigs">
                                <Route index element={<MirrorTypeMappingConfigList />} />
                                <Route path="create" element={<MirrorTypeMappingConfigCreate />} />
                                <Route path="edit/:id" element={<MirrorTypeMappingConfigEdit />} />
                            </Route>
                        </Route>

                        <Route
                            element={
                                <Authenticated key="auth-pages" fallback={<Outlet />}>
                                    <NavigateToResource resource="dashboard" />
                                </Authenticated>
                            }
                        >
                            <Route path="/login" element={<KeycloakLoginPage />} />
                            <Route path="/login/api" element={<LoginPage />} />
                            <Route path="/auth/callback" element={<AuthCallback />} />
                        </Route>

                        <Route
                            element={
                                <Authenticated key="catch-all">
                                    { /* {CHAT_START} */}
                                    <ThemedLayout Header={HeaderWithChat} Sider={CustomSider}>
                                        { /* {CHAT_END} */}
                                        { /* {NO_CHAT_START}
                                    <ThemedLayout Header={Header} Sider={CustomSider}>
                                    {NO_CHAT_END} */ }
                                        <Outlet />
                                    </ThemedLayout>
                                </Authenticated>
                            }
                        >
                            <Route path="*" element={<ErrorComponent />} />
                        </Route>
                    </Routes>
                    <UnsavedChangesNotifier />
                    <DocumentTitleHandler />
                </Refine>
            </AntdApp>
        </BrowserRouter>
    );
};

const App: React.FC = () => {
    return (
        <ColorModeContextProvider>
            {/* {CHAT_START} */}
            <ChatProvider>
                <InnerApp />
            </ChatProvider>
            {/* {CHAT_END} */}
            {/* {NO_CHAT_START}
            <InnerApp />
            {NO_CHAT_END} */}
        </ColorModeContextProvider>

    );
};

export default App;
