feat(servers): added a link to the server by clicking on the name and the gp code

frontend/src/routes/_app/_adminLayout/admin/servers.tsx

@@ -37,6 +37,7 @@ type ServerData = {
 	pendingUpdateFile: string;
 	lastUpdate: Date;
 	memoryUsage: string;
+	greatPlainsPlantCode: string;
 };
 
 const updateServerItem = async (
@@ -66,6 +67,10 @@ function RouteComponent() {
 	);
 	const [sorting, setSorting] = useState<SortingState>([]);
 	const columnHelper = createColumnHelper<ServerData>();
+	const [pagination, setPagination] = useState({
+		pageIndex: 0, //initial page index
+		pageSize: 20, //default page size
+	});
 
 	const statsMap = React.useMemo(() => {
 		const map = new Map<string, any>();
@@ -93,7 +98,20 @@ function RouteComponent() {
 
 	const columns = [
 		columnHelper.accessor("name", {
-			cell: (i) => i.getValue(),
+			cell: ({ row, getValue }) => {
+				let url = "";
+				if (row.original.plantToken.includes("test")) {
+					url = `https://${row.original.serverDNS}.alpla.net/lst/app`;
+				} else {
+					url = `https://${row.original.plantToken}prod.alpla.net/lst/app`;
+				}
+
+				return (
+					<a href={url} target="_blank">
+						{getValue()}
+					</a>
+				);
+			},
 			header: ({ column }) => {
 				return (
 					<Button
@@ -204,6 +222,41 @@ function RouteComponent() {
 			},
 		}),
 
+		columnHelper.accessor("greatPlainsPlantCode", {
+			header: () => {
+				return <span className="flex flex-row gap-2">GP Code</span>;
+			},
+			cell: ({ row, getValue }) => {
+				const initialValue = String(getValue() ?? "");
+				const [localValue, setLocalValue] = React.useState(initialValue);
+				const token = row.original.plantToken;
+				const field = "greatPlainsPlantCode";
+
+				useEffect(() => setLocalValue(initialValue), [initialValue]);
+
+				const handleSubmit = (newValue: string) => {
+					if (newValue !== initialValue) {
+						setLocalValue(newValue); // keep new value locally immediately
+						updateServer.mutate({ token, field, value: newValue });
+					}
+				};
+				return (
+					<Input
+						value={localValue}
+						onChange={(e) => setLocalValue(e.currentTarget.value)}
+						onBlur={(e) => handleSubmit(e.currentTarget.value.trim())}
+						onKeyDown={(e) => {
+							if (e.key === "Enter") {
+								e.preventDefault();
+								handleSubmit(e.currentTarget.value.trim());
+								e.currentTarget.blur(); // exit edit mode
+							}
+						}}
+					/>
+				);
+			},
+		}),
+
 		columnHelper.accessor("uptime", {
 			header: () => {
 				return <span className="flex flex-row gap-2">UpTime</span>;
@@ -215,8 +268,12 @@ function RouteComponent() {
 					// use Skeleton from shadcn/ui (or any placeholder)
 					return <Skeleton className="h-4 w-16" />;
 				}
-				console.log(statsMap);
-				return <span>{statsRow ? `${statsRow.uptime.toFixed(2)}` : "--"}</span>;
+				//console.log(statsMap);
+				return (
+					<span>
+						{statsRow ? `${statsRow.uptime.toFixed(2)}` : "Server Offline?"}
+					</span>
+				);
 			},
 		}),
 		columnHelper.accessor("lastUpdate", {
@@ -230,8 +287,10 @@ function RouteComponent() {
 					// use Skeleton from shadcn/ui (or any placeholder)
 					return <Skeleton className="h-4 w-16" />;
 				}
-				console.log(statsMap);
-				return <span>{statsRow ? `${statsRow.lastUpdate}` : "--"}</span>;
+				//console.log(statsMap);
+				return (
+					<span>{statsRow ? `${statsRow.lastUpdate}` : "Server Offline?"}</span>
+				);
 			},
 		}),
 		columnHelper.accessor("build", {
@@ -245,8 +304,10 @@ function RouteComponent() {
 					// use Skeleton from shadcn/ui (or any placeholder)
 					return <Skeleton className="h-4 w-16" />;
 				}
-				console.log(statsMap);
-				return <span>{statsRow ? `${statsRow.build}` : "--"}</span>;
+				//console.log(statsMap);
+				return (
+					<span>{statsRow ? `${statsRow.build}` : "Server Offline?"}</span>
+				);
 			},
 		}),
 		columnHelper.accessor("pendingUpdateFile", {
@@ -260,8 +321,14 @@ function RouteComponent() {
 					// use Skeleton from shadcn/ui (or any placeholder)
 					return <Skeleton className="h-4 w-16" />;
 				}
-				console.log(statsMap);
-				return <span>{statsRow ? `${statsRow.pendingUpdateFile}` : "--"}</span>;
+				//console.log(statsMap);
+				return (
+					<span>
+						{statsRow
+							? `${statsRow.pendingUpdateFile === null ? "nothing pending" : statsRow.pendingUpdateFile}`
+							: "Server Offline?"}
+					</span>
+				);
 			},
 		}),
 		columnHelper.accessor("memoryUsage", {
@@ -276,7 +343,11 @@ function RouteComponent() {
 					return <Skeleton className="h-4 w-16" />;
 				}
 				//console.log(statsMap);
-				return <span>{statsRow ? `${statsRow.memoryUsage}` : "--"}</span>;
+				return (
+					<span>
+						{statsRow ? `${statsRow.memoryUsage}` : "Server Offline?"}
+					</span>
+				);
 			},
 		}),
 	];
@@ -288,10 +359,12 @@ function RouteComponent() {
 		getPaginationRowModel: getPaginationRowModel(),
 		onSortingChange: setSorting,
 		getSortedRowModel: getSortedRowModel(),
+		onPaginationChange: setPagination,
 		//renderSubComponent: ({ row }: { row: any }) => <ExpandedRow row={row} />,
 		//getRowCanExpand: () => true,
 		state: {
 			sorting,
+			pagination,
 		},
 	});