diff --git a/src/frontend/src/components/RadialProgress/index.tsx b/src/frontend/src/components/RadialProgress/index.tsx
index 681162c0e..c900042fa 100644
--- a/src/frontend/src/components/RadialProgress/index.tsx
+++ b/src/frontend/src/components/RadialProgress/index.tsx
@@ -1,28 +1,19 @@
-import { useContext, useEffect, useRef } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
import { RadialProgressType } from "../../types/components";
-import { Progress } from "../ui/progress";
-import { progressContext } from "../../contexts/ProgressContext";
export default function RadialProgressComponent({
value,
color,
}: RadialProgressType) {
- const ref = useRef(0);
- const { progress } = useContext(progressContext);
-
- useEffect(() => {
- ref.current = progress * 100;
- }, [progress]);
-
const style = {
- "--value": ref.current,
+ "--value": value,
"--size": "1.5rem",
"--thickness": "2px",
} as React.CSSProperties;
return (
- {ref.current}%
+ {value * 100}%
);
}
diff --git a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
index f4a670cde..8f7df7ac7 100644
--- a/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
+++ b/src/frontend/src/components/chatComponent/buildTrigger/index.tsx
@@ -9,10 +9,7 @@ import { typesContext } from "../../../contexts/typesContext";
import { alertContext } from "../../../contexts/alertContext";
import { postBuildInit } from "../../../controllers/API";
import ProgressBarComponent from "../../ProgressBarComponent";
-import {
- progressContext,
- useProgress,
-} from "../../../contexts/ProgressContext";
+
import RadialProgressComponent from "../../RadialProgress";
export default function BuildTrigger({
@@ -27,12 +24,11 @@ export default function BuildTrigger({
isBuilt: boolean;
}) {
const { updateSSEData, isBuilding, setIsBuilding, sseData } = useSSE();
- const { setProgress } = useContext(progressContext);
const { reactFlowInstance } = useContext(typesContext);
const { setErrorData, setSuccessData } = useContext(alertContext);
const [isIconTouched, setIsIconTouched] = useState(false);
- const { progress } = useContext(progressContext);
const eventClick = isBuilding ? "pointer-events-none" : "";
+ const [myValue, setMyValue] = useState(0);
async function handleBuild(flow: FlowType) {
try {
@@ -72,7 +68,6 @@ export default function BuildTrigger({
// Step 1: Make a POST request to send the flow data and receive a unique session ID
const response = await postBuildInit(flow);
const { flowId } = response.data;
- let loadProgress = [];
// Step 2: Use the session ID to establish an SSE connection using EventSource
let validationResults = [];
let finished = false;
@@ -93,10 +88,7 @@ export default function BuildTrigger({
// If the event is a log, log it
// TODO: implement the progress
setSuccessData({ title: parsedData.log });
- setSuccessData({ title: parsedData.progress });
- setProgress(parsedData.progress);
-
- loadProgress.push(parsedData.progress);
+ setMyValue(parsedData.progress);
} else {
// Otherwise, process the data
const isValid = processStreamResult(parsedData);
@@ -170,10 +162,11 @@ export default function BuildTrigger({
>