Skip to content

Commit b522338

Browse files
Fr4nc3Fr4nc3
committed
Refactor plan approval data type to MPlanData
Replaces all usage of ParsedPlanData with MPlanData across components, services, and models for consistency. Removes unused TaskDetails.tsx file and updates related type references and function signatures to match the new naming convention.
1 parent bf75cdb commit b522338

File tree

6 files changed

+48
-381
lines changed

6 files changed

+48
-381
lines changed

‎src/frontend/src/components/content/PlanChat.tsx‎

Lines changed: 41 additions & 106 deletions
Original file line numberDiff line numberDiff line change
@@ -15,15 +15,17 @@ import {
1515
PersonRegular,
1616
BotRegular,
1717
} from "@fluentui/react-icons";
18-
import { PlanChatProps, ParsedPlanData } from "../../models/plan";
18+
import { PlanChatProps, MPlanData } from "../../models/plan";
1919
import webSocketService from "../../services/WebSocketService";
2020
import { PlanDataService } from "../../services/PlanDataService";
2121
import { apiService } from "../../api/apiService";
2222
import { useNavigate } from "react-router-dom";
2323
import ChatInput from "../../coral/modules/ChatInput";
24-
24+
import InlineToaster, {
25+
useInlineToaster,
26+
} from "../toast/InlineToaster";
2527
interface SimplifiedPlanChatProps extends PlanChatProps {
26-
onPlanReceived?: (planData: ParsedPlanData) => void;
28+
onPlanReceived?: (planData: MPlanData) => void;
2729
initialTask?: string;
2830
}
2931

