feat: Add chat management actions including clear and delete conversation, and enhance session token refresh logic.

src/components/message/ChatHeader.tsx

@@ -1,6 +1,8 @@
 'use client';
 
+import { useState, useCallback } from 'react';
 import Image from 'next/image';
+import { ChatDropdownMenu, type DropdownMenuItem } from './ChatDropdownMenu';
 
 interface ChatHeaderProps {
   name: string;
@@ -12,6 +14,8 @@ interface ChatHeaderProps {
   expertise?: string[];
   isTyping?: boolean;
   typingText?: string;
+  onClearChat?: () => void;
+  onDeleteConversation?: () => void;
 }
 
 export function ChatHeader({
@@ -24,7 +28,42 @@ export function ChatHeader({
   expertise = [],
   isTyping = false,
   typingText,
+  onClearChat,
+  onDeleteConversation,
 }: ChatHeaderProps) {
+  const [isMenuOpen, setIsMenuOpen] = useState(false);
+  const [isMuted, setIsMuted] = useState(false);
+
+  const menuItems: DropdownMenuItem[] = [
+    {
+      label: 'Clear Chat',
+      onClick: () => onClearChat?.(),
+    },
+    {
+      label: isMuted ? 'Unmute Notifications' : 'Mute Notifications',
+      onClick: () => setIsMuted((prev) => !prev),
+    },
+    {
+      label: 'Report User',
+      onClick: () => {
+        // Placeholder — no backend endpoint yet
+      },
+    },
+    {
+      label: 'Delete Conversation',
+      onClick: () => onDeleteConversation?.(),
+      danger: true,
+    },
+  ];
+
+  const handleToggleMenu = useCallback(() => {
+    setIsMenuOpen((prev) => !prev);
+  }, []);
+
+  const handleCloseMenu = useCallback(() => {
+    setIsMenuOpen(false);
+  }, []);
+
   return (
     <div className="border-b border-[#00293d]/10 pb-4">
       {/* Top row - Name, status, actions */}
@@ -46,14 +85,24 @@ export function ChatHeader({
           </span>
         </div>
         <div className="flex items-center gap-2 flex-shrink-0">
-          <button className="p-2 hover:bg-gray-100 rounded-lg transition-colors cursor-pointer">
-            <Image
-              src="/assets/icons/three-dots-horizontal-icon.svg"
-              alt="More options"
-              width={24}
-              height={24}
+          <div className="relative">
+            <button
+              onClick={handleToggleMenu}
+              className="p-2 hover:bg-gray-100 rounded-lg transition-colors cursor-pointer"
+            >
+              <Image
+                src="/assets/icons/three-dots-horizontal-icon.svg"
+                alt="More options"
+                width={24}
+                height={24}
+              />
+            </button>
+            <ChatDropdownMenu
+              items={menuItems}
+              isOpen={isMenuOpen}
+              onClose={handleCloseMenu}
             />
-          </button>
+          </div>
           <button className="p-2 hover:bg-gray-100 rounded-lg transition-colors cursor-pointer">
             <Image
               src="/assets/icons/star-outline-icon.svg"