From 75eb7b0f838db530731563baf315f9b7b410a422 Mon Sep 17 00:00:00 2001
From: Bruno Tot <brunotot10000@gmail.com>
Date: Mon, 7 Oct 2024 14:06:40 +0200
Subject: [PATCH] chore: frontend file restructure

---
 .../InputLocaleSelect/InputLocaleSelect.tsx   |  1 -
 .../src/app/pages/Home/index.ts               |  1 -
 .../src/app/pages/ProtectedRoute.tsx          | 13 --------
 .../src/app/pages/RootError/RootErrorPage.tsx | 14 ---------
 .../src/app/pages/RootError/index.ts          |  1 -
 .../src/app/pages/Status404/Status404Page.tsx |  3 --
 .../src/app/pages/Status404/index.ts          |  1 -
 .../manage-users}/FixedBadge.tsx              |  0
 .../manage-users}/UserCreateFormButton.tsx    |  2 +-
 .../manage-users}/UserForm.tsx                |  0
 .../manage-users/index.tsx}                   |  6 ++--
 .../{Home/IndexPage.tsx => home/index.tsx}    |  2 +-
 .../app-vite-react/src/app/routes.tsx         | 17 +++++-----
 .../app-vite-react/src/main.tsx               | 31 ++++++++++++++++---
 .../app-vite-react/test/App.test.tsx          |  4 +--
 15 files changed, 41 insertions(+), 55 deletions(-)
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/Home/index.ts
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/ProtectedRoute.tsx
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/RootError/RootErrorPage.tsx
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/RootError/index.ts
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/Status404/Status404Page.tsx
 delete mode 100644 packages/mern-sample-app/app-vite-react/src/app/pages/Status404/index.ts
 rename packages/mern-sample-app/app-vite-react/src/app/pages/{Home => admin-settings/manage-users}/FixedBadge.tsx (100%)
 rename packages/mern-sample-app/app-vite-react/src/app/pages/{Home => admin-settings/manage-users}/UserCreateFormButton.tsx (93%)
 rename packages/mern-sample-app/app-vite-react/src/app/pages/{Home => admin-settings/manage-users}/UserForm.tsx (100%)
 rename packages/mern-sample-app/app-vite-react/src/app/pages/{Home/HomePage.tsx => admin-settings/manage-users/index.tsx} (97%)
 rename packages/mern-sample-app/app-vite-react/src/app/pages/{Home/IndexPage.tsx => home/index.tsx} (99%)

