moved flash message, removed theme from admin controller

app/src/ui/Admin.tsx

@@ -2,11 +2,10 @@ import { MantineProvider } from "@mantine/core";
 import { Notifications } from "@mantine/notifications";
 import type { ModuleConfigs } from "modules";
 import React from "react";
-import { BkndProvider, useBknd } from "ui/client/bknd";
+import { BkndProvider } from "ui/client/bknd";
 import { useTheme } from "ui/client/use-theme";
 import { Logo } from "ui/components/display/Logo";
 import * as AppShell from "ui/layouts/AppShell/AppShell";
-import { FlashMessage } from "ui/modules/server/FlashMessage";
 import { ClientProvider, type ClientProviderProps } from "./client";
 import { createMantineTheme } from "./lib/mantine/theme";
 import { BkndModalsProvider } from "./modals";
@@ -21,7 +20,7 @@ export type BkndAdminProps = {
 export default function Admin({
    baseUrl: baseUrlOverride,
    withProvider = false,
-   config
+   config,
 }: BkndAdminProps) {
    const Component = (
       <BkndProvider adminOverride={config} fallback={<Skeleton theme={config?.color_scheme} />}>
@@ -45,8 +44,7 @@ function AdminInternal() {
 
    return (
       <MantineProvider {...createMantineTheme(theme as any)}>
-         <Notifications />
-         <FlashMessage />
+         <Notifications position="top-right" />
          <BkndModalsProvider>
             <Routes />
          </BkndModalsProvider>
@@ -54,9 +52,9 @@ function AdminInternal() {
    );
 }
 
-const Skeleton = ({ theme }: { theme?: string }) => {
-   const actualTheme =
-      (theme ?? document.querySelector("html")?.classList.contains("light")) ? "light" : "dark";
+const Skeleton = ({ theme }: { theme?: any }) => {
+   const t = useTheme();
+   const actualTheme = theme ?? t.theme;
 
    return (
       <div id="bknd-admin" className={actualTheme + " antialiased"}>

app/src/ui/modules/server/FlashMessage.tsx

@@ -7,7 +7,7 @@ import { Alert } from "ui/components/display/Alert";
  * @constructor
  */
 export function FlashMessage() {
-   const [flash, setFlash] = useState<any>();
+   const [flash, setFlash] = useState<ReturnType<typeof getFlashMessage>>();
 
    useEffect(() => {
       if (!flash) {

app/src/ui/routes/index.tsx

@@ -1,4 +1,4 @@
-import { Suspense, lazy } from "react";
+import React, { Suspense, lazy } from "react";
 import { useBknd } from "ui/client/bknd";
 import { useTheme } from "ui/client/use-theme";
 import { Route, Router, Switch } from "wouter";
@@ -9,6 +9,7 @@ import FlowRoutes from "./flows";
 import MediaRoutes from "./media";
 import { Root, RootEmpty } from "./root";
 import SettingsRoutes from "./settings";
+import { FlashMessage } from "ui/modules/server/FlashMessage";
 
 // @ts-ignore
 const TestRoutes = lazy(() => import("./test"));
@@ -20,6 +21,7 @@ export function Routes() {
 
    return (
       <div id="bknd-admin" className={theme + " antialiased"}>
+         <FlashMessage />
          <Router base={basepath}>
             <Switch>
                <Route path="/auth/login" component={AuthLogin} />