refactor(front end): login fixes to account for the forced password change

2025-10-21 20:27:00 -05:00
parent 43abbd53f4
commit e99c409cad
26 changed files with 10435 additions and 8732 deletions
--- a/frontend/.tanstack/tmp/053913e4-c93ff02c43e2936f96783ab815d9bc13
+++ b/frontend/.tanstack/tmp/053913e4-c93ff02c43e2936f96783ab815d9bc13
@@ -1,9 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/_adminLayout/admin/settings')({
-  component: RouteComponent,
-})
-
-function RouteComponent() {
-  return <div>Hello "/_adminLayout/admin/settings"!</div>
-}
--- a/frontend/.tanstack/tmp/97e05426-331f4960ca16bbce7020dc209c4f1566
+++ b/frontend/.tanstack/tmp/97e05426-331f4960ca16bbce7020dc209c4f1566
@@ -1,11 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/(logistics)/logistics/deliverySchedule')(
-  {
-    component: RouteComponent,
-  },
-)
-
-function RouteComponent() {
-  return <div>Hello "/(logistics)/logistics/deliverySchedule"!</div>
-}
--- a/frontend/.tanstack/tmp/e12df2ba-b3382a416ae729cc43a945f11c8103c7
+++ b/frontend/.tanstack/tmp/e12df2ba-b3382a416ae729cc43a945f11c8103c7
@@ -1,9 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/')({
-  component: RouteComponent,
-})
-
-function RouteComponent() {
-  return <div>Hello "/(mobileStuff)/_mobileLayout/"!</div>
-}
--- a/frontend/.tanstack/tmp/e14c4eec-39d7ed97d04dd2ae5c727a465e0599da
+++ b/frontend/.tanstack/tmp/e14c4eec-39d7ed97d04dd2ae5c727a465e0599da
@@ -1,15 +0,0 @@
-import * as React from 'react'
-import { Outlet, createRootRoute } from '@tanstack/react-router'
-
-export const Route = createRootRoute({
-  component: RootComponent,
-})
-
-function RootComponent() {
-  return (
-    <React.Fragment>
-      <div>Hello "__root"!</div>
-      <Outlet />
-    </React.Fragment>
-  )
-}
--- a/frontend/.tanstack/tmp/ee07e1ba-e2cc6056c569c2037efc54256a0dbfd2
+++ b/frontend/.tanstack/tmp/ee07e1ba-e2cc6056c569c2037efc54256a0dbfd2
@@ -1,9 +0,0 @@
-import { createFileRoute } from '@tanstack/react-router'
-
-export const Route = createFileRoute('/(mobileStuff)/_mobileLayout/m/')({
-  component: RouteComponent,
-})
-
-function RouteComponent() {
-  return <div>Hello "/(mobileStuff)/_mobileLayout/m/"!</div>
-}
--- a/frontend/src/components/navBar/Nav.tsx
+++ b/frontend/src/components/navBar/Nav.tsx
@@ -47,9 +47,7 @@ export default function Nav() {
 								</DropdownMenuLabel>
 								<DropdownMenuSeparator />
 								<DropdownMenuItem>
-									{/* <Link to="/passwordChange">
-                                            Password Change
-                                        </Link> */}
+									<Link to="/user/profile">Profile</Link>
 								</DropdownMenuItem>
 								{/* <DropdownMenuItem>Billing</DropdownMenuItem>
                                                <DropdownMenuItem>Team</DropdownMenuItem>
--- a/frontend/src/routeTree.gen.ts
+++ b/frontend/src/routeTree.gen.ts
@@ -15,11 +15,13 @@ import { Route as AdminLayoutRouteRouteImport } from './routes/_adminLayout/rout
 import { Route as IndexRouteImport } from './routes/index'
 import { Route as authLoginRouteImport } from './routes/(auth)/login'
 import { Route as mobileStuffMobileLayoutRouteRouteImport } from './routes/(mobileStuff)/_mobileLayout/route'
+import { Route as authUserIndexRouteImport } from './routes/(auth)/user/index'
 import { Route as AdminLayoutAdminSettingsRouteImport } from './routes/_adminLayout/admin/settings'
 import { Route as AdminLayoutAdminServersRouteImport } from './routes/_adminLayout/admin/servers'
 import { Route as logisticsLogisticsDeliveryScheduleRouteImport } from './routes/(logistics)/logistics/deliverySchedule'
 import { Route as authUserSignupRouteImport } from './routes/(auth)/user/signup'
 import { Route as authUserResetpasswordRouteImport } from './routes/(auth)/user/resetpassword'
+import { Route as authUserProfileRouteImport } from './routes/(auth)/user/profile'
 import { Route as AdminLayoutAdminUsersRouteRouteImport } from './routes/_adminLayout/admin/_users/route'
 import { Route as mobileStuffMobileLayoutMIndexRouteImport } from './routes/(mobileStuff)/_mobileLayout/m/index'
 import { Route as AdminLayoutAdminUsersUsersRouteImport } from './routes/_adminLayout/admin/_users/users'
@@ -59,6 +61,11 @@ const mobileStuffMobileLayoutRouteRoute =
    id: '/_mobileLayout',
    getParentRoute: () => mobileStuffRoute,
  } as any)
+const authUserIndexRoute = authUserIndexRouteImport.update({
+  id: '/(auth)/user/',
+  path: '/user/',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const AdminLayoutAdminSettingsRoute =
  AdminLayoutAdminSettingsRouteImport.update({
    id: '/settings',
@@ -86,6 +93,11 @@ const authUserResetpasswordRoute = authUserResetpasswordRouteImport.update({
  path: '/user/resetpassword',
  getParentRoute: () => rootRouteImport,
 } as any)
+const authUserProfileRoute = authUserProfileRouteImport.update({
+  id: '/(auth)/user/profile',
+  path: '/user/profile',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const AdminLayoutAdminUsersRouteRoute =
  AdminLayoutAdminUsersRouteRouteImport.update({
    id: '/_users',
@@ -132,11 +144,13 @@ export interface FileRoutesByFullPath {
  '/': typeof mobileStuffMobileLayoutRouteRouteWithChildren
  '/login': typeof authLoginRoute
  '/admin': typeof AdminLayoutAdminUsersRouteRouteWithChildren
+  '/user/profile': typeof authUserProfileRoute
  '/user/resetpassword': typeof authUserResetpasswordRoute
  '/user/signup': typeof authUserSignupRoute
  '/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
  '/admin/servers': typeof AdminLayoutAdminServersRoute
  '/admin/settings': typeof AdminLayoutAdminSettingsRoute
+  '/user': typeof authUserIndexRoute
  '/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
  '/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
  '/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
@@ -148,11 +162,13 @@ export interface FileRoutesByTo {
  '/': typeof mobileStuffMobileLayoutRouteRouteWithChildren
  '/login': typeof authLoginRoute
  '/admin': typeof AdminLayoutAdminUsersRouteRouteWithChildren
+  '/user/profile': typeof authUserProfileRoute
  '/user/resetpassword': typeof authUserResetpasswordRoute
  '/user/signup': typeof authUserSignupRoute
  '/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
  '/admin/servers': typeof AdminLayoutAdminServersRoute
  '/admin/settings': typeof AdminLayoutAdminSettingsRoute
+  '/user': typeof authUserIndexRoute
  '/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
  '/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
  '/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
@@ -169,11 +185,13 @@ export interface FileRoutesById {
  '/(auth)/login': typeof authLoginRoute
  '/_adminLayout/admin': typeof AdminLayoutAdminRouteWithChildren
  '/_adminLayout/admin/_users': typeof AdminLayoutAdminUsersRouteRouteWithChildren
+  '/(auth)/user/profile': typeof authUserProfileRoute
  '/(auth)/user/resetpassword': typeof authUserResetpasswordRoute
  '/(auth)/user/signup': typeof authUserSignupRoute
  '/(logistics)/logistics/deliverySchedule': typeof logisticsLogisticsDeliveryScheduleRoute
  '/_adminLayout/admin/servers': typeof AdminLayoutAdminServersRoute
  '/_adminLayout/admin/settings': typeof AdminLayoutAdminSettingsRoute
+  '/(auth)/user/': typeof authUserIndexRoute
  '/(mobileStuff)/_mobileLayout/m/cyclecounts': typeof mobileStuffMobileLayoutMCyclecountsRoute
  '/(mobileStuff)/_mobileLayout/m/delivery': typeof mobileStuffMobileLayoutMDeliveryRoute
  '/(mobileStuff)/_mobileLayout/m/relocate': typeof mobileStuffMobileLayoutMRelocateRoute
@@ -187,11 +205,13 @@ export interface FileRouteTypes {
    | '/'
    | '/login'
    | '/admin'
+    | '/user/profile'
    | '/user/resetpassword'
    | '/user/signup'
    | '/logistics/deliverySchedule'
    | '/admin/servers'
    | '/admin/settings'
+    | '/user'
    | '/m/cyclecounts'
    | '/m/delivery'
    | '/m/relocate'
@@ -203,11 +223,13 @@ export interface FileRouteTypes {
    | '/'
    | '/login'
    | '/admin'
+    | '/user/profile'
    | '/user/resetpassword'
    | '/user/signup'
    | '/logistics/deliverySchedule'
    | '/admin/servers'
    | '/admin/settings'
+    | '/user'
    | '/m/cyclecounts'
    | '/m/delivery'
    | '/m/relocate'
@@ -223,11 +245,13 @@ export interface FileRouteTypes {
    | '/(auth)/login'
    | '/_adminLayout/admin'
    | '/_adminLayout/admin/_users'
+    | '/(auth)/user/profile'
    | '/(auth)/user/resetpassword'
    | '/(auth)/user/signup'
    | '/(logistics)/logistics/deliverySchedule'
    | '/_adminLayout/admin/servers'
    | '/_adminLayout/admin/settings'
+    | '/(auth)/user/'
    | '/(mobileStuff)/_mobileLayout/m/cyclecounts'
    | '/(mobileStuff)/_mobileLayout/m/delivery'
    | '/(mobileStuff)/_mobileLayout/m/relocate'
@@ -241,9 +265,11 @@ export interface RootRouteChildren {
  AdminLayoutRouteRoute: typeof AdminLayoutRouteRouteWithChildren
  mobileStuffRoute: typeof mobileStuffRouteWithChildren
  authLoginRoute: typeof authLoginRoute
+  authUserProfileRoute: typeof authUserProfileRoute
  authUserResetpasswordRoute: typeof authUserResetpasswordRoute
  authUserSignupRoute: typeof authUserSignupRoute
  logisticsLogisticsDeliveryScheduleRoute: typeof logisticsLogisticsDeliveryScheduleRoute
+  authUserIndexRoute: typeof authUserIndexRoute
 }

 declare module '@tanstack/react-router' {
@@ -290,6 +316,13 @@ declare module '@tanstack/react-router' {
      preLoaderRoute: typeof mobileStuffMobileLayoutRouteRouteImport
      parentRoute: typeof mobileStuffRoute
    }
+    '/(auth)/user/': {
+      id: '/(auth)/user/'
+      path: '/user'
+      fullPath: '/user'
+      preLoaderRoute: typeof authUserIndexRouteImport
+      parentRoute: typeof rootRouteImport
+    }
    '/_adminLayout/admin/settings': {
      id: '/_adminLayout/admin/settings'
      path: '/settings'
@@ -325,6 +358,13 @@ declare module '@tanstack/react-router' {
      preLoaderRoute: typeof authUserResetpasswordRouteImport
      parentRoute: typeof rootRouteImport
    }
+    '/(auth)/user/profile': {
+      id: '/(auth)/user/profile'
+      path: '/user/profile'
+      fullPath: '/user/profile'
+      preLoaderRoute: typeof authUserProfileRouteImport
+      parentRoute: typeof rootRouteImport
+    }
    '/_adminLayout/admin/_users': {
      id: '/_adminLayout/admin/_users'
      path: '/admin'
@@ -460,10 +500,12 @@ const rootRouteChildren: RootRouteChildren = {
  AdminLayoutRouteRoute: AdminLayoutRouteRouteWithChildren,
  mobileStuffRoute: mobileStuffRouteWithChildren,
  authLoginRoute: authLoginRoute,
+  authUserProfileRoute: authUserProfileRoute,
  authUserResetpasswordRoute: authUserResetpasswordRoute,
  authUserSignupRoute: authUserSignupRoute,
  logisticsLogisticsDeliveryScheduleRoute:
    logisticsLogisticsDeliveryScheduleRoute,
+  authUserIndexRoute: authUserIndexRoute,
 }
 export const routeTree = rootRouteImport
  ._addFileChildren(rootRouteChildren)
--- a/frontend/src/routes/(auth)/-components/LoginForm.tsx
+++ b/frontend/src/routes/(auth)/-components/LoginForm.tsx
@@ -1,133 +1,129 @@
 import { Link, useRouter, useSearch } from "@tanstack/react-router";
-import {
-    getSession,
-    signin,
-    useAuth,
-    useUserRoles,
-} from "../../../lib/authClient";
-import { useAppForm } from "../../../lib/formStuff";
-import { LstCard } from "../../../components/ui/lstCard";
+import axios from "axios";
 import { toast } from "sonner";
 import {
-    CardContent,
-    CardDescription,
-    CardHeader,
-    CardTitle,
+	CardContent,
+	CardDescription,
+	CardHeader,
+	CardTitle,
 } from "../../../components/ui/card";
+import { LstCard } from "../../../components/ui/lstCard";
+import { getSession, useAuth, useUserRoles } from "../../../lib/authClient";
+import { useAppForm } from "../../../lib/formStuff";

 export default function LoginForm() {
-    const router = useRouter();
-    const search = useSearch({ from: "/(auth)/login" });
-    const username = localStorage.getItem("username") || "";
-    const rememeberMe = localStorage.getItem("rememberMe") === "true";
-    const { setSession } = useAuth();
-    const { fetchRoles } = useUserRoles();
+	const router = useRouter();
+	const search = useSearch({ from: "/(auth)/login" });
+	const username = localStorage.getItem("username") || "";
+	const rememberMe = localStorage.getItem("rememberMe") === "true";
+	const { setSession } = useAuth();
+	const { fetchRoles } = useUserRoles();

-    const form = useAppForm({
-        defaultValues: {
-            username: username,
-            password: "",
-            rememberMe: rememeberMe,
-        },
-        onSubmit: async ({ value }) => {
-            if (value.rememberMe) {
-                localStorage.setItem("rememberMe", value.rememberMe.toString());
-                localStorage.setItem("username", value.username);
-            } else {
-                localStorage.removeItem("rememberMe");
-                localStorage.removeItem("username");
-            }
+	const form = useAppForm({
+		defaultValues: {
+			username: username,
+			password: "",
+			rememberMe: rememberMe,
+		},
+		onSubmit: async ({ value }) => {
+			if (value.rememberMe) {
+				localStorage.setItem("rememberMe", value.rememberMe.toString());
+				localStorage.setItem("username", value.username);
+			} else {
+				localStorage.removeItem("rememberMe");
+				localStorage.removeItem("username");
+			}

-            try {
-                await signin({
-                    username: value.username,
-                    password: value.password,
-                });
+			try {
+				await axios.post("/lst/api/user/login", {
+					username: value.username,
+					password: value.password,
+				});

-                const session = await getSession();
-                setSession(session);
-                form.reset();
-                fetchRoles();
+				const session = await getSession();
+				setSession(session);
+				form.reset();
+				fetchRoles();

-                toast.success(
-                    `Welcome back ${session?.user.name ? session?.user.name : session?.user.username} `
-                );
-                router.invalidate();
-                router.history.push(search.redirect ? search.redirect : "/");
-            } catch (error) {
-                // @ts-ignore
-                toast.error(error?.message);
-            }
-        },
-    });
-    return (
-        <div className="">
-            <LstCard className="p-3 w-96">
-                <CardHeader>
-                    <CardTitle>Login to your account</CardTitle>
-                    <CardDescription>
-                        Enter your username and password below
-                    </CardDescription>
-                </CardHeader>
-                <CardContent>
-                    <form
-                        onSubmit={(e) => {
-                            e.preventDefault();
-                            form.handleSubmit();
-                        }}
-                    >
-                        <form.AppField
-                            name="username"
-                            children={(field) => (
-                                <field.InputField
-                                    label="Username"
-                                    inputType="string"
-                                    required={true}
-                                />
-                            )}
-                        />
-                        <form.AppField
-                            name="password"
-                            children={(field) => (
-                                <field.InputPasswordField
-                                    label="Password"
-                                    required={true}
-                                />
-                            )}
-                        />
-                        <div className="flex flex-row justify-between mt-3 mb-3">
-                            <form.AppField
-                                name="rememberMe"
-                                children={(field) => (
-                                    <field.CheckboxField label="Remember me" />
-                                )}
-                            />
-                            <Link
-                                to="/user/resetpassword"
-                                className="inline-block text-sm underline-offset-4 hover:underline"
-                            >
-                                Forgot your password?
-                            </Link>
-                        </div>
+				toast.success(
+					`Welcome back ${session?.user.name ? session?.user.name : session?.user.username} `,
+				);
+				router.invalidate();
+				router.history.push(search.redirect ? search.redirect : "/");
+			} catch (error) {
+				// @ts-ignore
+				if (!error.response.success) {
+					// @ts-ignore
+					toast.error(error.response.data.message);
+				} else {
+					// @ts-ignore
+					toast.error(error?.message);
+				}
+			}
+		},
+	});
+	return (
+		<div className="">
+			<LstCard className="p-3 w-96">
+				<CardHeader>
+					<CardTitle>Login to your account</CardTitle>
+					<CardDescription>
+						Enter your username and password below
+					</CardDescription>
+				</CardHeader>
+				<CardContent>
+					<form
+						onSubmit={(e) => {
+							e.preventDefault();
+							form.handleSubmit();
+						}}
+					>
+						<form.AppField
+							name="username"
+							children={(field) => (
+								<field.InputField
+									label="Username"
+									inputType="string"
+									required={true}
+								/>
+							)}
+						/>
+						<form.AppField
+							name="password"
+							children={(field) => (
+								<field.InputPasswordField label="Password" required={true} />
+							)}
+						/>
+						<div className="flex flex-row justify-between mt-3 mb-3">
+							<form.AppField
+								name="rememberMe"
+								children={(field) => (
+									<field.CheckboxField label="Remember me" />
+								)}
+							/>
+							<Link
+								to="/user/resetpassword"
+								className="inline-block text-sm underline-offset-4 hover:underline"
+							>
+								Forgot your password?
+							</Link>
+						</div>

-                        <div className="flex justify-end mt-2">
-                            <form.AppForm>
-                                <form.SubmitButton>Login</form.SubmitButton>
-                            </form.AppForm>
-                        </div>
-                    </form>
+						<div className="flex justify-end mt-2">
+							<form.AppForm>
+								<form.SubmitButton>Login</form.SubmitButton>
+							</form.AppForm>
+						</div>
+					</form>

-                    <div className="mt-4 text-center text-sm">
-                        Don&apos;t have an account?{" "}
-                        <Link
-                            to={"/user/signup"}
-                            className="underline underline-offset-4"
-                        >
-                            Sign up
-                        </Link>
-                    </div>
-                </CardContent>
-            </LstCard>
-        </div>
-    );
+					<div className="mt-4 text-center text-sm">
+						Don&apos;t have an account?{" "}
+						<Link to={"/user/signup"} className="underline underline-offset-4">
+							Sign up
+						</Link>
+					</div>
+				</CardContent>
+			</LstCard>
+		</div>
+	);
 }
--- a/frontend/src/routes/(auth)/user/index.tsx
+++ b/frontend/src/routes/(auth)/user/index.tsx
@@ -0,0 +1,13 @@
+import { createFileRoute } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/(auth)/user/")({
+	component: RouteComponent,
+});
+
+function RouteComponent() {
+	return (
+		<div>
+			<span>Nothing here </span>
+		</div>
+	);
+}
--- a/frontend/src/routes/(auth)/user/profile.tsx
+++ b/frontend/src/routes/(auth)/user/profile.tsx
@@ -0,0 +1,40 @@
+import { createFileRoute, redirect } from "@tanstack/react-router";
+import { authClient, useAuth } from "../../../lib/authClient";
+
+export const Route = createFileRoute("/(auth)/user/profile")({
+	beforeLoad: async () => {
+		const result = await authClient.getSession({
+			query: { disableCookieCache: true }, // force DB/Server lookup
+		});
+
+		//console.log("session check:", result.data);
+
+		if (!result.data) {
+			throw redirect({
+				to: "/login",
+				search: {
+					redirect: location.pathname + location.search,
+				},
+			});
+		}
+	},
+	component: RouteComponent,
+});
+
+function RouteComponent() {
+	const { session } = useAuth();
+
+	return (
+		<div className="m-2">
+			<div>
+				<span>Things you can change</span>
+				<ol>
+					<li>Display name: {session?.user.displayUsername}</li>
+					<li>Name: {session?.user.name}</li>
+					<li>Image: To be added</li>
+					<li>password: **************</li>
+				</ol>
+			</div>
+		</div>
+	);
+}
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,66 +1,62 @@
-import { defineConfig } from "vite";
-import react from "@vitejs/plugin-react-swc";
-import { tanstackRouter } from "@tanstack/router-plugin/vite";
 import tailwindcss from "@tailwindcss/vite";
-import path from "path";
+import { tanstackRouter } from "@tanstack/router-plugin/vite";
+import react from "@vitejs/plugin-react-swc";
 import dotenv from "dotenv";
+import path from "path";
 import { fileURLToPath } from "url";
+import { defineConfig } from "vite";

 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);

 dotenv.config({
-    path: path.resolve(__dirname, "../.env"),
+	path: path.resolve(__dirname, "../.env"),
 });

 // https://vite.dev/config/
 export default defineConfig({
-    plugins: [
-        react(),
-        tailwindcss(),
-        tanstackRouter({
-            target: "react",
-            autoCodeSplitting: true,
-        }),
-    ],
-    base: "/lst/app",
-    build: {
-        //outDir: "../backend/frontend",
-        //assetsDir: "assets",
-        emptyOutDir: true,
-    },
-    resolve: {
-        alias: {
-            "@": path.resolve(__dirname, "./src"),
-        },
-    },
-    server: {
-        port: 5500,
-        host: true,
-        allowedHosts: true,
-        proxy: {
-            "/lst/api": {
-                target: `http://localhost:${Number(
-                    process.env.VITE_PORT || 4000
-                )}`,
-                changeOrigin: true,
-                secure: false,
-            },
-            "/lst/ws": {
-                target: `ws://localhost:${Number(
-                    process.env.VITE_PORT || 4000
-                )}`, // Your Go WebSocket endpoint
-                ws: true,
-                changeOrigin: true,
-                secure: false,
-                rewrite: (path) => path.replace(/^\/ws/, ""),
-            },
-            // Proxy docs to Docusaurus
-            "/lst/d": {
-                target: `http://localhost:4300`,
-                changeOrigin: true,
-                //rewrite: (path) => path.replace(/^\/lst\/d/, "/"),
-            },
-        },
-    },
+	plugins: [
+		react(),
+		tailwindcss(),
+		tanstackRouter({
+			target: "react",
+			autoCodeSplitting: true,
+		}),
+	],
+	base: "/lst/app",
+	build: {
+		//outDir: "../backend/frontend",
+		//assetsDir: "assets",
+		emptyOutDir: true,
+	},
+	resolve: {
+		alias: {
+			"@": path.resolve(__dirname, "./src"),
+		},
+	},
+	server: {
+		port: 5500,
+		host: true,
+		allowedHosts: true,
+		proxy: {
+			"/lst/api": {
+				target: `http://localhost:${Number(process.env.VITE_PORT || 4000)}`,
+				changeOrigin: true,
+				secure: false,
+			},
+			"/lst/ws": {
+				target: `ws://localhost:${Number(process.env.VITE_PORT || 4000)}`, // Your Go WebSocket endpoint
+				ws: true,
+				changeOrigin: true,
+				secure: false,
+				rewrite: (path) => path.replace(/^\/ws/, ""),
+			},
+			// Proxy docs to Docusaurus
+			"/lst/d": {
+				target: `http://localhost:4300`,
+				changeOrigin: true,
+				//rewrite: (path) => path.replace(/^\/lst\/d/, "/"),
+			},
+		},
+	},
 });