diff --git a/packages/mern-sample-app/app-vite-react/src/app/inputs/InputLocaleSelect/InputLocaleSelect.tsx b/packages/mern-sample-app/app-vite-react/src/app/inputs/InputLocaleSelect/InputLocaleSelect.tsx
index afd02af8..441ec305 100644
--- a/packages/mern-sample-app/app-vite-react/src/app/inputs/InputLocaleSelect/InputLocaleSelect.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/app/inputs/InputLocaleSelect/InputLocaleSelect.tsx
@@ -47,7 +47,6 @@ export function InputLocaleSelect({ value, onChange }: InputLocaleSelectProps) {
       <Tooltip title={t("systemLanguage")} data-driver="systemLanguage">
         <IconButton size="medium" onClick={handleClickListItem}>
           <Box width="1.5rem" height="1.5rem">
-            {/*selectedItem ? <Typography>{selectedItem.toUpperCase()}</Typography> : <Translate />*/}
             {selectedItem ? <Flag locale={selectedItem} /> : <Translate />}
           </Box>
         </IconButton>
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/index.ts b/packages/mern-sample-app/app-vite-react/src/app/pages/Home/index.ts
deleted file mode 100644
index 5133ca6b..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "@org/app-vite-react/app/pages/Home/HomePage";
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/ProtectedRoute.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/ProtectedRoute.tsx
deleted file mode 100644
index 1fecea4a..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/ProtectedRoute.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import { KeycloakRoute, type KeycloakUser } from "@org/app-vite-react/lib/keycloak-js";
-import { sigUser } from "@org/app-vite-react/signals/sigUser";
-import { type RouteObject } from "react-router-dom";
-
-export function ProtectedRoute({
-  secure,
-  Component,
-}: {
-  secure: (user: KeycloakUser | null) => boolean;
-  Component: NonNullable<RouteObject["Component"]>;
-}) {
-  return <KeycloakRoute user={sigUser.value} secure={secure} Component={Component} />;
-}
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/RootErrorPage.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/RootErrorPage.tsx
deleted file mode 100644
index 111fa16f..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/RootErrorPage.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import { useRouteError } from "react-router-dom";
-
-export function RootErrorPage() {
-  const error = useRouteError() as Error;
-  return (
-    <div>
-      <h1>Uh oh, something went terribly wrong 😩</h1>
-      <pre>{error.message || JSON.stringify(error)}</pre>
-      <button onClick={() => (window.location.href = "/")}>
-        Click here to reload the app
-      </button>
-    </div>
-  );
-}
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/index.ts b/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/index.ts
deleted file mode 100644
index c8155b17..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/RootError/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "@org/app-vite-react/app/pages/RootError/RootErrorPage";
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/Status404Page.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/Status404Page.tsx
deleted file mode 100644
index f5a1cd91..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/Status404Page.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-export function Status404Page() {
-  return <div>Not found</div>;
-}
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/index.ts b/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/index.ts
deleted file mode 100644
index 1b0d3c9c..00000000
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Status404/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from "@org/app-vite-react/app/pages/Status404/Status404Page";
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/FixedBadge.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/FixedBadge.tsx
similarity index 100%
rename from packages/mern-sample-app/app-vite-react/src/app/pages/Home/FixedBadge.tsx
rename to packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/FixedBadge.tsx
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/UserCreateFormButton.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/UserCreateFormButton.tsx
similarity index 93%
rename from packages/mern-sample-app/app-vite-react/src/app/pages/Home/UserCreateFormButton.tsx
rename to packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/UserCreateFormButton.tsx
index 176276e8..f3997f45 100644
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/UserCreateFormButton.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/UserCreateFormButton.tsx
@@ -2,7 +2,7 @@ import type { User } from "@org/lib-api-client";
 
 import { Add } from "@mui/icons-material";
 import { Button, Dialog, DialogContent } from "@mui/material";
-import { UserForm } from "@org/app-vite-react/app/pages/Home/UserForm";
+import { UserForm } from "@org/app-vite-react/app/pages/admin-settings/manage-users/UserForm";
 import { tsrClient } from "@org/app-vite-react/lib/@ts-rest";
 import { useState } from "react";
 
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/UserForm.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/UserForm.tsx
similarity index 100%
rename from packages/mern-sample-app/app-vite-react/src/app/pages/Home/UserForm.tsx
rename to packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/UserForm.tsx
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/HomePage.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/index.tsx
similarity index 97%
rename from packages/mern-sample-app/app-vite-react/src/app/pages/Home/HomePage.tsx
rename to packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/index.tsx
index 7f36eeb6..345d6470 100644
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/HomePage.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/app/pages/admin-settings/manage-users/index.tsx
@@ -7,8 +7,8 @@ import {
   ServerDatatable,
   DEFAULT_PAGINATION_OPTIONS,
 } from "@org/app-vite-react/app/components/Datatable";
-import { FixedBadge } from "@org/app-vite-react/app/pages/Home/FixedBadge";
-import { UserCreateFormButton } from "@org/app-vite-react/app/pages/Home/UserCreateFormButton";
+import { FixedBadge } from "@org/app-vite-react/app/pages/admin-settings/manage-users/FixedBadge";
+import { UserCreateFormButton } from "@org/app-vite-react/app/pages/admin-settings/manage-users/UserCreateFormButton";
 import { tsrQuery } from "@org/app-vite-react/lib/@ts-rest";
 import { useState } from "react";
 
@@ -18,7 +18,7 @@ import { useState } from "react";
   return { paginationOptions: JSON.stringify(paginationOptions) };
 }*/
 
