feat: overhaul chat architecture with persistent JdbcChatMemory, reactive UI components, and improved conversation management

src/components/chat/ToolStatusIndicator.tsx

@@ -0,0 +1,30 @@
+import { Badge } from '@/components/ui/badge'
+import { Loader2 } from 'lucide-react'
+
+interface ToolStatusIndicatorProps {
+  toolName?: string
+}
+
+const TOOL_NAME_MAP: Record<string, string> = {
+  searchCampaigns: '🔍 Đang tìm kiếm chiến dịch...',
+  getCampaignDetails: '📋 Đang lấy thông tin chi tiết chiến dịch...',
+  createCampaign: '✨ Đang khởi tạo chiến dịch mới...',
+  executeWorkflow: '⚡ Đang xử lý quy trình...',
+  queryCustomerPoints: '💳 Đang tra cứu điểm thưởng khách hàng...',
+}
+
+export function ToolStatusIndicator({ toolName }: ToolStatusIndicatorProps) {
+  if (!toolName) return null
+
+  const displayText = TOOL_NAME_MAP[toolName] || `🔍 Đang xử lý: ${toolName}...`
+
+  return (
+    <Badge
+      variant="outline"
+      className="gap-2 text-xs font-normal border-amber-500/30 bg-amber-500/10 text-amber-500 py-1 px-3 w-fit animate-pulse my-0.5 shadow-sm"
+    >
+      <Loader2 className="w-3.5 h-3.5 animate-spin text-amber-500 shrink-0" />
+      <span>{displayText}</span>
+    </Badge>
+  )
+}