fix(ui): keep form state when changing theme

app/src/ui/Admin.tsx

@@ -17,9 +17,9 @@ export type BkndAdminConfig = {
     */
    basepath?: string;
    /**
-   * Sub-path for the Admin UI within the base path
-   * @default ``
-   */
+    * Sub-path for the Admin UI within the base path
+    * @default ``
+    */
    admin_basepath?: string;
    /**
     * Path to return to when clicking the logo
@@ -77,6 +77,14 @@ export default function Admin(props: BkndAdminProps) {
    );
 }
 
+function BkndWrapper({ options, children }: { options?: BkndAdminConfig; children: ReactNode }) {
+   return (
+      <BkndProvider options={options} fallback={<Skeleton theme={options?.theme} />}>
+         {children}
+      </BkndProvider>
+   );
+}
+
 function AdminInner(props: BkndAdminProps) {
    const { theme } = useTheme();
    const config = {
@@ -84,16 +92,10 @@ function AdminInner(props: BkndAdminProps) {
       ...useBkndWindowContext(),
    };
 
-   const BkndWrapper = ({ children }: { children: ReactNode }) => (
-      <BkndProvider options={config} fallback={<Skeleton theme={config?.theme} />}>
-         {children}
-      </BkndProvider>
-   );
-
    return (
       <MantineProvider {...createMantineTheme(theme as any)}>
          <Notifications position="top-right" />
-         <Routes BkndWrapper={BkndWrapper} basePath={config?.basepath}>
+         <Routes BkndWrapper={BkndWrapper} options={config} basePath={config?.basepath}>
             {props.children}
          </Routes>
       </MantineProvider>

app/src/ui/routes/index.tsx

@@ -12,6 +12,7 @@ import { FlashMessage } from "ui/modules/server/FlashMessage";
 import { AuthRegister } from "ui/routes/auth/auth.register";
 import { BkndModalsProvider } from "ui/modals";
 import { useBkndWindowContext } from "bknd/client";
+import type { BkndAdminProps } from "ui/Admin";
 import ToolsRoutes from "./tools";
 
 // @ts-ignore
@@ -24,10 +25,12 @@ try {
 
 export function Routes({
    BkndWrapper,
+   options,
    basePath = "",
    children,
 }: {
-   BkndWrapper: ComponentType<{ children: ReactNode }>;
+   BkndWrapper: ComponentType<{ children: ReactNode; options?: BkndAdminProps["config"] }>;
+   options?: BkndAdminProps["config"];
    basePath?: string;
    children?: ReactNode;
 }) {
@@ -43,7 +46,7 @@ export function Routes({
                <Route path="/auth/login" component={AuthLogin} />
                <Route path="/auth/register" component={AuthRegister} />
 
-               <BkndWrapper>
+               <BkndWrapper options={options}>
                   <BkndModalsProvider>
                      <Route path="/" nest>
                         <Root>