feat(migration): moved changed log and properly added in the link to it

frontend/package-lock.json

@@ -36,6 +36,7 @@
                 "is-mobile": "^5.0.0",
                 "js-cookie": "^3.0.5",
                 "lucide-react": "^0.542.0",
+                "marked": "^16.4.1",
                 "moment": "^2.30.1",
                 "r": "^0.0.5",
                 "react": "^19.1.1",
@@ -6097,6 +6098,18 @@
                 "@jridgewell/sourcemap-codec": "^1.5.5"
             }
         },
+        "node_modules/marked": {
+            "version": "16.4.1",
+            "resolved": "https://registry.npmjs.org/marked/-/marked-16.4.1.tgz",
+            "integrity": "sha512-ntROs7RaN3EvWfy3EZi14H4YxmT6A5YvywfhO+0pm+cH/dnSQRmdAmoFIc3B9aiwTehyk7pESH4ofyBY+V5hZg==",
+            "license": "MIT",
+            "bin": {
+                "marked": "bin/marked.js"
+            },
+            "engines": {
+                "node": ">= 20"
+            }
+        },
         "node_modules/math-intrinsics": {
             "version": "1.1.0",
             "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",

frontend/package.json

@@ -38,6 +38,7 @@
         "is-mobile": "^5.0.0",
         "js-cookie": "^3.0.5",
         "lucide-react": "^0.542.0",
+        "marked": "^16.4.1",
         "moment": "^2.30.1",
         "r": "^0.0.5",
         "react": "^19.1.1",

frontend/src/components/changelog/ChangeLog.tsx

@@ -0,0 +1,34 @@
+// src/components/Changelog.jsx
+
+import { marked } from "marked";
+import changelog from "../../../../CHANGELOG.md?raw"; // assuming changelog.md is in root ?raw
+
+const Changelog = () => {
+	const html: any = marked.parse(changelog);
+	const recentChanges = html.split("<h2>")[1];
+	// const [htmlContent, setHtmlContent] = useState("");
+
+	// useEffect(() => {
+	//     fetch("/changelog.md")
+	//         .then((res) => res.text())
+	//         .then((md) => {
+	//             const versionBlocks = md.split(/^##\s+/gm); // Split on headings
+	//             if (versionBlocks.length > 1) {
+	//                 const latestBlock = `## ${versionBlocks[1]}`;
+	//                 const html: any = marked.parse(latestBlock, {
+	//                     breaks: true,
+	//                     gfm: true,
+	//                 });
+	//                 setHtmlContent(html);
+	//             }
+	//         });
+	// }, []);
+	return (
+		<div
+			className="prose m-3"
+			dangerouslySetInnerHTML={{ __html: `<h2>${recentChanges}` }}
+		/>
+	);
+};
+
+export default Changelog;

frontend/src/components/navBar/Nav.tsx

@@ -28,7 +28,9 @@ export default function Nav() {
 						</a>
 					</Button>
 				</div>
-
+				<Button className="m-1">
+					<Link to="/old">Old Version</Link>
+				</Button>
 				{session ? (
 					<div className="m-1">
 						<DropdownMenu>
@@ -49,9 +51,7 @@ export default function Nav() {
 								<DropdownMenuItem>
 									<Link to="/user/profile">Profile</Link>
 								</DropdownMenuItem>
-								<DropdownMenuItem>
+
-									<Link to="/old">LST-Old</Link>
-								</DropdownMenuItem>
 								{/* <DropdownMenuItem>Billing</DropdownMenuItem>
                                                 <DropdownMenuItem>Team</DropdownMenuItem>
                                                 <DropdownMenuItem>Subscription</DropdownMenuItem> */}

frontend/src/components/navBar/SideBarNav.tsx

@@ -1,8 +1,10 @@
+import { Link } from "@tanstack/react-router";
 import { userAccess } from "../../lib/authClient";
 import {
 	Sidebar,
 	SidebarContent,
 	SidebarFooter,
+	SidebarMenuItem,
 	SidebarTrigger,
 } from "../ui/sidebar";
 import Admin from "./Admin";
@@ -18,6 +20,9 @@ export default function SideBarNav() {
 				</SidebarContent>
 
 				<SidebarFooter>
+					<SidebarMenuItem>
+						<Link to={"/changelog"}>Changelog</Link>
+					</SidebarMenuItem>
 					<SidebarTrigger />
 				</SidebarFooter>
 			</Sidebar>

frontend/src/routeTree.gen.ts

@@ -13,6 +13,7 @@ import { createFileRoute } from '@tanstack/react-router'
 import { Route as rootRouteImport } from './routes/__root'
 import { Route as AppRouteRouteImport } from './routes/_app/route'
 import { Route as AppIndexRouteImport } from './routes/_app/index'
+import { Route as AppChangelogRouteImport } from './routes/_app/changelog'
 import { Route as OldOldRouteRouteImport } from './routes/_old/old/route'
 import { Route as MobileMobileLayoutRouteRouteImport } from './routes/_mobile/_mobileLayout/route'
 import { Route as AppAdminLayoutRouteRouteImport } from './routes/_app/_adminLayout/route'
@@ -49,6 +50,11 @@ const AppIndexRoute = AppIndexRouteImport.update({
   path: '/',
   getParentRoute: () => AppRouteRoute,
 } as any)
+const AppChangelogRoute = AppChangelogRouteImport.update({
+  id: '/changelog',
+  path: '/changelog',
+  getParentRoute: () => AppRouteRoute,
+} as any)
 const OldOldRouteRoute = OldOldRouteRouteImport.update({
   id: '/_old/old',
   path: '/old',
@@ -178,6 +184,7 @@ const OldOldlogisticsSiloAdjustmentsCommentCommentRoute =
 
 export interface FileRoutesByFullPath {
   '/old': typeof OldOldRouteRouteWithChildren
+  '/changelog': typeof AppChangelogRoute
   '/': typeof AppIndexRoute
   '/login': typeof AppauthLoginRoute
   '/old/': typeof OldOldIndexRoute
@@ -200,6 +207,7 @@ export interface FileRoutesByFullPath {
   '/old/siloAdjustments/comment/$comment': typeof OldOldlogisticsSiloAdjustmentsCommentCommentRoute
 }
 export interface FileRoutesByTo {
+  '/changelog': typeof AppChangelogRoute
   '/': typeof AppIndexRoute
   '/login': typeof AppauthLoginRoute
   '/old': typeof OldOldIndexRoute
@@ -227,6 +235,7 @@ export interface FileRoutesById {
   '/_app/_adminLayout': typeof AppAdminLayoutRouteRouteWithChildren
   '/_mobile/_mobileLayout': typeof MobileMobileLayoutRouteRouteWithChildren
   '/_old/old': typeof OldOldRouteRouteWithChildren
+  '/_app/changelog': typeof AppChangelogRoute
   '/_app/': typeof AppIndexRoute
   '/_app/(auth)/login': typeof AppauthLoginRoute
   '/_old/old/': typeof OldOldIndexRoute
@@ -253,6 +262,7 @@ export interface FileRouteTypes {
   fileRoutesByFullPath: FileRoutesByFullPath
   fullPaths:
     | '/old'
+    | '/changelog'
     | '/'
     | '/login'
     | '/old/'
@@ -275,6 +285,7 @@ export interface FileRouteTypes {
     | '/old/siloAdjustments/comment/$comment'
   fileRoutesByTo: FileRoutesByTo
   to:
+    | '/changelog'
     | '/'
     | '/login'
     | '/old'
@@ -301,6 +312,7 @@ export interface FileRouteTypes {
     | '/_app/_adminLayout'
     | '/_mobile/_mobileLayout'
     | '/_old/old'
+    | '/_app/changelog'
     | '/_app/'
     | '/_app/(auth)/login'
     | '/_old/old/'
@@ -346,6 +358,13 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof AppIndexRouteImport
       parentRoute: typeof AppRouteRoute
     }
+    '/_app/changelog': {
+      id: '/_app/changelog'
+      path: '/changelog'
+      fullPath: '/changelog'
+      preLoaderRoute: typeof AppChangelogRouteImport
+      parentRoute: typeof AppRouteRoute
+    }
     '/_old/old': {
       id: '/_old/old'
       path: '/old'
@@ -556,6 +575,7 @@ const AppAdminLayoutRouteRouteWithChildren =
 
 interface AppRouteRouteChildren {
   AppAdminLayoutRouteRoute: typeof AppAdminLayoutRouteRouteWithChildren
+  AppChangelogRoute: typeof AppChangelogRoute
   AppIndexRoute: typeof AppIndexRoute
   AppauthLoginRoute: typeof AppauthLoginRoute
   AppauthUserProfileRoute: typeof AppauthUserProfileRoute
@@ -567,6 +587,7 @@ interface AppRouteRouteChildren {
 
 const AppRouteRouteChildren: AppRouteRouteChildren = {
   AppAdminLayoutRouteRoute: AppAdminLayoutRouteRouteWithChildren,
+  AppChangelogRoute: AppChangelogRoute,
   AppIndexRoute: AppIndexRoute,
   AppauthLoginRoute: AppauthLoginRoute,
   AppauthUserProfileRoute: AppauthUserProfileRoute,

frontend/src/routes/_app/changelog.tsx

@@ -0,0 +1,14 @@
+import { createFileRoute } from "@tanstack/react-router";
+import Changelog from "@/components/changelog/ChangeLog";
+
+export const Route = createFileRoute("/_app/changelog")({
+	component: RouteComponent,
+});
+
+function RouteComponent() {
+	return (
+		<div className="m-2">
+			<Changelog />
+		</div>
+	);
+}

frontend/src/routes/_old/old/-components/layout/lst-sidebar.tsx

@@ -1,7 +1,9 @@
+import { Link } from "@tanstack/react-router";
 import {
 	Sidebar,
 	SidebarContent,
 	SidebarFooter,
+	SidebarMenuItem,
 	SidebarTrigger,
 } from "../../../../../components/ui/sidebar";
 import {
@@ -48,6 +50,9 @@ export function AppSidebar() {
 				)}
 			</SidebarContent>
 			<SidebarFooter>
+				<SidebarMenuItem>
+					<Link to={"/changelog"}>Changelog</Link>
+				</SidebarMenuItem>
 				<SidebarTrigger />
 			</SidebarFooter>
 		</Sidebar>

frontend/src/routes/_old/old/route.tsx

@@ -1,5 +1,6 @@
 import { createFileRoute, Link, Outlet } from "@tanstack/react-router";
 import Cookies from "js-cookie";
+import { Button } from "@/components/ui/button";
 import { ModeToggle } from "../../../components/mode-toggle";
 import {
 	Avatar,
@@ -60,7 +61,9 @@ function RouteComponent() {
 							</a>
 						)}
 					</div> */}
-
+					<Button className="m-1">
+						<Link to="/">New Version</Link>
+					</Button>
 					{session ? (
 						<div className="m-1">
 							<DropdownMenu>
@@ -81,9 +84,7 @@ function RouteComponent() {
 									<DropdownMenuItem>
 										{/* <Link to="/passwordChange">Password Change</Link> */}
 									</DropdownMenuItem>
-									<DropdownMenuItem>
+
-										<Link to="/">New Version</Link>
-									</DropdownMenuItem>
 									{/* <DropdownMenuItem>Billing</DropdownMenuItem>
                                                 <DropdownMenuItem>Team</DropdownMenuItem>
                                                 <DropdownMenuItem>Subscription</DropdownMenuItem> */}
@@ -97,9 +98,9 @@ function RouteComponent() {
 							</DropdownMenu>
 						</div>
 					) : (
-						<div>
+						<Button className="m-1">
 							<Link to="/login">Login</Link>
-						</div>
+						</Button>
 					)}
 				</div>
 			</nav>

lstV2/frontend/src/components/changelog/ChangeLog.tsx

@@ -1,33 +0,0 @@
-// src/components/Changelog.jsx
-import { marked } from "marked";
-import changelog from "../../../../CHANGELOG.md?raw"; // assuming changelog.md is in root
-
-const Changelog = () => {
-    const html: any = marked.parse(changelog);
-    const recentChanges = html.split("<h2>")[1];
-    // const [htmlContent, setHtmlContent] = useState("");
-
-    // useEffect(() => {
-    //     fetch("/changelog.md")
-    //         .then((res) => res.text())
-    //         .then((md) => {
-    //             const versionBlocks = md.split(/^##\s+/gm); // Split on headings
-    //             if (versionBlocks.length > 1) {
-    //                 const latestBlock = `## ${versionBlocks[1]}`;
-    //                 const html: any = marked.parse(latestBlock, {
-    //                     breaks: true,
-    //                     gfm: true,
-    //                 });
-    //                 setHtmlContent(html);
-    //             }
-    //         });
-    // }, []);
-    return (
-        <div
-            className="prose m-3"
-            dangerouslySetInnerHTML={{ __html: `<h2>${recentChanges}` }}
-        />
-    );
-};
-
-export default Changelog;

lstV2/frontend/src/components/dashboard/AddCards.tsx

@@ -1,47 +0,0 @@
-import { Button } from "@/components/ui/button";
-import {
-    Dialog,
-    DialogContent,
-    DialogDescription,
-    DialogHeader,
-    DialogTitle,
-    DialogTrigger,
-} from "@/components/ui/dialog";
-import Cards from "./Cards";
-//import { toast } from "sonner";
-
-export function AddCards() {
-    return (
-        <Dialog>
-            <DialogTrigger asChild>
-                <Button variant="outline">Add Cards</Button>
-            </DialogTrigger>
-            <DialogContent className="min-w-fit ">
-                <DialogHeader>
-                    <DialogTitle>Cards</DialogTitle>
-                    <DialogDescription>
-                        Manage Cards and there settings.
-                    </DialogDescription>
-                </DialogHeader>
-
-                <div className="flex flex-row">
-                    <div className="">
-                        <Cards name={"ppoo"} inventory />
-                        <Cards name={"inv-empty"} rowType={"empty"} />
-                        <Cards name={"inv-fg"} rowType={"fg"} />
-                    </div>
-                    <div className="">
-                        <Cards name={"inv-materials"} rowType={"materials"} />
-                        <Cards name={"inv-packaging"} rowType={"packaging"} />
-                        <Cards name={"inv-waste"} rowType={"waste"} />
-                        <Cards name={"openOrder"} inventory />
-                    </div>
-                </div>
-
-                {/* <DialogFooter>
-                    <Button type="submit">Save changes</Button>
-                </DialogFooter> */}
-            </DialogContent>
-        </Dialog>
-    );
-}

lstV2/frontend/src/components/dashboard/Cards.tsx

@@ -1,108 +0,0 @@
-import { useCardStore } from "@/lib/store/useCardStore";
-import { Label } from "../ui/label";
-import { Checkbox } from "../ui/checkbox";
-import { Button } from "../ui/button";
-import { useAppForm } from "@/utils/formStuff";
-
-export default function Cards(card: any) {
-    const { addCard, removeCard, cards } = useCardStore();
-    let existing: any = cards.filter((n: any) => n.name === card.name);
-
-    //console.log(existing);
-    const form = useAppForm({
-        defaultValues: {
-            name: existing[0]?.name || card.name,
-            rowType: existing[0]?.type ?? card.rowType,
-            age: existing[0]?.age ?? 90,
-            active: existing[0]?.active ?? false,
-        },
-        onSubmit: async ({ value }) => {
-            console.log(value);
-            const testCard: any = cards.filter(
-                (i: any) => i.name === value.name
-            );
-
-            if (value.active) {
-                const newCard = {
-                    name: `${value.name}`,
-                    rowType: value.rowType,
-                    age: value.age ?? 90,
-                    active: value.active,
-                };
-                if (testCard.length > 0) {
-                    removeCard(value.name);
-                    addCard(newCard);
-                    return;
-                }
-                // change the name for a type card
-
-                addCard(newCard);
-            } else {
-                removeCard(value.name);
-            }
-        },
-    });
-    return (
-        <div className="border-solid border-2 m-2">
-            <p>{card.name}</p>
-            <form
-                onSubmit={(e) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                }}
-                className="flex flex-row"
-            >
-                <form.AppField
-                    name="active"
-                    // validators={{
-                    //     // We can choose between form-wide and field-specific validators
-                    //     onChange: ({ value }) =>
-                    //         value.length > 3
-                    //             ? undefined
-                    //             : "Username must be longer than 3 letters",
-                    // }}
-                    children={(field) => {
-                        return (
-                            <div className="m-2 p-2 flex flex-row">
-                                <div>
-                                    <Label htmlFor="active">
-                                        <span>Active</span>
-                                    </Label>
-                                </div>
-
-                                <Checkbox
-                                    className="ml-2"
-                                    name={field.name}
-                                    onBlur={field.handleBlur}
-                                    checked={field.state.value}
-                                    onCheckedChange={(e) =>
-                                        field.handleChange(e)
-                                    }
-                                />
-                            </div>
-                        );
-                    }}
-                />
-                {!card.inventory && (
-                    <>
-                        <form.AppField
-                            name="age"
-                            children={(field) => (
-                                <field.InputField
-                                    label="Age"
-                                    inputType="number"
-                                    required={true}
-                                />
-                            )}
-                        />
-                    </>
-                )}
-                <div className="mt-7">
-                    <Button type="submit" onClick={() => form.handleSubmit()}>
-                        Save Card
-                    </Button>
-                </div>
-            </form>
-        </div>
-    );
-}

lstV2/frontend/src/components/dashboard/DashBoard.tsx

@@ -1,84 +0,0 @@
-import { useCardStore } from "@/lib/store/useCardStore";
-import INVCheckCard from "../logistics/warehouse/InventoryCard";
-import PPOO from "../logistics/warehouse/PPOOCard";
-import OpenOrders from "../logistics/warehouse/openOrders";
-
-const componentsMap: any = {
-    ppoo: PPOO,
-    inv: INVCheckCard,
-    openOrder: OpenOrders,
-    //QualityRequest,
-};
-
-export default function DashBoard() {
-    const { cards } = useCardStore();
-
-    //console.log(cards);
-    return (
-        <div className="ml-5 w-11/12 h-9/10 grid grid-cols-12 gap-1">
-            {cards.map((a: any) => {
-                const name = a.name; //.filter((c) => c.i === card.i)[0].i || "name";
-
-                const Component = componentsMap[name.split("-")[0]];
-                if (name === "openOrder") {
-                    return (
-                        <div key={a.name} className="col-span-6">
-                            <Component age={a.age} type={a.rowType} />
-                        </div>
-                    );
-                } else {
-                    //console.log(name.split("-")[0], a);
-                    return (
-                        <div key={a.name} className="col-span-3">
-                            <Component data={a} />
-                        </div>
-                    );
-                }
-            })}
-        </div>
-    );
-
-    // return (
-    //     <div className="ml-5 w-11/12 h-9/10 grid grid-cols-12 gap-1">
-    //         <div className="col-span-3">
-    //             <PPOO />
-    //         </div>
-    //         <div className="col-span-3">
-    //             <INVCheckCard age={90} type={"empty"} />
-    //         </div>
-    //         <div className="col-span-3">
-    //             <INVCheckCard age={75} type={"fg"} />
-    //         </div>
-    //         <div className="col-span-3">
-    //             <INVCheckCard age={30} type={"materials"} />
-    //         </div>
-    //         <div className="col-span-3">
-    //             <INVCheckCard age={7} type={"waste"} />
-    //         </div>
-    //         <div className="col-span-3">
-    //             <INVCheckCard age={7} type={"packaging"} />
-    //         </div>
-    //     </div>
-    // );
-}
-
-/*
-<div className="col-span-3">
-                <PPOO />
-            </div>
-            <div className="col-span-3">
-                <INVCheckCard age={30} type={"empty"} />
-            </div>
-            <div className="col-span-3">
-                <INVCheckCard age={30} type={"fg"} />
-            </div>
-            <div className="col-span-3">
-                <INVCheckCard age={30} type={"materials"} />
-            </div>
-            <div className="col-span-3">
-                <INVCheckCard age={30} type={"waste"} />
-            </div>
-            <div className="col-span-3">
-                <INVCheckCard age={30} type={"packaging"} />
-            </div>
-*/