Merge pull request #272 from microsoft/ui-ux-refresh-bug-fixes

fix: UI ux refresh bug fixes

Author: Fr4nc3

src/frontend_react/src/pages/PlanPage.tsx

@@ -37,7 +37,7 @@ import InlineToaster, {
 } from "../components/toast/InlineToaster";
 import Octo from "../coral/imports/Octopus.png"; // 🐙 Animated PNG loader
 import PanelRightToggles from "@/coral/components/Header/PanelRightToggles";
-import { TaskListSquareLtr } from "@/coral/imports/bundleicons";
+import {TaskListSquareLtr } from "@/coral/imports/bundleicons";
 import LoadingMessage, { loadingMessages } from "@/coral/components/LoadingMessage";
 
 /**
@@ -47,7 +47,7 @@ import LoadingMessage, { loadingMessages } from "@/coral/components/LoadingMessa
 const PlanPage: React.FC = () => {
     const { planId } = useParams<{ planId: string }>();
     const navigate = useNavigate();
-    const { showToast } = useInlineToaster();
+    const { showToast,dismissToast } = useInlineToaster();
 
     const [input, setInput] = useState("");
     const [planData, setPlanData] = useState<ProcessedPlanData | any>(null);
@@ -135,10 +135,11 @@ const PlanPage: React.FC = () => {
         async (step: Step, total: number, completed: number, approve: boolean) => {
             setProcessingSubtaskId(step.id);
             const toastMessage = approve ? "Approving step" : "Rejecting step";
-            showToast(toastMessage, "progress");
+            let id = showToast(toastMessage, "progress");
             setSubmitting(true);
             try {
                 await PlanDataService.stepStatus(step, approve);
+                dismissToast(id);
                 showToast(`Step ${approve ? "approved" : "rejected"} successfully`, "success");
                 if (total === completed) {
                     setReloadLeftList(true);
@@ -147,6 +148,7 @@ const PlanPage: React.FC = () => {
                 }
                 await loadPlanData(false);
             } catch (error) {
+                 dismissToast(id);
                 showToast(`Failed to ${approve ? "approve" : "reject"} step`, "error");
                 console.error(`Failed to ${approve ? "approve" : "reject"} step:`, error);
             } finally {