-export function HomePage() {
+export function ManageUsersPage() {
   const { data, isPending } = tsrQuery.User.findAll.useQuery({
     queryKey: ["User.findAll"],
     staleTime: 1000,
diff --git a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/IndexPage.tsx b/packages/mern-sample-app/app-vite-react/src/app/pages/home/index.tsx
similarity index 99%
rename from packages/mern-sample-app/app-vite-react/src/app/pages/Home/IndexPage.tsx
rename to packages/mern-sample-app/app-vite-react/src/app/pages/home/index.tsx
index 47391739..dcaf47c7 100644
--- a/packages/mern-sample-app/app-vite-react/src/app/pages/Home/IndexPage.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/app/pages/home/index.tsx
@@ -1,7 +1,7 @@
 import * as icons from "@mui/icons-material";
 import * as mui from "@mui/material";
 
-export function IndexPage() {
+export function HomePage() {
   const dependencies = [
     {
       name: "React",
diff --git a/packages/mern-sample-app/app-vite-react/src/app/routes.tsx b/packages/mern-sample-app/app-vite-react/src/app/routes.tsx
index f629f4e0..255e6acb 100644
--- a/packages/mern-sample-app/app-vite-react/src/app/routes.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/app/routes.tsx
@@ -1,20 +1,17 @@
 import type { NavigationRoute } from "@org/app-vite-react/route-typings";
-
 import * as icons from "@mui/icons-material";
 import { Protect } from "@org/app-vite-react/app/components/Protect";
-import { HomePage } from "@org/app-vite-react/app/pages/Home";
-import { Status404Page } from "@org/app-vite-react/app/pages/Status404";
-
-import { IndexPage } from "./pages/Home/IndexPage";
+import { ManageUsersPage } from "@org/app-vite-react/app/pages/admin-settings/manage-users";
+import { HomePage } from "@org/app-vite-react/app/pages/home";
 
 export const routes: NavigationRoute[] = [
   {
     variant: "single",
-    label: () => "Index",
+    label: () => "Home",
     path: "/",
-    Component: () => <IndexPage />,
+    Component: () => <HomePage />,
     handle: {
-      crumb: () => "Index",
+      crumb: () => "Home",
     },
   },
   {
@@ -35,7 +32,7 @@ export const routes: NavigationRoute[] = [
         },
         Component: () => (
           <Protect roles={["admin"]}>
-            <HomePage />
+            <ManageUsersPage />
           </Protect>
         ),
       },
@@ -44,7 +41,7 @@ export const routes: NavigationRoute[] = [
   {
     variant: "single",
     label: () => "",
-    Component: Status404Page,
+    Component: () => <div>Not found</div>,
     path: "*",
     hidden: true,
   },
diff --git a/packages/mern-sample-app/app-vite-react/src/main.tsx b/packages/mern-sample-app/app-vite-react/src/main.tsx
index 041e8015..162c4088 100644
--- a/packages/mern-sample-app/app-vite-react/src/main.tsx
+++ b/packages/mern-sample-app/app-vite-react/src/main.tsx
@@ -1,21 +1,44 @@
 import "@org/app-vite-react/lib/i18next/i18n";
 
 import { Layout as layoutElement } from "@org/app-vite-react/app/layout";
-import { ProtectedRoute as protectedRoute } from "@org/app-vite-react/app/pages/ProtectedRoute";
-import { RootErrorPage as errorElement } from "@org/app-vite-react/app/pages/RootError";
 import { providers } from "@org/app-vite-react/app/providers";
 import { routes } from "@org/app-vite-react/app/routes";
 import { MuiCssBaseline as cssBaseline } from "@org/app-vite-react/lib/@mui";
 import { reactServer } from "@org/app-vite-react/server";
+import { useRouteError } from "react-router-dom";
+import { KeycloakRoute, type KeycloakUser } from "@org/app-vite-react/lib/keycloak-js";
+import { sigUser } from "@org/app-vite-react/signals/sigUser";
+import { type RouteObject } from "react-router-dom";
 
 import "@org/app-vite-react/main.css";
 
+function RootErrorPage() {
+  const error = useRouteError() as Error;
+  return (
+    <div>
+      <h1>Uh oh, something went terribly wrong 😩</h1>
+      <pre>{error.message || JSON.stringify(error)}</pre>
+      <button onClick={() => (window.location.href = "/")}>Click here to reload the app</button>
+    </div>
+  );
+}
+
+function ProtectedRoute({
+  secure,
+  Component,
+}: {
+  secure: (user: KeycloakUser | null) => boolean;
+  Component: NonNullable<RouteObject["Component"]>;
+}) {
+  return <KeycloakRoute user={sigUser.value} secure={secure} Component={Component} />;
+}
+
 reactServer.run({
   rootId: "root",
   routes,
   providers,
-  errorElement,
+  errorElement: RootErrorPage,
   layoutElement,
   cssBaseline,
-  protectedRoute,
+  protectedRoute: ProtectedRoute,
 });
diff --git a/packages/mern-sample-app/app-vite-react/test/App.test.tsx b/packages/mern-sample-app/app-vite-react/test/App.test.tsx
index 71d20c40..4ee08090 100644
--- a/packages/mern-sample-app/app-vite-react/test/App.test.tsx
+++ b/packages/mern-sample-app/app-vite-react/test/App.test.tsx
@@ -1,11 +1,11 @@
 /// <reference types="@testing-library/jest-dom" />
 
-import { Status404Page } from "@org/app-vite-react/app/pages/Status404/Status404Page";
+import { HomePage } from "@org/app-vite-react/app/pages/home";
 import { render, screen } from "@testing-library/react";
 
 describe("App", () => {
   it("renders the App component", () => {
-    render(<Status404Page />);
+    render(<HomePage />);
 
     screen.debug(); // prints out the jsx in the App component unto the command line
   });