@@ -39,9 +41,9 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
3941
}) => {
4042
const navigate = useNavigate();
4143
const messagesContainerRef = useRef<HTMLDivElement>(null);
42-
44+
const { showToast, dismissToast } = useInlineToaster();
4345
// States
44-
const [planApprovalRequest, setPlanApprovalRequest] = useState<ParsedPlanData | null>(null);
46+
const [planApprovalRequest, setPlanApprovalRequest] = useState<MPlanData | null>(null);
4547
const [processingApproval, setProcessingApproval] = useState(false);
4648
const [waitingForPlan, setWaitingForPlan] = useState(true);
4749
const [userFeedback, setUserFeedback] = useState('');
@@ -61,33 +63,33 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
6163
const unsubscribe = webSocketService.on('parsed_plan_approval_request', (approvalRequest: any) => {
6264
console.log('📋 Plan received:', approvalRequest);
6365

64-
let parsedPlanData: ParsedPlanData | null = null;
66+
let mPlanData: MPlanData | null = null;
6567

6668
// Handle the different message structures
6769
if (approvalRequest.parsedData) {
6870
// Direct parsedData property
69-
parsedPlanData = approvalRequest.parsedData;
71+
mPlanData = approvalRequest.parsedData;
7072
} else if (approvalRequest.data && typeof approvalRequest.data === 'object') {
7173
// Data property with nested object
7274
if (approvalRequest.data.parsedData) {
73-
parsedPlanData = approvalRequest.data.parsedData;
75+
mPlanData = approvalRequest.data.parsedData;
7476
} else {
7577
// Try to parse the data object directly
76-
parsedPlanData = approvalRequest.data;
78+
mPlanData = approvalRequest.data;
7779
}
7880
} else if (approvalRequest.rawData) {
7981
// Parse the raw data string
80-
parsedPlanData = PlanDataService.parsePlanApprovalRequest(approvalRequest.rawData);
82+
mPlanData = PlanDataService.parsePlanApprovalRequest(approvalRequest.rawData);
8183
} else {
8284
// Try to parse the entire object
83-
parsedPlanData = PlanDataService.parsePlanApprovalRequest(approvalRequest);
85+
mPlanData = PlanDataService.parsePlanApprovalRequest(approvalRequest);
8486
}
8587

86-
if (parsedPlanData) {
87-
console.log('✅ Parsed plan data:', parsedPlanData);
88-
setPlanApprovalRequest(parsedPlanData);
88+
if (mPlanData) {
89+
console.log('✅ Parsed plan data:', mPlanData);
90+
setPlanApprovalRequest(mPlanData);
8991
setWaitingForPlan(false);
90-
onPlanReceived?.(parsedPlanData);
92+
onPlanReceived?.(mPlanData);
9193
scrollToBottom();
9294
} else {
9395
console.error('❌ Failed to parse plan data', approvalRequest);
@@ -102,63 +104,55 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
102104
if (!planApprovalRequest) return;
103105

104106
setProcessingApproval(true);
105-
107+
let id = showToast("Submitting Approval", "progress");
106108
try {
107109
await apiService.approvePlan({
108110
m_plan_id: planApprovalRequest.id,
109-
plan_id: planApprovalRequest.id,
110-
approved: true,
111-
feedback: userFeedback || 'Plan approved by user'
112-
});
113-
114-
webSocketService.sendPlanApprovalResponse({
115-
plan_id: planApprovalRequest.id,
116-
session_id: planData?.plan?.session_id || '',
111+
plan_id: planData?.plan?.id,
117112
approved: true,
118113
feedback: userFeedback || 'Plan approved by user'
119114
});
120115

116+
dismissToast(id);
121117
setShowFeedbackInput(false);
122118
onPlanApproval?.(true);
123119

124120
} catch (error) {
121+
dismissToast(id);
122+
showToast("Failed to submit approval", "error");
125123
console.error('❌ Failed to approve plan:', error);
126124
} finally {
127125
setProcessingApproval(false);
128126
}
129-
}, [planApprovalRequest, planData?.plan?.session_id, userFeedback, onPlanApproval]);
127+
}, [planApprovalRequest, planData, userFeedback, onPlanApproval]);
130128

131129
// Handle plan rejection
132130
const handleRejectPlan = useCallback(async () => {
133131
if (!planApprovalRequest) return;
134132

135133
setProcessingApproval(true);
136-
134+
let id = showToast("Submitting cancellation", "progress");
137135
try {
138136
await apiService.approvePlan({
139137
m_plan_id: planApprovalRequest.id,
140-
plan_id: planApprovalRequest.id,
141-
approved: false,
142-
feedback: userFeedback || 'Plan rejected by user'
143-
});
144-
145-
webSocketService.sendPlanApprovalResponse({
146-
plan_id: planApprovalRequest.id,
147-
session_id: planData?.plan?.session_id || '',
138+
plan_id: planData?.plan?.id,
148139
approved: false,
149140
feedback: userFeedback || 'Plan rejected by user'
150141
});
151142

143+
dismissToast(id);
152144
onPlanApproval?.(false);
153145
navigate('/');
154146

155147
} catch (error) {
148+
dismissToast(id);
149+
showToast("Failed to submit cancellation", "error");
156150
console.error('❌ Failed to reject plan:', error);
157151
navigate('/');
158152
} finally {
159153
setProcessingApproval(false);
160154
}
161-
}, [planApprovalRequest, planData?.plan?.session_id, onPlanApproval, navigate]);
155+
}, [planApprovalRequest, planData, onPlanApproval, navigate]);
162156

163157
// Extract user task with better fallback logic
164158
const getUserTask = () => {
@@ -478,51 +472,6 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
478472
</div>
479473
)}
480474

