no-fix: move out routing

packages/demobank-ui/src/components/app.tsx

@@ -1,13 +1,13 @@
 import { h, FunctionalComponent } from "preact";
 import { PageStateProvider } from "../context/pageState.js";
 import { TranslationProvider } from "../context/translation.js";
-import { BankHome } from "../pages/home/index.js";
+import { Routing } from "../pages/Routing.js";
 
 const App: FunctionalComponent = () => {
   return (
     <TranslationProvider>
       <PageStateProvider>
-        <BankHome />
+        <Routing />
       </PageStateProvider>
     </TranslationProvider>
   );

packages/demobank-ui/src/pages/Routing.tsx

@@ -0,0 +1,28 @@
+import { createHashHistory } from "history";
+import { h, VNode } from "preact";
+import Router, { route, Route } from "preact-router";
+import { useEffect } from "preact/hooks";
+import {
+  AccountPage,
+  PublicHistoriesPage,
+  RegistrationPage,
+} from "./home/index.js";
+
+export function Routing(): VNode {
+  const history = createHashHistory();
+  return (
+    <Router history={history}>
+      <Route path="/public-accounts" component={PublicHistoriesPage} />
+      <Route path="/register" component={RegistrationPage} />
+      <Route path="/account/:id*" component={AccountPage} />
+      <Route default component={Redirect} to="/account" />
+    </Router>
+  );
+}
+
+function Redirect({ to }: { to: string }): VNode {
+  useEffect(() => {
+    route(to, true);
+  }, []);
+  return <div>being redirected to {to}</div>;
+}

packages/demobank-ui/src/pages/home/index.tsx

@@ -2079,7 +2079,7 @@ function PublicHistories(Props: any): VNode {
   );
 }
 
-function PublicHistoriesPage(): VNode {
+export function PublicHistoriesPage(): VNode {
   const { pageState, pageStateSetter } = usePageContext();
   // const { i18n } = useTranslationContext();
   return (
@@ -2104,7 +2104,7 @@ function PublicHistoriesPage(): VNode {
   );
 }
 
-function RegistrationPage(): VNode {
+export function RegistrationPage(): VNode {
   const { i18n } = useTranslationContext();
   if (!bankUiSettings.allowRegistrations) {
     return (
@@ -2120,7 +2120,7 @@ function RegistrationPage(): VNode {
   );
 }
 
-function AccountPage(): VNode {
+export function AccountPage(): VNode {
   const [backendState, backendStateSetter] = useBackendState();
   const { i18n } = useTranslationContext();
   const { pageState, pageStateSetter } = usePageContext();
@@ -2129,10 +2129,7 @@ function AccountPage(): VNode {
     return (
       <BankFrame>
         <h1 class="nav">{i18n.str`Welcome to ${bankUiSettings.bankName}!`}</h1>
-        <LoginForm
+        <LoginForm />
-          pageStateSetter={pageStateSetter}
-          backendStateSetter={backendStateSetter}
-        />
       </BankFrame>
     );
   }
@@ -2162,26 +2159,3 @@ function AccountPage(): VNode {
     </SWRWithCredentials>
   );
 }
-
-function Redirect({ to }: { to: string }): VNode {
-  useEffect(() => {
-    route(to, true);
-  }, []);
-  return <div>being redirected to {to}</div>;
-}
-
-/**
- * If the user is logged in, it displays
- * the balance, otherwise it offers to login.
- */
-export function BankHome(): VNode {
-  const history = createHashHistory();
-  return (
-    <Router history={history}>
-      <Route path="/public-accounts" component={PublicHistoriesPage} />
-      <Route path="/register" component={RegistrationPage} />
-      <Route path="/account/:id*" component={AccountPage} />
-      <Route default component={Redirect} to="/account" />
-    </Router>
-  );
-}