From 938f2a84d8f6a14e4177e122d576f1bef65df00e Mon Sep 17 00:00:00 2001
From: saridsa2 <s.satya.suman@globaluniversityfoundation.com>
Date: Tue, 24 Mar 2026 08:11:22 +0530
Subject: [PATCH] fix: enquiry in post-call, appointment skip button, AI scroll
 containment

- Enquiry button + form available during disposition stage (not just active call)
- Skip & Return to Worklist button on post-call appointment booking
- AI chat scroll uses parentElement.scrollTop instead of scrollIntoView

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/call-desk/active-call-card.tsx | 43 +++++++++++++------
 src/components/call-desk/ai-chat-panel.tsx    |  6 ++-
 2 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/src/components/call-desk/active-call-card.tsx b/src/components/call-desk/active-call-card.tsx
index 6bd5ee6..9289b9b 100644
--- a/src/components/call-desk/active-call-card.tsx
+++ b/src/components/call-desk/active-call-card.tsx
@@ -208,7 +208,7 @@ export const ActiveCallCard = ({ lead, callerPhone, missedCallId, onCallComplete
             );
         }
 
-        // Appointment booking after disposition
+        // Appointment booking after disposition — auto-return when form closes
         if (postCallStage === 'appointment') {
             return (
                 <>
@@ -216,6 +216,9 @@ export const ActiveCallCard = ({ lead, callerPhone, missedCallId, onCallComplete
                         <FontAwesomeIcon icon={faCalendarPlus} className="size-6 text-fg-brand-primary mb-2" />
                         <p className="text-sm font-semibold text-brand-secondary">Booking Appointment</p>
                         <p className="text-xs text-tertiary mt-1">for {fullName || phoneDisplay}</p>
+                        <Button size="sm" color="secondary" className="mt-2" onClick={() => setPostCallStage('done')}>
+                            Skip & Return to Worklist
+                        </Button>
                     </div>
                     <AppointmentForm
                         isOpen={appointmentOpen}
@@ -233,20 +236,36 @@ export const ActiveCallCard = ({ lead, callerPhone, missedCallId, onCallComplete
             );
         }
 
-        // Disposition form
+        // Disposition form + enquiry access
         return (
-            <div className="rounded-xl border border-secondary bg-primary p-4">
-                <div className="flex items-center gap-2 mb-3">
-                    <div className="flex size-8 items-center justify-center rounded-full bg-secondary">
-                        <FontAwesomeIcon icon={faPhoneHangup} className="size-3.5 text-fg-quaternary" />
-                    </div>
-                    <div>
-                        <p className="text-sm font-semibold text-primary">Call Ended — {fullName || phoneDisplay}</p>
-                        <p className="text-xs text-tertiary">{formatDuration(callDuration)} · Log this call</p>
+            <>
+                <div className="rounded-xl border border-secondary bg-primary p-4">
+                    <div className="flex items-center justify-between mb-3">
+                        <div className="flex items-center gap-2">
+                            <div className="flex size-8 items-center justify-center rounded-full bg-secondary">
+                                <FontAwesomeIcon icon={faPhoneHangup} className="size-3.5 text-fg-quaternary" />
+                            </div>
+                            <div>
+                                <p className="text-sm font-semibold text-primary">Call Ended — {fullName || phoneDisplay}</p>
+                                <p className="text-xs text-tertiary">{formatDuration(callDuration)} · Log this call</p>
+                            </div>
+                        </div>
+                        <Button size="sm" color="secondary"
+                            iconLeading={({ className, ...rest }: any) => <FontAwesomeIcon icon={faClipboardQuestion} className={className} {...rest} />}
+                            onClick={() => setEnquiryOpen(!enquiryOpen)}>Enquiry</Button>
                     </div>
+                    <DispositionForm onSubmit={handleDisposition} defaultDisposition={appointmentBookedDuringCall ? 'APPOINTMENT_BOOKED' : null} />
                 </div>
-                <DispositionForm onSubmit={handleDisposition} defaultDisposition={appointmentBookedDuringCall ? 'APPOINTMENT_BOOKED' : null} />
-            </div>
+                <EnquiryForm
+                    isOpen={enquiryOpen}
+                    onOpenChange={setEnquiryOpen}
+                    callerPhone={callerPhone}
+                    onSaved={() => {
+                        setEnquiryOpen(false);
+                        notify.success('Enquiry Logged');
+                    }}
+                />
+            </>
         );
     }
 
diff --git a/src/components/call-desk/ai-chat-panel.tsx b/src/components/call-desk/ai-chat-panel.tsx
index c1a7fd3..06da039 100644
--- a/src/components/call-desk/ai-chat-panel.tsx
+++ b/src/components/call-desk/ai-chat-panel.tsx
@@ -45,7 +45,11 @@ export const AiChatPanel = ({ callerContext, role = 'cc-agent' }: AiChatPanelPro
     const inputRef = useRef<HTMLInputElement>(null);
 
     const scrollToBottom = useCallback(() => {
-        messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+        // Scroll within the messages container only — don't scroll the parent panel
+        const el = messagesEndRef.current;
+        if (el?.parentElement) {
+            el.parentElement.scrollTop = el.parentElement.scrollHeight;
+        }
     }, []);
 
     useEffect(() => {