rename /src to /internal (sorry i'll fix the prs)

internal/site/src/main.tsx

@@ -0,0 +1,123 @@
+import "./index.css"
+import { i18n } from "@lingui/core"
+import { I18nProvider } from "@lingui/react"
+import { useStore } from "@nanostores/react"
+import { DirectionProvider } from "@radix-ui/react-direction"
+// import { Suspense, lazy, useEffect, StrictMode } from "react"
+import { lazy, memo, Suspense, useEffect } from "react"
+import ReactDOM from "react-dom/client"
+import Navbar from "@/components/navbar.tsx"
+import { $router } from "@/components/router.tsx"
+import Settings from "@/components/routes/settings/layout.tsx"
+import { ThemeProvider } from "@/components/theme-provider.tsx"
+import { Toaster } from "@/components/ui/toaster.tsx"
+import { alertManager } from "@/lib/alerts"
+import { pb, updateUserSettings } from "@/lib/api.ts"
+import { dynamicActivate, getLocale } from "@/lib/i18n"
+import { $authenticated, $copyContent, $direction, $publicKey } from "@/lib/stores.ts"
+import * as systemsManager from "@/lib/systemsManager.ts"
+
+const LoginPage = lazy(() => import("@/components/login/login.tsx"))
+const Home = lazy(() => import("@/components/routes/home.tsx"))
+const SystemDetail = lazy(() => import("@/components/routes/system.tsx"))
+const CopyToClipboardDialog = lazy(() => import("@/components/copy-to-clipboard.tsx"))
+
+const App = memo(() => {
+	const page = useStore($router)
+
+	useEffect(() => {
+		// change auth store on auth change
+		pb.authStore.onChange(() => {
+			$authenticated.set(pb.authStore.isValid)
+		})
+		// get version / public key
+		pb.send("/api/beszel/getkey", {}).then((data) => {
+			$publicKey.set(data.key)
+		})
+		// get user settings
+		updateUserSettings()
+		// need to get system list before alerts
+		systemsManager.init()
+		systemsManager
+			// get current systems list
+			.refresh()
+			// subscribe to new system updates
+			.then(systemsManager.subscribe)
+			// get current alerts
+			.then(alertManager.refresh)
+			// subscribe to new alert updates
+			.then(alertManager.subscribe)
+		return () => {
+			// updateFavicon("favicon.svg")
+			alertManager.unsubscribe()
+			systemsManager.unsubscribe()
+		}
+	}, [])
+
+	if (!page) {
+		return <h1 className="text-3xl text-center my-14">404</h1>
+	} else if (page.route === "home") {
+		return <Home />
+	} else if (page.route === "system") {
+		return <SystemDetail name={page.params.name} />
+	} else if (page.route === "settings") {
+		return <Settings />
+	}
+})
+
+const Layout = () => {
+	const authenticated = useStore($authenticated)
+	const copyContent = useStore($copyContent)
+	const direction = useStore($direction)
+
+	useEffect(() => {
+		document.documentElement.dir = direction
+	}, [direction])
+
+	return (
+		<DirectionProvider dir={direction}>
+			{!authenticated ? (
+				<Suspense>
+					<LoginPage />
+				</Suspense>
+			) : (
+				<>
+					<div className="container">
+						<Navbar />
+					</div>
+					<div className="container relative">
+						<App />
+						{copyContent && (
+							<Suspense>
+								<CopyToClipboardDialog content={copyContent} />
+							</Suspense>
+						)}
+					</div>
+				</>
+			)}
+		</DirectionProvider>
+	)
+}
+
+const I18nApp = () => {
+	useEffect(() => {
+		dynamicActivate(getLocale())
+	}, [])
+
+	return (
+		<I18nProvider i18n={i18n}>
+			<ThemeProvider>
+				<Layout />
+				<Toaster />
+			</ThemeProvider>
+		</I18nProvider>
+	)
+}
+
+ReactDOM.createRoot(document.getElementById("app") as HTMLElement).render(
+	// strict mode in dev mounts / unmounts components twice
+	// and breaks the clipboard dialog
+	//<StrictMode>
+	<I18nApp />
+	//</StrictMode>
+)