feat: Unified Messaging System — kommunikation plugin, AI/Proactive/System participants, MessageSidebar, Rich Content Renderer

Phase 1: Backend plugin kommunikation (13 files, 10 tables, REST API, WebSocket, RBAC, DMS Bridge, Participant Registry, Mini-App Registry, Search Provider) Phase 2: AI plugins as participants (ai_assistant + ai_proactive dock as participants, heartbeat job) Phase 3: system_notif plugin (system events → chat messages, pinned System room) Phase 4: Frontend MessageSidebar (replaces AISidebar, same design, comm API client, WebSocket hook, commStore) Phase 5: Rich Content Block Renderer (11 components: Markdown, HTML, Image, Audio, Video, File, ActionCard, ContactCard, MiniApp, BlockRenderer) BasePlugin: added services property + _container in on_activate
2026-07-22 01:22:15 +02:00
parent 5980d38c66
commit cc3ac9a43d
45 changed files with 8154 additions and 113 deletions
@@ -0,0 +1,52 @@
+import React from 'react';
+import type { MessageBlock } from '@/store/commStore';
+
+interface ContactCardBlockProps {
+  block: MessageBlock;
+}
+
+const ContactCardBlock: React.FC<ContactCardBlockProps> = ({ block }) => {
+  const { contact_id, name } = block.block_data;
+
+  const contactName: string = name || 'Unbekannter Kontakt';
+  const contactId: string = contact_id || '';
+  const linkHref = contactId ? `/contacts/${contactId}` : '#';
+
+  // Generate initials for avatar placeholder
+  const initials = contactName
+    .split(' ')
+    .map((part) => part.charAt(0).toUpperCase())
+    .slice(0, 2)
+    .join('');
+
+  return (
+    <a
+      href={linkHref}
+      className="flex items-center gap-3 p-3 rounded-lg border border-secondary-200 bg-white shadow-sm hover:shadow-md hover:border-primary-300 transition-all"
+    >
+      <div className="flex-shrink-0 w-10 h-10 rounded-full bg-primary-100 text-primary-700 flex items-center justify-center text-sm font-semibold">
+        {initials || '?'}
+      </div>
+      <div className="flex-1 min-w-0">
+        <p className="text-sm font-medium text-secondary-700 truncate">{contactName}</p>
+        <p className="text-xs text-secondary-400">Kontakt anzeigen</p>
+      </div>
+      <svg
+        className="w-4 h-4 text-secondary-400 flex-shrink-0"
+        fill="none"
+        viewBox="0 0 24 24"
+        stroke="currentColor"
+        aria-hidden="true"
+      >
+        <path
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={2}
+          d="M9 5l7 7-7 7"
+        />
+      </svg>
+    </a>
+  );
+};
+
+export default ContactCardBlock;