108 lines
3.9 KiB
TypeScript
108 lines
3.9 KiB
TypeScript
import { LstCard } from "@/components/extendedUI/LstCard";
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from "@/components/ui/table";
|
|
import { useSessionStore } from "@/lib/store/sessionStore";
|
|
import { useModuleStore } from "@/lib/store/useModuleStore";
|
|
import { useQuery } from "@tanstack/react-query";
|
|
import { useRouter } from "@tanstack/react-router";
|
|
import { ChangeSetting } from "./SettingForm";
|
|
import { getSettings } from "@/utils/querys/settings";
|
|
import { Skeleton } from "@/components/ui/skeleton";
|
|
|
|
export type Settings = {
|
|
settings_id?: string;
|
|
name?: string;
|
|
value?: string;
|
|
description?: string;
|
|
};
|
|
|
|
export default function SettingsPage() {
|
|
const { user, token } = useSessionStore();
|
|
const { modules } = useModuleStore();
|
|
const router = useRouter();
|
|
|
|
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: "/" });
|
|
}
|
|
|
|
const { data, isError, error, isLoading } = useQuery(
|
|
getSettings(token ?? "")
|
|
);
|
|
|
|
// if (isLoading) {
|
|
// return <div>Loading.....</div>;
|
|
// }
|
|
if (isError) {
|
|
return <div>{JSON.stringify(error)}</div>;
|
|
}
|
|
|
|
return (
|
|
<LstCard className="m-2 flex place-content-center w-fit">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Name</TableHead>
|
|
<TableHead>Value</TableHead>
|
|
<TableHead>Description</TableHead>
|
|
<TableHead>Change</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((setting: Settings) => (
|
|
<TableRow key={setting.settings_id}>
|
|
<TableCell className="font-medium">
|
|
{setting.name}
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
{setting.value}
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
{setting.description}
|
|
</TableCell>
|
|
<TableCell className="font-medium">
|
|
<ChangeSetting setting={setting} />
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
)}
|
|
</Table>
|
|
</LstCard>
|
|
);
|
|
}
|