| 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 |
}; |