gitscope
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/nodes/log/container.tsx · v0.4.1
Source
1 1d782e1 Mrdn 2y ago import {
2 9aed282 Mrdn 2y ago Badge,
3 9aed282 Mrdn 2y ago Card,
4 9aed282 Mrdn 2y ago CardContent,
5 9aed282 Mrdn 2y ago CardHeader,
6 9aed282 Mrdn 2y ago ScrollArea,
7 9aed282 Mrdn 2y ago Separator,
8 1d782e1 Mrdn 2y ago } from "@marzneshin/components";
9 1d782e1 Mrdn 2y ago import type { NodeType } from "..";
10 1d782e1 Mrdn 2y ago import { useNodesLog } from "..";
11 7b39faf Mardin 2y ago import { cn } from "@marzneshin/utils";
12 1d782e1 Mrdn 2y ago import type { FC } from "react";
13 1d782e1 Mrdn 2y ago import { useTranslation } from "react-i18next";
14 b15ff05 Mrdn 2y ago
15 b15ff05 Mrdn 2y ago interface LogContainerProps {
16 9aed282 Mrdn 2y ago node: NodeType;
17 b15ff05 Mrdn 2y ago }
18 b15ff05 Mrdn 2y ago
19 b15ff05 Mrdn 2y ago export const LogContainer: FC<LogContainerProps> = ({ node }) => {
20 9aed282 Mrdn 2y ago const { logs, status, logsDiv } = useNodesLog(node);
21 9aed282 Mrdn 2y ago const { t } = useTranslation();
22 1d782e1 Mrdn 2y ago
23 9aed282 Mrdn 2y ago return (
24 9aed282 Mrdn 2y ago <Card className="h-full w-full">
25 9aed282 Mrdn 2y ago <CardContent className="flex flex-col p-2 h-full w-full">
26 9aed282 Mrdn 2y ago <CardHeader className="flex flex-row justify-between items-center p-2">
27 9aed282 Mrdn 2y ago <p className="capitalize font-header">
28 9aed282 Mrdn 2y ago {t("page.nodes.settings.log-container.title")}
29 9aed282 Mrdn 2y ago </p>
30 9aed282 Mrdn 2y ago <div className="flex flex-row gap-2 justify-center items-center">
31 9aed282 Mrdn 2y ago <Badge
32 9aed282 Mrdn 2y ago variant={status === "closed" ? "destructive" : "default"}
33 4b7c475 Mardin 2y ago className={cn("flex justify-center items-center w-full h-6 capitalize hover:text-primary-foreground", { "bg-success text-success-foreground": (status !== "closed") })}
34 9aed282 Mrdn 2y ago >
35 9aed282 Mrdn 2y ago {status}
36 9aed282 Mrdn 2y ago </Badge>
37 9aed282 Mrdn 2y ago </div>
38 9aed282 Mrdn 2y ago </CardHeader>
39 9aed282 Mrdn 2y ago <ScrollArea
40 9aed282 Mrdn 2y ago className="flex p-2 h-full max-h-[calc(100vh-20rem)] rounded-md bg-secondary text-primary w-full overflow-auto"
41 9aed282 Mrdn 2y ago ref={logsDiv}
42 9aed282 Mrdn 2y ago >
43 9aed282 Mrdn 2y ago {logs.map((log: string, index: number) => (
44 9aed282 Mrdn 2y ago <div key={log} className="w-full">
45 9aed282 Mrdn 2y ago <p className="font-mono text-[0.7rem] text-primary my-1 break-all rounded-sm p-[1px] hover:bg-gray-300 dark:hover:bg-gray-900">
46 9aed282 Mrdn 2y ago {log}
47 9aed282 Mrdn 2y ago </p>
48 9aed282 Mrdn 2y ago {index !== logs.length - 1 && (
49 9aed282 Mrdn 2y ago <Separator className="bg-white dark:bg-gray-700" />
50 9aed282 Mrdn 2y ago )}
51 9aed282 Mrdn 2y ago </div>
52 9aed282 Mrdn 2y ago ))}
53 9aed282 Mrdn 2y ago </ScrollArea>
54 9aed282 Mrdn 2y ago </CardContent>
55 9aed282 Mrdn 2y ago </Card>
56 9aed282 Mrdn 2y ago );
57 1d782e1 Mrdn 2y ago };