diff --git a/src/components/common/Loki/LokiPanel.js b/src/components/common/Loki/LokiPanel.js index 2c40e84d6713d36570dd67c237059dfaaf590b2d..c8af92fb04a89fb4370d3b3c3ab745ad11c412d9 100644 --- a/src/components/common/Loki/LokiPanel.js +++ b/src/components/common/Loki/LokiPanel.js @@ -6,14 +6,9 @@ import { TimeRange } from "../Inputs/TimeRange"; import { PopoutButton } from "../Buttons/PopoutButton"; import { useCustomSnackbar } from "../snackbar/Snackbar"; import { closeSnackbar } from "notistack"; -import { apiContext } from "../../../api/DeployApi"; -import { - useAPIMethod, - usePolling, - formatDateAndTime -} from "@ess-ics/ce-ui-common"; +import { formatDateAndTime } from "@ess-ics/ce-ui-common"; import Convert from "ansi-to-html"; -import { getErrorMessage, isAbortError } from "../Helper"; +import { isAbortError } from "../Helper"; const TIME_RANGE_VALUES = [ { @@ -35,17 +30,6 @@ const TIME_RANGE_VALUES = [ const LOG_POLL_INTERVAL = 5000; export function LokiPanel({ hostName, iocName, isSyslog }) { const showWarning = useCustomSnackbar(); - const client = useContext(apiContext); - - const handleError = useCallback( - (error) => { - if (error && !isAbortError(error)) { - showWarning(getErrorMessage(error)); - } - }, - [showWarning] - ); - const [timeRange, setTimeRange] = useState(720); const [logDialogOpen, setLogDialogOpen] = useState(false); const [periodChange, setPeriodChange] = useState(false); @@ -114,46 +98,23 @@ export function LokiPanel({ hostName, iocName, isSyslog }) { const params = useMemo( () => ({ - host_name: hostName, - ioc_name: iocName, - time_range: timeRange + hostName: hostName, + iocName: iocName, + timeRange: timeRange }), [hostName, iocName, timeRange] ); - const { - value: sysLogData, - wrapper: getSysLogData, - loading: sysLoading, - error: sysLogError, - abort: getSysLogDataAbort - } = useAPIMethod({ - fcn: client.apis.Hosts.fetchSyslogLines, - call: false, - params - }); + const [getSysLogData, { data: sysLogData, error: sysLogError }] = + useLazyFetchSyslogLinesQuery({ pollingInterval: LOG_POLL_INTERVAL }); - const { - value: procServLog, - wrapper: getProcServLog, - loading: procServLoading, - error: procServLogError, - abort: getProcServLogAbort - } = useAPIMethod({ - fcn: client.apis.IOCs.fetchProcServLogLines, - call: false, - params - }); + const [getProcServLog, { data: procServLog, error: procServLogError }] = + useLazyFetchProcServLogLinesQuery({ pollingInterval: LOG_POLL_INTERVAL }); - // show sysLogErrors on snackBar - useEffect(() => { - handleError(sysLogError); - }, [sysLogError, handleError]); - - // show procServErrors on snackBar - useEffect(() => { - handleError(procServLogError); - }, [procServLogError, handleError]); + const hasLogError = !!sysLogError || !!procServLogError; + const hasLogData = !!sysLogData || !!procServLog; + const hasAbortError = + isAbortError(sysLogError) || isAbortError(procServLogError); const handleTimeRangeChange = (event) => { setPeriodChange(true); @@ -174,26 +135,13 @@ export function LokiPanel({ hostName, iocName, isSyslog }) { }; }, [alertIds]); - const updateLogs = useCallback(() => { + useEffect(() => { if (isSyslog === true) { - getSysLogData(hostName, timeRange); + getSysLogData(params); } else { - getProcServLog(hostName, iocName, timeRange); + getProcServLog(params); } - }, [getSysLogData, getProcServLog, hostName, iocName, isSyslog, timeRange]); - - const hasLogError = !!sysLogError || !!procServLogError; - const hasLogData = !!sysLogData || !!procServLog; - const hasAbortError = - isAbortError(sysLogError) || isAbortError(procServLogError); - const logError = sysLogError || procServLogError; - - usePolling( - updateLogs, - sysLoading || procServLoading || hasLogError, - LOG_POLL_INTERVAL, - isSyslog ? getSysLogDataAbort : getProcServLogAbort - ); + }, [getSysLogData, getProcServLog, isSyslog, params]); useEffect(() => { setHtml( @@ -223,7 +171,7 @@ export function LokiPanel({ hostName, iocName, isSyslog }) { }; if (hasLogError && !hasAbortError) { - return <Alert severity="error">{getErrorMessage(logError)}</Alert>; + return <ApiAlertError error={sysLogError || procServLogError} />; } if (!hasLogData && !hasLogError) { diff --git a/src/components/deployments/DeploymentJobOutput.js b/src/components/deployments/DeploymentJobOutput.js index 597f068c15ddfbfbe40a387d2debcf90ddd86483..73a96120b60dbdeddbb6003e3374ee6de83dbb6f 100644 --- a/src/components/deployments/DeploymentJobOutput.js +++ b/src/components/deployments/DeploymentJobOutput.js @@ -13,7 +13,6 @@ import { LogStreamConsoleDialog } from "../common/LogStream/LogStreamConsoleDial import { PopoutButton } from "../common/Buttons/PopoutButton"; import { Alert, LinearProgress, Stack } from "@mui/material"; import { getErrorMessage, isAbortError } from "../common/Helper"; -import useCustomSnackbar from "../common/snackbar"; const LOG_POLL_INTERVAL = 5000; @@ -27,7 +26,6 @@ export function DeploymentJobOutput({ job }) { }), [job] ); - const showWarning = useCustomSnackbar(); const { value: log, @@ -58,12 +56,6 @@ export function DeploymentJobOutput({ job }) { abortGetLogById ); - useEffect(() => { - if (logError && !hasAbortError) { - showWarning(getErrorMessage(logError)); - } - }, [logError, showWarning]); - useEffect(() => { finalResultsNeeded.current = true; }, [job.jobId]);