481-
{/* Feedback Input Section - Separate from action buttons */}
482-
{showFeedbackInput && (
483-
<div style={{
484-
marginBottom: '20px',
485-
padding: '20px',
486-
backgroundColor: 'var(--colorNeutralBackground2)',
487-
borderRadius: '12px',
488-
border: '1px solid var(--colorNeutralStroke2)'
489-
}}>
490-
<h5 style={{
491-
margin: '0 0 12px 0',
492-
fontSize: '16px',
493-
fontWeight: '600',
494-
color: 'var(--colorNeutralForeground1)'
495-
}}>
496-
Additional Feedback
497-
</h5>
498-
<Textarea
499-
value={userFeedback}
500-
onChange={(_, data) => setUserFeedback(data.value)}
501-
placeholder="Add any specific feedback, modifications, or comments..."
502-
rows={3}
503-
style={{ width: '100%', marginBottom: '12px' }}
504-
/>
505-
<div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>
506-
<Button
507-
appearance="subtle"
508-
onClick={() => {
509-
setShowFeedbackInput(false);
510-
setUserFeedback('');
511-
}}
512-
size="small"
513-
>
514-
Cancel
515-
</Button>
516-
<Button
517-
appearance="outline"
518-
onClick={() => setShowFeedbackInput(false)}
519-
size="small"
520-
>
521-
Save Feedback
522-
</Button>
523-
</div>
524-
</div>
525-
)}
526475

527476
{/* Action Buttons - Separate section */}
528477
<div style={{
@@ -540,43 +489,29 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
540489
fontSize: '14px',
541490
color: 'var(--colorNeutralForeground2)'
542491
}}>
543-
{userFeedback ? (
544-
<span> Feedback added</span>
545-
) : (
546-
<span>Ready for approval</span>
547-
)}
548-
</div>
492+
<span>Ready for approval</span>
549493

550-
{!showFeedbackInput && (
551-
<Button
552-
appearance="subtle"
553-
onClick={() => setShowFeedbackInput(true)}
554-
size="medium"
555-
>
556-
Add Feedback
557-
</Button>
558-
)}
494+
</div>
559495

560496
<Button
561-
appearance="outline"
562-
icon={<DismissRegular />}
563-
onClick={handleRejectPlan}
497+
appearance="primary"
498+
icon={processingApproval ? <Spinner size="extra-tiny" /> : <CheckmarkRegular />}
499+
onClick={handleApprovePlan}
564500
disabled={processingApproval}
565501
size="medium"
566-
style={{ minWidth: '100px' }}
502+
style={{ minWidth: '140px' }}
567503
>
568-
Reject
504+
{processingApproval ? 'Processing...' : 'Approve'}
569505
</Button>
570-
571506
<Button
572-
appearance="primary"
573-
icon={processingApproval ? <Spinner size="extra-tiny" /> : <CheckmarkRegular />}
574-
onClick={handleApprovePlan}
507+
appearance="outline"
508+
icon={<DismissRegular />}
509+
onClick={handleRejectPlan}
575510
disabled={processingApproval}
576511
size="medium"
577-
style={{ minWidth: '140px' }}
512+
style={{ minWidth: '100px' }}
578513
>
579-
{processingApproval ? 'Processing...' : 'Approve & Execute'}
514+
Cancel
580515
</Button>
581516
</div>
582517
</div>

‎src/frontend/src/components/content/PlanPanelRight.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import {
1212
ClockRegular,
1313
PersonRegular,
1414
} from "@fluentui/react-icons";
15-
import { ParsedPlanData } from "../../models";
15+
import { MPlanData } from "../../models";
1616
import { TaskService } from "../../services/TaskService";
1717
import { Step } from "../../models/plan";
1818
import { PlanDataService } from "../../services/PlanDataService";
@@ -59,7 +59,7 @@ const PlanPanelRight: React.FC<PlanPanelRightProps> = ({
5959
wsConnected = false,
6060
}) => {
6161
const [groupedStreamingMessages, setGroupedStreamingMessages] = useState<GroupedMessage[]>([]);
62-
const [planApprovalRequest, setPlanApprovalRequest] = useState<ParsedPlanData | null>(null);
62+
const [planApprovalRequest, setPlanApprovalRequest] = useState<MPlanData | null>(null);
6363
const [hasStreamingStarted, setHasStreamingStarted] = useState(false);
6464

6565
// Helper function to get clean agent display name

0 commit comments

Comments
 (0)