feat: add WebChat adapter for pipeline debugging (#1510)

* feat: add WebChat adapter for pipeline debugging

- Create WebChatAdapter for handling debug messages in pipeline testing
- Add HTTP API endpoints for debug message sending and retrieval
- Implement frontend debug dialog with session switching (private/group chat)
- Add Chinese i18n translations for debug interface
- Auto-create default WebChat bot during database initialization
- Support fixed session IDs: webchatperson and webchatgroup for testing

Co-Authored-By: Junyan Qin <Chin>, 秦骏言 in Chinese, you can call me my english name Rock Chin. <rockchinq@gmail.com>

* perf: ui for webchat

* feat: complete webchat backend

* feat: core chat apis

* perf: button style in pipeline card

* perf: log btn in bot card

* perf: webchat entities definition

* fix: bugs

* perf: web chat

* perf: dialog styles

* perf: styles

* perf: styles

* fix: group invalid in webchat

* perf: simulate real im message

* perf: group timeout toast

* feat(webchat): add supports for mentioning bot in group

* perf(webchat): at component styles

* perf: at badge display in message

* fix: linter errors

* fix: webchat was listed on adapter list

---------

Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Junyan Qin <Chin>, 秦骏言 in Chinese, you can call me my english name Rock Chin. <rockchinq@gmail.com>

web/src/app/home/pipelines/page.tsx

@@ -15,6 +15,8 @@ import {
 } from '@/components/ui/dialog';
 import { toast } from 'sonner';
 import { useTranslation } from 'react-i18next';
+import DebugDialog from './debug-dialog/DebugDialog';
+
 export default function PluginConfigPage() {
   const { t } = useTranslation();
   const [modalOpen, setModalOpen] = useState<boolean>(false);
@@ -32,6 +34,8 @@ export default function PluginConfigPage() {
   const [disableForm, setDisableForm] = useState(false);
   const [selectedPipelineIsDefault, setSelectedPipelineIsDefault] =
     useState(false);
+  const [debugDialogOpen, setDebugDialogOpen] = useState(false);
+  const [debugPipelineId, setDebugPipelineId] = useState('');
 
   useEffect(() => {
     getPipelines();
@@ -92,6 +96,11 @@ export default function PluginConfigPage() {
     });
   }
 
+  const handleDebug = (pipelineId: string) => {
+    setDebugPipelineId(pipelineId);
+    setDebugDialogOpen(true);
+  };
+
   return (
     <div className={styles.configPageContainer}>
       <Dialog open={modalOpen} onOpenChange={setModalOpen}>
@@ -149,11 +158,17 @@ export default function PluginConfigPage() {
                 getSelectedPipelineForm(pipeline.id);
               }}
             >
-              <PipelineCard cardVO={pipeline} />
+              <PipelineCard cardVO={pipeline} onDebug={handleDebug} />
             </div>
           );
         })}
       </div>
+
+      <DebugDialog
+        open={debugDialogOpen}
+        onOpenChange={setDebugDialogOpen}
+        pipelineId={debugPipelineId}
+      />
     </div>
   );
 }