Merge pull request #1000 from faytranevozter/feat/simplify-node-logs

Feat: simplify node service log & add badge color on list service/container
This commit is contained in:
Mauricio Siu
2024-12-26 22:23:43 -06:00
committed by GitHub
5 changed files with 48 additions and 9 deletions

View File

@@ -1,3 +1,4 @@
import { Badge } from "@/components/ui/badge";
import {
Card,
CardContent,
@@ -30,6 +31,21 @@ export const DockerLogs = dynamic(
},
);
export const badgeStateColor = (state: string) => {
switch (state) {
case "running":
return "green";
case "exited":
case "shutdown":
return "red";
case "accepted":
case "created":
return "blue";
default:
return "default";
}
};
interface Props {
appName: string;
serverId?: string;
@@ -123,7 +139,9 @@ export const ShowDockerLogs = ({ appName, serverId }: Props) => {
value={container.containerId}
>
{container.name} ({container.containerId}){" "}
{container.state}
<Badge variant={badgeStateColor(container.state)}>
{container.state}
</Badge>
</SelectItem>
))}
</div>
@@ -135,7 +153,10 @@ export const ShowDockerLogs = ({ appName, serverId }: Props) => {
value={container.containerId}
>
{container.name} ({container.containerId}@{container.node}
) {container.state}
)
<Badge variant={badgeStateColor(container.state)}>
{container.state}
</Badge>
</SelectItem>
))}
</>

View File

@@ -1,3 +1,5 @@
import { badgeStateColor } from "@/components/dashboard/application/logs/show";
import { Badge } from "@/components/ui/badge";
import {
Card,
CardContent,
@@ -35,6 +37,8 @@ interface Props {
serverId?: string;
}
badgeStateColor;
export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
const [option, setOption] = useState<"swarm" | "native">("native");
const [containerId, setContainerId] = useState<string | undefined>();
@@ -123,7 +127,9 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
value={container.containerId}
>
{container.name} ({container.containerId}){" "}
{container.state}
<Badge variant={badgeStateColor(container.state)}>
{container.state}
</Badge>
</SelectItem>
))}
</div>
@@ -135,7 +141,10 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
value={container.containerId}
>
{container.name} ({container.containerId}@{container.node}
) {container.state}
)
<Badge variant={badgeStateColor(container.state)}>
{container.state}
</Badge>
</SelectItem>
))}
</>

View File

@@ -1,3 +1,5 @@
import { badgeStateColor } from "@/components/dashboard/application/logs/show";
import { Badge } from "@/components/ui/badge";
import {
Card,
CardContent,
@@ -87,7 +89,10 @@ export const ShowDockerLogsCompose = ({
key={container.containerId}
value={container.containerId}
>
{container.name} ({container.containerId}) {container.state}
{container.name} ({container.containerId}){" "}
<Badge variant={badgeStateColor(container.state)}>
{container.state}
</Badge>
</SelectItem>
))}
<SelectLabel>Containers ({data?.length})</SelectLabel>

View File

@@ -54,7 +54,9 @@ export const setupDockerContainerLogsWebSocketServer = (
const client = new Client();
client
.once("ready", () => {
const baseCommand = `docker ${runType === "swarm" ? "service" : "container"} logs --timestamps --tail ${tail} ${
const baseCommand = `docker ${runType === "swarm" ? "service" : "container"} logs --timestamps ${
runType === "swarm" ? "--raw" : ""
} --tail ${tail} ${
since === "all" ? "" : `--since ${since}`
} --follow ${containerId}`;
const escapedSearch = search ? search.replace(/'/g, "'\\''") : "";
@@ -98,7 +100,9 @@ export const setupDockerContainerLogsWebSocketServer = (
});
} else {
const shell = getShell();
const baseCommand = `docker ${runType === "swarm" ? "service" : "container"} logs --timestamps --tail ${tail} ${
const baseCommand = `docker ${runType === "swarm" ? "service" : "container"} logs --timestamps ${
runType === "swarm" ? "--raw" : ""
} --tail ${tail} ${
since === "all" ? "" : `--since ${since}`
} --follow ${containerId}`;
const command = search

View File

@@ -196,7 +196,7 @@ export const getStackContainersByAppName = async (
: "No container name";
const state = parts[2]
? parts[2].replace("State: ", "").trim()
? parts[2].replace("State: ", "").trim().toLowerCase()
: "No state";
const node = parts[3]
? parts[3].replace("Node: ", "").trim()
@@ -255,7 +255,7 @@ export const getServiceContainersByAppName = async (
: "No container name";
const state = parts[2]
? parts[2].replace("State: ", "").trim()
? parts[2].replace("State: ", "").trim().toLowerCase()
: "No state";
const node = parts[3]