fix: remote server search add long buffering

This commit is contained in:
Mauricio Siu
2024-12-15 19:18:41 -06:00
parent 676082fc5b
commit c2fe1eed01
2 changed files with 25 additions and 9 deletions

View File

@@ -59,8 +59,6 @@ export const DockerLogsId: React.FC<Props> = ({ containerId, serverId }) => {
}; };
const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => { const handleSearch = (e: React.ChangeEvent<HTMLInputElement>) => {
setRawLogs("");
setFilteredLogs([]);
setSearch(e.target.value || ""); setSearch(e.target.value || "");
}; };
@@ -81,13 +79,12 @@ export const DockerLogsId: React.FC<Props> = ({ containerId, serverId }) => {
}; };
useEffect(() => { useEffect(() => {
if (!containerId) return;
let isCurrentConnection = true;
setIsLoading(true);
setRawLogs(""); setRawLogs("");
setFilteredLogs([]); setFilteredLogs([]);
}, [containerId]);
useEffect(() => {
if (!containerId) return;
setIsLoading(true);
const protocol = window.location.protocol === "https:" ? "wss:" : "ws:"; const protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
const params = new globalThis.URLSearchParams({ const params = new globalThis.URLSearchParams({
@@ -108,25 +105,33 @@ export const DockerLogsId: React.FC<Props> = ({ containerId, serverId }) => {
const ws = new WebSocket(wsUrl); const ws = new WebSocket(wsUrl);
ws.onopen = () => { ws.onopen = () => {
if (!isCurrentConnection) {
ws.close();
return;
}
console.log("WebSocket connected"); console.log("WebSocket connected");
}; };
ws.onmessage = (e) => { ws.onmessage = (e) => {
if (!isCurrentConnection) return;
setRawLogs((prev) => prev + e.data); setRawLogs((prev) => prev + e.data);
setIsLoading(false); setIsLoading(false);
}; };
ws.onerror = (error) => { ws.onerror = (error) => {
if (!isCurrentConnection) return;
console.error("WebSocket error:", error); console.error("WebSocket error:", error);
setIsLoading(false); setIsLoading(false);
}; };
ws.onclose = (e) => { ws.onclose = (e) => {
if (!isCurrentConnection) return;
console.log("WebSocket closed:", e.reason); console.log("WebSocket closed:", e.reason);
setIsLoading(false); setIsLoading(false);
}; };
return () => { return () => {
isCurrentConnection = false;
if (ws.readyState === WebSocket.OPEN) { if (ws.readyState === WebSocket.OPEN) {
ws.close(); ws.close();
} }

View File

@@ -56,9 +56,11 @@ export const setupDockerContainerLogsWebSocketServer = (
const baseCommand = `docker container logs --timestamps --tail ${tail} ${ const baseCommand = `docker container logs --timestamps --tail ${tail} ${
since === "all" ? "" : `--since ${since}` since === "all" ? "" : `--since ${since}`
} --follow ${containerId}`; } --follow ${containerId}`;
const escapedSearch = search ? search.replace(/'/g, "'\\''") : "";
const command = search const command = search
? `${baseCommand} 2>&1 | grep -iF '${search}'` ? `${baseCommand} 2>&1 | grep --line-buffered -iF "${escapedSearch}"`
: baseCommand; : baseCommand;
console.log("Executing SSH command:", command);
client.exec(command, (err, stream) => { client.exec(command, (err, stream) => {
if (err) { if (err) {
console.error("Execution error:", err); console.error("Execution error:", err);
@@ -66,15 +68,24 @@ export const setupDockerContainerLogsWebSocketServer = (
client.end(); client.end();
return; return;
} }
let dataReceived = false;
stream stream
.on("close", () => { .on("close", () => {
console.log("Stream closed, dataReceived:", dataReceived);
if (!dataReceived) {
ws.send("No matching logs found");
}
client.end(); client.end();
ws.close(); ws.close();
}) })
.on("data", (data: string) => { .on("data", (data: string) => {
dataReceived = true;
ws.send(data.toString()); ws.send(data.toString());
}) })
.stderr.on("data", (data) => { .stderr.on("data", (data) => {
console.error("Stream stderr:", data.toString());
ws.send(data.toString()); ws.send(data.toString());
}); });
}); });
@@ -100,7 +111,7 @@ export const setupDockerContainerLogsWebSocketServer = (
since === "all" ? "" : `--since ${since}` since === "all" ? "" : `--since ${since}`
} --follow ${containerId}`; } --follow ${containerId}`;
const command = search const command = search
? `${baseCommand} 2>&1 | grep -iF '${search}'` ? `${baseCommand} 2>&1 | grep --line-buffered -iF '${search}'`
: baseCommand; : baseCommand;
const ptyProcess = spawn(shell, ["-c", command], { const ptyProcess = spawn(shell, ["-c", command], {
name: "xterm-256color", name: "xterm-256color",