100 lines
4.2 KiB
TypeScript
100 lines
4.2 KiB
TypeScript
import {LstCard} from "@/components/extendedUI/LstCard";
|
|
|
|
import {Skeleton} from "@/components/ui/skeleton";
|
|
import {Table, TableBody, TableCell, TableHead, TableHeader, TableRow} from "@/components/ui/table";
|
|
import {useSessionStore} from "@/lib/store/sessionStore";
|
|
import {useModuleStore} from "@/lib/store/useModuleStore";
|
|
import {getServers} from "@/utils/querys/servers";
|
|
import {useQuery} from "@tanstack/react-query";
|
|
import {useRouter} from "@tanstack/react-router";
|
|
import {format} from "date-fns";
|
|
import UpdateServer from "./UpdateServer";
|
|
|
|
export type Servers = {
|
|
server_id?: string;
|
|
sName?: string;
|
|
serverDNS?: string;
|
|
plantToken?: string;
|
|
idAddress: string;
|
|
lastUpdated: string;
|
|
isUpgrading: boolean;
|
|
};
|
|
|
|
export default function ServerPage() {
|
|
const {user, token} = useSessionStore();
|
|
const {modules} = useModuleStore();
|
|
const router = useRouter();
|
|
|
|
const {data, isError, error, isLoading} = useQuery(getServers(token ?? ""));
|
|
|
|
const adminModule = modules.filter((n) => n.name === "admin");
|
|
const userLevel = user?.roles?.filter((r) => r.module_id === adminModule[0].module_id) || [];
|
|
|
|
if (!adminModule[0]?.roles?.includes(userLevel[0]?.role)) {
|
|
router.navigate({to: "/"});
|
|
}
|
|
|
|
if (isError) {
|
|
return <div>{JSON.stringify(error)}</div>;
|
|
}
|
|
return (
|
|
<LstCard className="m-2 flex place-content-center w-dvh">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
<TableHead>Server</TableHead>
|
|
<TableHead>PlantToken</TableHead>
|
|
<TableHead>IP Address</TableHead>
|
|
<TableHead>Date Last updated</TableHead>
|
|
<TableHead>Update Server</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
{isLoading ? (
|
|
<>
|
|
<TableBody>
|
|
{Array(10)
|
|
.fill(0)
|
|
.map((_, i) => (
|
|
<TableRow key={i}>
|
|
<TableCell className="font-medium">
|
|
<Skeleton className="h-4" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4" />
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</>
|
|
) : (
|
|
<TableBody>
|
|
{data?.map((server: Servers) => (
|
|
<TableRow key={server.server_id}>
|
|
<TableCell className="font-medium">{server.sName}</TableCell>
|
|
<TableCell className="font-medium">{server.serverDNS}</TableCell>
|
|
<TableCell className="font-medium">{server.plantToken}</TableCell>
|
|
<TableCell className="font-medium">{server.idAddress}</TableCell>
|
|
<TableCell className="font-medium">
|
|
{format(server.lastUpdated, "MM/dd/yyyy hh:mm")}
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
{window.location.host.split(":")[0] === "localhost" && (
|
|
<UpdateServer server={server} token={token as string} />
|
|
)}
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
)}
|
|
</Table>
|
|
</LstCard>
|
|
);
|
|
}
|