Refactor plan panel left reload logic and props

Simplifies reload logic in PlanPanelLeft by removing unused imports and effect, and ensures plans reload on team selection. Updates PlanPanelLefProps to require reloadTasks. Adjusts HomePage to trigger left panel reload on team selection and improves logging for better traceability.

Author: Fr4nc3

src/frontend/src/components/content/PlanPanelLeft.tsx

@@ -2,17 +2,13 @@ import PanelLeft from "@/coral/components/Panels/PanelLeft";
 import PanelLeftToolbar from "@/coral/components/Panels/PanelLeftToolbar";
 import {
   Body1Strong,
-  Button,
-  Subtitle1,
-  Subtitle2,
   Toast,
   ToastBody,
   ToastTitle,
   Tooltip,
   useToastController,
 } from "@fluentui/react-components";
 import {
-  Add20Regular,
   ChatAdd20Regular,
   ErrorCircle20Regular,
 } from "@fluentui/react-icons";
@@ -22,7 +18,6 @@ import { useNavigate, useParams } from "react-router-dom";
 import { Plan, PlanPanelLefProps, Task, UserInfo } from "@/models";
 import { apiService } from "@/api";
 import { TaskService } from "@/services";
-import MsftColor from "@/coral/imports/MsftColor";
 import ContosoLogo from "../../coral/imports/ContosoLogo";
 import "../../styles/PlanPanelLeft.css";
 import PanelFooter from "@/coral/components/Panels/PanelFooter";
@@ -60,9 +55,10 @@ const PlanPanelLeft: React.FC<PlanPanelLefProps> = ({
 
   const loadPlansData = useCallback(async (forceRefresh = false) => {
     try {
+      console.log("Loading plans, forceRefresh:", forceRefresh);
       setPlansLoading(true);
       setPlansError(null);
-      const plansData = await apiService.getPlans(undefined, !forceRefresh);
+      const plansData = await apiService.getPlans(undefined, forceRefresh);
       setPlans(plansData);
     } catch (error) {
       console.log("Failed to load plans:", error);
@@ -74,12 +70,7 @@ const PlanPanelLeft: React.FC<PlanPanelLefProps> = ({
     }
   }, []);
 
-  useEffect(() => {
-    if (reloadTasks) {
-      loadPlansData();
-      restReload?.();
-    }
-  }, [reloadTasks, loadPlansData, restReload]);
+
   // Fetch plans
 
 
@@ -131,6 +122,7 @@ const PlanPanelLeft: React.FC<PlanPanelLefProps> = ({
   const handleTeamSelect = useCallback(
     (team: TeamConfig | null) => {
       // Use parent's team select handler if provided, otherwise use local state
+      loadPlansData();
       if (onTeamSelect) {
         onTeamSelect(team);
       } else {
@@ -160,7 +152,7 @@ const PlanPanelLeft: React.FC<PlanPanelLefProps> = ({
         }
       }
     },
-    [onTeamSelect, dispatchToast]
+    [onTeamSelect, dispatchToast, loadPlansData]
   );
 
   return (

src/frontend/src/models/planPanelLeft.tsx

@@ -1,7 +1,7 @@
 import { TeamConfig } from './Team';
 
 export interface PlanPanelLefProps {
-    reloadTasks?: boolean;
+    reloadTasks: boolean;
     onNewTaskButton: () => void;
     restReload?: () => void;
     onTeamSelect?: (team: TeamConfig | null) => void;

src/frontend/src/pages/HomePage.tsx

@@ -98,15 +98,17 @@ const HomePage: React.FC = () => {
      */
     const handleTeamSelect = useCallback(async (team: TeamConfig | null) => {
         setSelectedTeam(team);
+        setReloadLeftList(true);
+        console.log('handleTeamSelect called with team:', true);
         if (team) {
 
             try {
                 // TODO REFRACTOR THIS CODE 
                 setIsLoadingTeam(true);
                 const initResponse = await TeamService.initializeTeam(true);
-                setReloadLeftList(true)
+
                 if (initResponse.data?.status === 'Request started successfully' && initResponse.data?.team_id) {
-                    console.log('Team initialization completed:', initResponse.data?.team_id);
+                    console.log('handleTeamSelect:', initResponse.data?.team_id);
 
                     // Now fetch the actual team details using the team_id
                     const teams = await TeamService.getUserTeams();
@@ -115,9 +117,9 @@ const HomePage: React.FC = () => {
                     if (initializedTeam) {
                         setSelectedTeam(initializedTeam);
                         TeamService.storageTeam(initializedTeam);
-
-                        console.log('Team loaded successfully:', initializedTeam.name);
-                        console.log('Team agents:', initializedTeam.agents?.length || 0);
+                        setReloadLeftList(true)
+                        console.log('Team loaded successfully handleTeamSelect:', initializedTeam.name);
+                        console.log('Team agents handleTeamSelect:', initializedTeam.agents?.length || 0);
 
                         showToast(
                             `${initializedTeam.name} team initialized successfully with ${initializedTeam.agents?.length || 0} agents`,