diff --git a/src/frontend/app/api/check_status/route.ts b/src/frontend/app/api/check_status/route.ts index 81e716a..1815659 100644 --- a/src/frontend/app/api/check_status/route.ts +++ b/src/frontend/app/api/check_status/route.ts @@ -1,6 +1,18 @@ import { NextResponse } from 'next/server'; +import { execSync } from 'child_process'; import { auth } from "@/auth" +const executeCommand = (command: string) => { + try { + const output = execSync(command, { encoding: 'utf-8' }); + console.log(output); + return output.trim(); // Return the trimmed output + } catch (error) { + console.error(error); + throw new Error((error as Error).message); + } +}; + function getConnectorStatusUrl(connectorName: string | null) { if (process.env.RUNNING_ENV == "local") { return "http://" + connectorName + ":19191/connector-api/status"; @@ -12,6 +24,11 @@ function getConnectorStatusUrl(connectorName: string | null) { async function checkConnectorStatus(connectorName: string | null): Promise { const url = getConnectorStatusUrl(connectorName); try { + let containerID; + containerID = executeCommand("docker container ls -f 'status=paused' | grep 'src-" + connectorName + "-1' | awk '{print $1}'"); + if (containerID) { // Checks if connector is paused, otherwise fetch will hang + return false; + } console.log("Trying to fetch connector status from URL " + url); var result = await fetch(url, {cache: "no-store"}); var data = await result.json(); diff --git a/src/frontend/app/dashboard/change_status.tsx b/src/frontend/app/dashboard/change_status.tsx index 3ec9ad6..63d0717 100644 --- a/src/frontend/app/dashboard/change_status.tsx +++ b/src/frontend/app/dashboard/change_status.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from 'react'; -import { PauseCircleIcon, PlayCircleIcon } from '@heroicons/react/24/outline'; +import { PauseCircleIcon, PlayCircleIcon, ExclamationCircleIcon } from '@heroicons/react/24/outline'; +import { isConnectorRunning } from '@/actions/api'; interface ConnectorStatusProps { connectorName: string | undefined; @@ -7,7 +8,7 @@ interface ConnectorStatusProps { export default function ChangeStatusButton({ connectorName }: ConnectorStatusProps) { const [buttonText, setButtonText] = useState('Checking status...'); - const [iconName, setIconName] = useState('PauseCircleIcon'); + const [iconName, setIconName] = useState('ExclamationCircleIcon'); const [buttonColor, setButtonColor] = useState('bg-green-500'); const iconMapping: { [key: string]: React.ElementType } = { @@ -19,9 +20,8 @@ export default function ChangeStatusButton({ connectorName }: ConnectorStatusPro if (!connectorName) return; try { - const response = await fetch(`/api/check_status?connector=${connectorName}`); - const data = await response.json(); - if (data.status === 'running') { + const connectorRunningResponse = await isConnectorRunning(connectorName || ""); + if (connectorRunningResponse) { await fetch('/api/pauseConnector'); setButtonText("Start the connector"); setIconName("PlayCircleIcon"); @@ -34,6 +34,8 @@ export default function ChangeStatusButton({ connectorName }: ConnectorStatusPro } } catch (error) { setButtonText('Error checking status'); + setIconName("ExclamationCircleIcon"); + setButtonColor('bg-red-500'); } }; @@ -42,9 +44,8 @@ export default function ChangeStatusButton({ connectorName }: ConnectorStatusPro if (!connectorName) return; try { - const response = await fetch(`/api/check_status?connector=${connectorName}`); - const data = await response.json(); - if (data.status === 'running') { + const connectorRunningResponse = await isConnectorRunning(connectorName || ""); + if (connectorRunningResponse) { setButtonText("Pause the connector"); setIconName("PauseCircleIcon"); setButtonColor('bg-red-500'); @@ -55,13 +56,15 @@ export default function ChangeStatusButton({ connectorName }: ConnectorStatusPro } } catch (error) { setButtonText('Error checking status'); + setIconName("ExclamationCircleIcon"); + setButtonColor('bg-red-500'); } }; fetchInitialStatus(); }, [connectorName]); - const IconComponent = iconMapping[iconName] || PauseCircleIcon; + const IconComponent = iconMapping[iconName] || ExclamationCircleIcon; return (