Merge pull request #472 from microsoft/macae-v3-fr-dev-92

Update PlanChat UI and simplify error handling

Author: Fr4nc3

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

@@ -33,6 +33,7 @@ import ContentNotFound from "../NotFound/ContentNotFound";
 import PlanChatBody from "./PlanChatBody";
 import renderBufferMessage from "./streaming/StreamingBufferMessage";
 import renderAgentMessages from "./streaming/StreamingAgentMessage";
+
 interface SimplifiedPlanChatProps extends PlanChatProps {
   onPlanReceived?: (planData: MPlanData) => void;
   initialTask?: string;
@@ -141,6 +142,7 @@ const PlanChat: React.FC<SimplifiedPlanChatProps> = ({
       backgroundColor: 'var(--colorNeutralBackground1)'
     }}>
       {/* Messages Container */}
+      <InlineToaster />
       <div
         ref={messagesContainerRef}
         style={{

src/frontend/src/components/content/PlanChatBody.tsx

@@ -16,14 +16,15 @@ const PlanChatBody: React.FC<SimplifiedPlanChatProps> = ({
 }) => {
     return (
 
-        <div style={{
-            padding: '20px 24px 32px',
-            borderTop: '1px solid var(--colorNeutralStroke2)',
-            backgroundColor: 'var(--colorNeutralBackground1)',
-            maxWidth: '800px',
-            margin: '0 auto',
-            width: '100%'
-        }}
+        <div
+            style={{
+                padding: '20px 24px 32px',
+                borderTop: '1px solid var(--colorNeutralStroke2)',
+                backgroundColor: 'var(--colorNeutralBackground1)',
+                maxWidth: '800px',
+                margin: '0 auto',
+                width: '98%'
+            }}
 
         >
             <ChatInput
@@ -34,7 +35,7 @@ const PlanChatBody: React.FC<SimplifiedPlanChatProps> = ({
                 placeholder={
                     waitingForPlan
                         ? "Creating plan..."
-                        : "Send a message..."
+                        : "Add more info to this plan..."
                 }
             >
                 <Button

src/frontend/src/pages/PlanPage.tsx

@@ -383,7 +383,7 @@ const PlanPage: React.FC = () => {
                 setInput("");
                 dismissToast(id);
                 showToast("Clarification submitted successfully", "success");
-                setClarificationMessage(null);
+
                 const agentMessageData = {
                     agent: 'You',
                     agent_type: AgentMessageType.HUMAN_AGENT,
@@ -400,45 +400,12 @@ const PlanPage: React.FC = () => {
 
             } catch (error: any) {
                 dismissToast(id);
+                setSubmittingChatDisableInput(false);
+                showToast(
+                    "Failed to submit clarification",
+                    "error"
+                );
 
-                // Enhanced error handling for v3 backend
-                let errorDetail = null;
-                try {
-                    // Try to parse the error detail if it's a string
-                    if (typeof error?.response?.data?.detail === 'string') {
-                        errorDetail = JSON.parse(error.response.data.detail);
-                    } else {
-                        errorDetail = error?.response?.data?.detail;
-                    }
-                } catch (parseError) {
-                    // If parsing fails, use the original error
-                    errorDetail = error?.response?.data?.detail;
-                }
-
-                // Handle RAI validation errors with better UX
-                if (errorDetail?.error_type === 'RAI_VALIDATION_FAILED') {
-                    const raiErrorData: RAIErrorData = {
-                        error_type: 'RAI_VALIDATION_FAILED',
-                        message: 'Content Policy Violation',
-                        description: errorDetail.message || 'Your input contains content that violates our content policy.',
-                        suggestions: errorDetail.suggestions || [
-                            'Please rephrase your message using professional language',
-                            'Avoid potentially harmful or inappropriate content',
-                            'Focus on business-appropriate requests'
-                        ],
-                        user_action: 'Please modify your input and try again.'
-                    };
-
-                } else {
-                    // Handle other types of errors
-                    showToast(
-                        error?.response?.data?.detail?.message ||
-                        error?.response?.data?.detail ||
-                        error?.message ||
-                        "Failed to submit clarification",
-                        "error"
-                    );
-                }
             } finally {
 
             }