Implementing editing results as new tool + prettier entire solution

This commit is contained in:
Igor Barcik 2023-11-01 18:01:27 +01:00
parent 19dd8a4276
commit b9ba12cb3a
Signed by: biggy
GPG Key ID: EA4CE0D1E2A6DC98
14 changed files with 116 additions and 169 deletions

View File

@ -21,11 +21,7 @@ const Breadcrumbs = () => {
return _route?.name || path; return _route?.name || path;
}; };
const renderLinkBreadcrumb = ( const renderLinkBreadcrumb = (value: string, index: number, pathnames: string[]) => {
value: string,
index: number,
pathnames: string[],
) => {
if (value === pathParams.id) return null; if (value === pathParams.id) return null;
const to = `/${pathnames.slice(0, index + 1).join("/")}`; const to = `/${pathnames.slice(0, index + 1).join("/")}`;
const routeName = capitalizeFirstLetter(findRouteNameByPath(value)); const routeName = capitalizeFirstLetter(findRouteNameByPath(value));
@ -47,9 +43,7 @@ const Breadcrumbs = () => {
}; };
if (hideBreadcrumbBar(location.pathname)) { if (hideBreadcrumbBar(location.pathname)) {
return ( return <div className={BREADCRUMB_BAR_CLASSES}>{pathnames[0].toUpperCase()}</div>;
<div className={BREADCRUMB_BAR_CLASSES}>{pathnames[0].toUpperCase()}</div>
);
} }
return ( return (
@ -60,9 +54,7 @@ const Breadcrumbs = () => {
</li> </li>
{pathnames.map((value, index) => { {pathnames.map((value, index) => {
const isLast = index === pathnames.length - 1; const isLast = index === pathnames.length - 1;
return isLast return isLast ? renderTextBreadcrumb(value) : renderLinkBreadcrumb(value, index, pathnames);
? renderTextBreadcrumb(value)
: renderLinkBreadcrumb(value, index, pathnames);
})} })}
</ul> </ul>
</div> </div>

View File

@ -3,9 +3,7 @@ import { ReactNode } from "react";
const CardGrid = ({ children }: { children: ReactNode }) => { const CardGrid = ({ children }: { children: ReactNode }) => {
return ( return (
<div className="flex justify-center items-center p-8"> <div className="flex justify-center items-center p-8">
<div className="grid gap-8 xl:grid-cols-4 lg:grid-cols-3 md:grid-cols-2 sm:grid-cols-1"> <div className="grid gap-8 xl:grid-cols-4 lg:grid-cols-3 md:grid-cols-2 sm:grid-cols-1">{children}</div>
{children}
</div>
</div> </div>
); );
}; };

View File

@ -8,13 +8,8 @@ import useConfirmationDialog from "./useConfirmationDialog";
* @returns ConfirmationDialog component * @returns ConfirmationDialog component
*/ */
const ConfirmationDialog = () => { const ConfirmationDialog = () => {
const { const { isConfirmationDialogVisible, handleConfirm, handleCancel, customModalBoxStyles, customModalStyles } =
isConfirmationDialogVisible, useConfirmationDialog();
handleConfirm,
handleCancel,
customModalBoxStyles,
customModalStyles,
} = useConfirmationDialog();
return ( return (
<> <>

View File

@ -1,13 +1,8 @@
import { useState } from "react"; import { useState } from "react";
import { ConfirmationDialogContext } from "../../contexts/ConfirmationDialogContext"; import { ConfirmationDialogContext } from "../../contexts/ConfirmationDialogContext";
export const ConfirmationDialogProvider = ({ export const ConfirmationDialogProvider = ({ children }: { children: React.ReactNode }) => {
children, const [isConfirmationDialogVisible, setIsConfirmationDialogVisible] = useState(false);
}: {
children: React.ReactNode;
}) => {
const [isConfirmationDialogVisible, setIsConfirmationDialogVisible] =
useState(false);
const [customModalBoxStyles, setCustomModalBoxStyles] = useState(""); const [customModalBoxStyles, setCustomModalBoxStyles] = useState("");
const [customModalStyles, setCustomModalStyles] = useState(""); const [customModalStyles, setCustomModalStyles] = useState("");

View File

@ -1,8 +1,5 @@
import { useContext } from "react"; import { useContext } from "react";
import { import { ConfirmationDialogContext, ConfirmationDialogContextType } from "../../contexts/ConfirmationDialogContext";
ConfirmationDialogContext,
ConfirmationDialogContextType,
} from "../../contexts/ConfirmationDialogContext";
/** /**
* @description Hook to manage the confirmation dialog, only passes the controls to specyfic dialog component * @description Hook to manage the confirmation dialog, only passes the controls to specyfic dialog component
@ -13,9 +10,7 @@ import {
export const useConfirmationDialog = (): ConfirmationDialogContextType => { export const useConfirmationDialog = (): ConfirmationDialogContextType => {
const context = useContext(ConfirmationDialogContext); const context = useContext(ConfirmationDialogContext);
if (!context) { if (!context) {
throw new Error( throw new Error("useConfirmationDialog must be used within a ConfirmationDialogProvider");
"useConfirmationDialog must be used within a ConfirmationDialogProvider",
);
} }
return context; return context;
}; };

View File

@ -1,9 +1,6 @@
import { CustomRouteObject } from "../configure"; import { CustomRouteObject } from "../configure";
import { Link, useLocation } from "react-router-dom"; import { Link, useLocation } from "react-router-dom";
import { import { clearMultiplePathSlashes, trimPathOfParameters } from "../utils/StringTransformationUtils";
clearMultiplePathSlashes,
trimPathOfParameters,
} from "../utils/StringTransformationUtils";
/** /**
* @returns Navigation tree elements, require to be used like in example below * @returns Navigation tree elements, require to be used like in example below
@ -14,38 +11,26 @@ import {
* </ul> * </ul>
* ``` * ```
*/ */
function NavigationTree(props: { function NavigationTree(props: { routes: CustomRouteObject[] }): React.JSX.Element {
routes: CustomRouteObject[];
}): React.JSX.Element {
const locationHook = useLocation(); // Used to highlight active link in navigation tree const locationHook = useLocation(); // Used to highlight active link in navigation tree
const GenerateNavigationEntries = ( const GenerateNavigationEntries = (routes: CustomRouteObject[], parentPath?: string): React.ReactNode => {
routes: CustomRouteObject[],
parentPath?: string,
): React.ReactNode => {
return ( return (
routes.map((route) => { routes.map((route) => {
// Prepare path for links // Prepare path for links
let combinedPath = undefined; let combinedPath = undefined;
if (parentPath !== undefined && route.path !== undefined) if (parentPath !== undefined && route.path !== undefined)
combinedPath = trimPathOfParameters( combinedPath = trimPathOfParameters(clearMultiplePathSlashes(`/${parentPath}/${route.path}`));
clearMultiplePathSlashes(`/${parentPath}/${route.path}`),
);
else combinedPath = route.path; else combinedPath = route.path;
// Does it have children and enabled? Make entry with `/{parent.path}/{route.path}` // Does it have children and enabled? Make entry with `/{parent.path}/{route.path}`
if (route.children && !route.additionalProps.disableInNavbar) { if (route.children && !route.additionalProps.disableInNavbar) {
return ( return (
<ul key={route.path}> <ul key={route.path}>
<li key={route.path}> <li key={route.path}>
<Link <Link to={combinedPath || "/"} className={locationHook.pathname === combinedPath ? "active" : ""}>
to={combinedPath || "/"}
className={locationHook.pathname === combinedPath ? "active" : ""}
>
{route.additionalProps.name} {route.additionalProps.name}
</Link> </Link>
{route.children ? ( {route.children ? <ul>{GenerateNavigationEntries(route.children, combinedPath)}</ul> : null}
<ul>{GenerateNavigationEntries(route.children, combinedPath)}</ul>
) : null}
</li> </li>
</ul> </ul>
); );
@ -60,10 +45,7 @@ function NavigationTree(props: {
else { else {
return ( return (
<li key={route.path}> <li key={route.path}>
<Link <Link to={combinedPath || "/"} className={locationHook.pathname === combinedPath ? "active" : ""}>
to={combinedPath || "/"}
className={locationHook.pathname === combinedPath ? "active" : ""}
>
{route.additionalProps.name} {route.additionalProps.name}
</Link> </Link>
</li> </li>

View File

@ -13,7 +13,5 @@ export type ConfirmationDialogContextType = {
setCustomModalStyles: React.Dispatch<React.SetStateAction<string>>; setCustomModalStyles: React.Dispatch<React.SetStateAction<string>>;
}; };
// Create the context with default values // Create the context with default values
export const ConfirmationDialogContext = createContext< export const ConfirmationDialogContext = createContext<ConfirmationDialogContextType | undefined>(undefined);
ConfirmationDialogContextType | undefined
>(undefined);
ConfirmationDialogContext.displayName = "ConfirmationDialog"; ConfirmationDialogContext.displayName = "ConfirmationDialog";

View File

@ -47,10 +47,7 @@ function App() {
<div className="navbar bg-neutral text-neutral-content w-auto"> <div className="navbar bg-neutral text-neutral-content w-auto">
{/* Left side navbar */} {/* Left side navbar */}
<div className="flex-1"> <div className="flex-1">
<label <label htmlFor="my-drawer" className="btn btn-circle btn-neutral drawer-button">
htmlFor="my-drawer"
className="btn btn-circle btn-neutral drawer-button"
>
<HamburgerMenuIcon className="w-6 h-6" /> <HamburgerMenuIcon className="w-6 h-6" />
</label> </label>
<p className="text-lg font-bold ml-8">{main.program_name}</p> <p className="text-lg font-bold ml-8">{main.program_name}</p>

View File

@ -7,9 +7,7 @@ function Debugger() {
return ( return (
<div className="m-auto p-4"> <div className="m-auto p-4">
<details className="collapse bg-base-200 mb-4"> <details className="collapse bg-base-200 mb-4">
<summary className="collapse-title text-xl font-medium"> <summary className="collapse-title text-xl font-medium">Flat Routes</summary>
Flat Routes
</summary>
<code className="collapse-content">{JSON.stringify(flatRoutes)}</code> <code className="collapse-content">{JSON.stringify(flatRoutes)}</code>
</details> </details>
<details className="collapse bg-base-200 mb-4"> <details className="collapse bg-base-200 mb-4">

View File

@ -2,7 +2,7 @@ import { useCallback, useEffect, useState } from "react";
import Select from "../../components/Select"; import Select from "../../components/Select";
import Slider from "../../components/Slider"; import Slider from "../../components/Slider";
import useLocalStorage from "../../components/useLocalStorage"; import useLocalStorage from "../../components/useLocalStorage";
import { Tool, toolsDatabase } from "../../toolsDatabase"; import { Tool, ToolParams, toolsDatabase } from "../../toolsDatabase";
import { v4 as uuid4 } from "uuid"; import { v4 as uuid4 } from "uuid";
const frezowaniaOpcje = { const frezowaniaOpcje = {
@ -64,7 +64,7 @@ const HomePage = () => {
tolerancja: 0, tolerancja: 0,
chropowatosc: 0, chropowatosc: 0,
}); });
const [result, setResult] = useLocalStorage<Tool[] | null>("results", []); // Znalazione narzędzie const [result, setResult] = useLocalStorage<ToolParams[] | null>("results", []); // Znalazione narzędzie
// const [result, setResult] = useState<Tool | null>(null); // Znalazione narzędzie // const [result, setResult] = useState<Tool | null>(null); // Znalazione narzędzie
const [calculating, setCalculating] = useState(false); const [calculating, setCalculating] = useState(false);
const [notFound, setNotFound] = useState(false); const [notFound, setNotFound] = useState(false);
@ -88,7 +88,10 @@ const HomePage = () => {
(input: IInput): void => { (input: IInput): void => {
console.debug("checking...", input); console.debug("checking...", input);
const foundTool: Tool[] | undefined = toolsDatabase.tools.filter((tool) => matchesInput(tool, input)); const foundTool: ToolParams[] | undefined = toolsDatabase.tools
.filter((tool) => matchesInput(tool, input)) // filter tools that match input
.filter((tool) => tool.params) // filter tools that have params
.map((tool) => tool.params); // extract params from tools
if (foundTool && typeof foundTool !== "undefined" && foundTool.length > 0) { if (foundTool && typeof foundTool !== "undefined" && foundTool.length > 0) {
console.debug("found", foundTool); console.debug("found", foundTool);
@ -206,7 +209,7 @@ const HomePage = () => {
{result.map((tool) => { {result.map((tool) => {
return ( return (
<div key={uuid4()}> <div key={uuid4()}>
<h2 className="text-2xl mb-1">{tool.name}</h2> <h2 className="text-2xl mb-1">{tool.params.name}</h2>
<table className="table"> <table className="table">
<thead> <thead>
<tr> <tr>
@ -215,7 +218,8 @@ const HomePage = () => {
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{Object.entries(tool).map(([key, value]) => { {Object.entries(tool.params).map(([key, value]) => {
console.log(tool.params);
return ( return (
<tr> <tr>
<td className="border px-4 py-2">{key}</td> <td className="border px-4 py-2">{key}</td>

View File

@ -11,9 +11,7 @@ import Redirect from "./utils/Redirect.tsx";
/** /**
* This function is used to convert `CustomRouteObject` to `RouteObject` and process all additionalProps * This function is used to convert `CustomRouteObject` to `RouteObject` and process all additionalProps
*/ */
const createRoutingFromCustomRouteObject = ( const createRoutingFromCustomRouteObject = (routes: CustomRouteObject[]): RouteObject[] => {
routes: CustomRouteObject[],
): RouteObject[] => {
const navigationRoutes: RouteObject[] = []; //Root routes that will be used for navigation const navigationRoutes: RouteObject[] = []; //Root routes that will be used for navigation
routes.forEach((route) => { routes.forEach((route) => {
// Extract everything except additionalProps and children // Extract everything except additionalProps and children

View File

@ -1,7 +1,14 @@
export interface Tool { export interface ToolParams {
name: string; name: string;
plate: string; plate: string;
ilosc_zebow: number; predkoscObrotowaWrzeciona: number;
predkoscSkrawania: number;
predkoscPosuwu: number;
posuwNaOstrze: number;
posuwNaObrot: number;
wydajnoscObjetosciowa: number;
}
export interface Tool {
rodzajFrezowania: number; rodzajFrezowania: number;
rodzajObrobki: number; rodzajObrobki: number;
material: number; material: number;
@ -9,12 +16,7 @@ export interface Tool {
tolerancja: number; tolerancja: number;
szerokoscSkrawania: number; szerokoscSkrawania: number;
glebokoscSkrawania: number; glebokoscSkrawania: number;
predkoscObrotowaWrzeciona: number; params: ToolParams;
predkoscSkrawania: number;
predkoscPosuwu: number;
posuwNaOstrze: number;
posuwNaObrot: number;
wydajnoscObjetosciowa: number;
} }
interface Database { interface Database {
name: string; name: string;
@ -34,15 +36,16 @@ export const toolsDatabase: Database = {
tolerancja: 3, tolerancja: 3,
glebokoscSkrawania: 5, glebokoscSkrawania: 5,
szerokoscSkrawania: 20, szerokoscSkrawania: 20,
name: "Coromill 390 R390-20T10-11M", params: {
plate: "R390-11 T3 08M-MM 1040", name: "Coromill 390 R390-20T10-11M",
ilosc_zebow: 3, plate: "R390-11 T3 08M-MM 1040",
predkoscObrotowaWrzeciona: 2680, predkoscObrotowaWrzeciona: 2680,
predkoscSkrawania: 168, predkoscSkrawania: 168,
predkoscPosuwu: 1090, predkoscPosuwu: 1090,
posuwNaOstrze: 0.136, posuwNaOstrze: 0.136,
posuwNaObrot: 0.407, posuwNaObrot: 0.407,
wydajnoscObjetosciowa: 64.8, wydajnoscObjetosciowa: 64.8,
},
}, },
{ {
rodzajFrezowania: 1, rodzajFrezowania: 1,
@ -52,15 +55,16 @@ export const toolsDatabase: Database = {
tolerancja: 3, tolerancja: 3,
glebokoscSkrawania: 5, glebokoscSkrawania: 5,
szerokoscSkrawania: 20, szerokoscSkrawania: 20,
name: "Coromill DUPA", params: {
plate: "DUPA", name: "Coromill DUPA",
ilosc_zebow: 4, plate: "DUPA",
predkoscObrotowaWrzeciona: 9999, predkoscObrotowaWrzeciona: 9999,
predkoscSkrawania: 999, predkoscSkrawania: 999,
predkoscPosuwu: 9999, predkoscPosuwu: 9999,
posuwNaOstrze: 0.999, posuwNaOstrze: 0.999,
posuwNaObrot: 0.999, posuwNaObrot: 0.999,
wydajnoscObjetosciowa: 99.9, wydajnoscObjetosciowa: 99.9,
},
}, },
{ {
rodzajFrezowania: 0, rodzajFrezowania: 0,
@ -70,15 +74,16 @@ export const toolsDatabase: Database = {
tolerancja: 2, tolerancja: 2,
glebokoscSkrawania: 5, glebokoscSkrawania: 5,
szerokoscSkrawania: 44.5, szerokoscSkrawania: 44.5,
name: "CoroMill 245 R245-032A32-12M", params: {
plate: "R245-12 T3 E1 6190", name: "CoroMill 245 R245-032A32-12M",
ilosc_zebow: 3, plate: "R245-12 T3 E1 6190",
predkoscObrotowaWrzeciona: 13800, predkoscObrotowaWrzeciona: 13800,
predkoscSkrawania: 1520, predkoscSkrawania: 1520,
predkoscPosuwu: 4420, predkoscPosuwu: 4420,
posuwNaOstrze: 0.107, posuwNaOstrze: 0.107,
posuwNaObrot: 0.32, posuwNaObrot: 0.32,
wydajnoscObjetosciowa: 55.3, wydajnoscObjetosciowa: 55.3,
},
}, },
{ {
rodzajFrezowania: 0, rodzajFrezowania: 0,
@ -88,15 +93,16 @@ export const toolsDatabase: Database = {
tolerancja: 5, tolerancja: 5,
glebokoscSkrawania: 5, glebokoscSkrawania: 5,
szerokoscSkrawania: 44.5, szerokoscSkrawania: 44.5,
name: "CoroMill 245 R245-032A32-12M", params: {
plate: "R245-12 T3 E1 6190", name: "CoroMill 245 R245-032A32-12M",
ilosc_zebow: 3, plate: "R245-12 T3 E1 6190",
predkoscObrotowaWrzeciona: 11200, predkoscObrotowaWrzeciona: 11200,
predkoscSkrawania: 1510, predkoscSkrawania: 1510,
predkoscPosuwu: 9220, predkoscPosuwu: 9220,
posuwNaOstrze: 0.275, posuwNaOstrze: 0.275,
posuwNaObrot: 0.823, posuwNaObrot: 0.823,
wydajnoscObjetosciowa: 461, wydajnoscObjetosciowa: 461,
},
}, },
{ {
rodzajFrezowania: 2, rodzajFrezowania: 2,
@ -106,15 +112,16 @@ export const toolsDatabase: Database = {
tolerancja: 4, tolerancja: 4,
glebokoscSkrawania: 5, glebokoscSkrawania: 5,
szerokoscSkrawania: 40, szerokoscSkrawania: 40,
name: "CoroMill 331 R331.35C-040A16CM060", params: {
plate: "R331.1A-04 35 15H-WL1040", name: "CoroMill 331 R331.35C-040A16CM060",
ilosc_zebow: 3, plate: "R331.1A-04 35 15H-WL1040",
predkoscObrotowaWrzeciona: 1790, predkoscObrotowaWrzeciona: 1790,
predkoscSkrawania: 225, predkoscSkrawania: 225,
predkoscPosuwu: 542, predkoscPosuwu: 542,
posuwNaOstrze: 0.151, posuwNaOstrze: 0.151,
posuwNaObrot: 0.303, posuwNaObrot: 0.303,
wydajnoscObjetosciowa: 7.67, wydajnoscObjetosciowa: 7.67,
},
}, },
{ {
rodzajFrezowania: 1, rodzajFrezowania: 1,
@ -124,15 +131,16 @@ export const toolsDatabase: Database = {
tolerancja: 1, tolerancja: 1,
glebokoscSkrawania: 10, glebokoscSkrawania: 10,
szerokoscSkrawania: 25, szerokoscSkrawania: 25,
name: "CoroMill 790 R790-025A25S2-16L", params: {
plate: "R790-160408PH-PL 1130", name: "CoroMill 790 R790-025A25S2-16L",
ilosc_zebow: 3, plate: "R790-160408PH-PL 1130",
predkoscObrotowaWrzeciona: 4090, predkoscObrotowaWrzeciona: 4090,
predkoscSkrawania: 321, predkoscSkrawania: 321,
predkoscPosuwu: 3270, predkoscPosuwu: 3270,
posuwNaOstrze: 0.4, posuwNaOstrze: 0.4,
posuwNaObrot: 0.799, posuwNaObrot: 0.799,
wydajnoscObjetosciowa: 3.27, wydajnoscObjetosciowa: 3.27,
},
}, },
{ {
rodzajFrezowania: 2, rodzajFrezowania: 2,
@ -142,15 +150,16 @@ export const toolsDatabase: Database = {
tolerancja: 2, tolerancja: 2,
glebokoscSkrawania: 10, glebokoscSkrawania: 10,
szerokoscSkrawania: 50, szerokoscSkrawania: 50,
name: "CoroMill 331 R331.35C-051M25EMA06", params: {
plate: "L331.1A-05 45 15H-WL1130", name: "CoroMill 331 R331.35C-051M25EMA06",
ilosc_zebow: 3, plate: "L331.1A-05 45 15H-WL1130",
predkoscObrotowaWrzeciona: 1950, predkoscObrotowaWrzeciona: 1950,
predkoscSkrawania: 311, predkoscSkrawania: 311,
predkoscPosuwu: 736, predkoscPosuwu: 736,
posuwNaOstrze: 0.126, posuwNaOstrze: 0.126,
posuwNaObrot: 0.377, posuwNaObrot: 0.377,
wydajnoscObjetosciowa: 47.6, wydajnoscObjetosciowa: 47.6,
},
}, },
], ],
}; };

View File

@ -1,6 +1,4 @@
export const rollThroughObj = ( export const rollThroughObj = (obj: Readonly<Partial<{ state: string; id: string }>>) => {
obj: Readonly<Partial<{ state: string; id: string }>>,
) => {
let result = ""; let result = "";
for (const [key, value] of Object.entries(obj)) { for (const [key, value] of Object.entries(obj)) {
result += ` -${key}: ${value}`; result += ` -${key}: ${value}`;

View File

@ -1,12 +1,5 @@
import { import { CustomRouteObject, RouteObjectAdditionalProps, flatRoutes } from "../configure";
CustomRouteObject, import { clearMultiplePathSlashes, trimPathOfParameters } from "./StringTransformationUtils";
RouteObjectAdditionalProps,
flatRoutes,
} from "../configure";
import {
clearMultiplePathSlashes,
trimPathOfParameters,
} from "./StringTransformationUtils";
interface FlatternRoutingTableElement extends RouteObjectAdditionalProps { interface FlatternRoutingTableElement extends RouteObjectAdditionalProps {
path: string; path: string;
@ -42,9 +35,7 @@ export const flatternRoutingTable = (
!route.additionalProps.disableInNavbar !route.additionalProps.disableInNavbar
) { ) {
result.push({ result.push({
path: trimPathOfParameters( path: trimPathOfParameters(clearMultiplePathSlashes(`/${previousPath}/${route.path}`)),
clearMultiplePathSlashes(`/${previousPath}/${route.path}`),
),
name: route.additionalProps.name, name: route.additionalProps.name,
disableBreadcrumbBar: route.additionalProps.disableBreadcrumbBar, disableBreadcrumbBar: route.additionalProps.disableBreadcrumbBar,
disableInNavbar: route.additionalProps.disableInNavbar, disableInNavbar: route.additionalProps.disableInNavbar,
@ -58,17 +49,14 @@ export const flatternRoutingTable = (
result.push(...flatternRoutingTable(route.children, route.path)); result.push(...flatternRoutingTable(route.children, route.path));
} }
// Errors handling // Errors handling
if (typeof route.path === "undefined") if (typeof route.path === "undefined") console.error(`Route ${route.additionalProps.name} is missing path`);
console.error(`Route ${route.additionalProps.name} is missing path`);
}); });
return result; return result;
}; };
/** /**
* @description Function to find element in flattern routes array by LAST path ex: /admin/MAINTENANCE * @description Function to find element in flattern routes array by LAST path ex: /admin/MAINTENANCE
*/ */
export const findElementInFlatRoutes = ( export const findElementInFlatRoutes = (path: string): FlatternRoutingTableElement | undefined => {
path: string,
): FlatternRoutingTableElement | undefined => {
// Split path string into array, split by '/', then get the last element // Split path string into array, split by '/', then get the last element
const _route = flatRoutes.find((route) => { const _route = flatRoutes.find((route) => {
const pathArray = route.path.split("/"); const pathArray = route.path.split("/");