p2/p3 Bug fixes

Author: Ravikirana-Microsoft

src/frontend/src/api/apiService.tsx

@@ -160,7 +160,7 @@ export class APIService {
 
         if (useCache) {
             const cachedPlan = this._cache.get<{ plan_with_steps: PlanWithSteps; messages: PlanMessage[] }>(cacheKey);
-            //if (cachedPlan) return cachedPlan;
+            if (cachedPlan) return cachedPlan;
 
             return this._requestTracker.trackRequest(cacheKey, fetcher);
         }

src/frontend/src/components/content/TaskDetails.tsx

@@ -118,7 +118,13 @@ const TaskDetails: React.FC<TaskDetailsProps> = ({
               </div>
             </div>
             <div>
-              <Body1Strong>{planData.plan.initial_goal}</Body1Strong>
+              <Tooltip content={planData.plan.initial_goal} relationship={"label"}>
+                <Body1Strong
+                  className="goal-text"
+                >
+                  {planData.plan.initial_goal}
+                </Body1Strong>
+              </Tooltip>
               <br />
               <Text size={200}>
                 {completedCount} of {total} completed

src/frontend/src/components/content/TaskList.tsx

@@ -45,11 +45,12 @@ const TaskList: React.FC<TaskListProps> = ({
           <div className="task-name-truncated" title={task.name}>
             {task.name}
           </div>
-
-
-          {task.date && (
+          {task.date && task.status == "completed" &&(
             <Caption1 className="task-list-task-date">{task.date}</Caption1>
           )}
+          {task.status == "inprogress" &&(
+            <Caption1 className="task-list-task-date">{`${task?.completed_steps} of ${task?.total_steps} completed`}</Caption1>
+          )}
         </div>
         <Menu>
           <MenuTrigger>

src/frontend/src/models/taskList.tsx

@@ -3,6 +3,8 @@ export interface Task {
     name: string;
     status: 'inprogress' | 'completed';
     date?: string;
+    completed_steps?: number;
+    total_steps?: number;
 }
 
 export interface TaskListProps {

src/frontend/src/pages/PlanPage.tsx

@@ -69,7 +69,7 @@ const PlanPage: React.FC = () => {
                 }
 
                 setError(null);
-                const data = await PlanDataService.fetchPlanData(planId);
+                const data = await PlanDataService.fetchPlanData(planId,navigate);
                 console.log("Fetched plan data:", data);
                 setPlanData(data);
             } catch (err) {
@@ -146,7 +146,7 @@ const PlanPage: React.FC = () => {
 
 
     useEffect(() => {
-        loadPlanData();
+        loadPlanData(true);
     }, [loadPlanData]);
 
     const handleNewTaskButton = () => {

src/frontend/src/services/PlanDataService.tsx

@@ -10,10 +10,10 @@ export class PlanDataService {    /**
      * @param planId Plan ID to fetch
      * @returns Promise with processed plan data
      */
-    static async fetchPlanData(planId: string): Promise<ProcessedPlanData> {
+    static async fetchPlanData(planId: string,useCache:boolean): Promise<ProcessedPlanData> {
         try {
             // Use optimized getPlanById method for better performance
-            const planBody = await apiService.getPlanById(planId);
+            const planBody = await apiService.getPlanById(planId,useCache);
             return this.processPlanData(planBody.plan_with_steps, planBody.messages || []);
         } catch (error) {
             console.log('Failed to fetch plan data:', error);

src/frontend/src/services/TaskService.tsx

@@ -24,6 +24,8 @@ export class TaskService {
             const task: Task = {
                 id: plan.session_id,
                 name: plan.initial_goal,
+                completed_steps: plan.completed,
+                total_steps: plan.total_steps,
                 status: apiService.isPlanComplete(plan) ? 'completed' : 'inprogress',
                 date: new Date(plan.timestamp).toLocaleDateString('en-US', {
                     month: 'short',

src/frontend/src/styles/TaskDetails.css

@@ -146,4 +146,14 @@
 }
 .strikethrough {
     text-decoration: line-through;
+}
+
+.goal-text {
+    display: -webkit-box !important;
+    -webkit-line-clamp: 2 !important;
+    -webkit-box-orient: vertical !important;
+    overflow: hidden !important;
+    text-overflow: ellipsis !important;
+    white-space: normal !important;
+    max-width: 300px;
 }