Добавлены новые зависимости для работы с эмодзи и улучшена структура базы данных. Реализована модель сообщений и обновлены компоненты для поддержки новых функций мессенджера. Обновлены запросы и мутации для работы с сообщениями и чатом.

2025-07-16 22:07:38 +03:00
parent 823ef9a28c
commit 205c9eae98
33 changed files with 3288 additions and 229 deletions
--- a/src/components/messenger/messenger-dashboard.tsx
+++ b/src/components/messenger/messenger-dashboard.tsx
@ -0,0 +1,113 @@
+"use client"
+
+import { useState } from 'react'
+import { useQuery } from '@apollo/client'
+import { Card } from '@/components/ui/card'
+import { Sidebar } from '@/components/dashboard/sidebar'
+import { MessengerConversations } from './messenger-conversations'
+import { MessengerChat } from './messenger-chat'
+import { MessengerEmptyState } from './messenger-empty-state'
+import { GET_MY_COUNTERPARTIES } from '@/graphql/queries'
+import { MessageCircle } from 'lucide-react'
+
+interface Organization {
+  id: string
+  inn: string
+  name?: string
+  fullName?: string
+  type: 'FULFILLMENT' | 'SELLER' | 'LOGIST' | 'WHOLESALE'
+  address?: string
+  phones?: Array<{ value: string }>
+  emails?: Array<{ value: string }>
+  users?: Array<{ id: string, avatar?: string }>
+  createdAt: string
+}
+
+export function MessengerDashboard() {
+  const [selectedCounterparty, setSelectedCounterparty] = useState<string | null>(null)
+  
+  const { data: counterpartiesData, loading: counterpartiesLoading } = useQuery(GET_MY_COUNTERPARTIES)
+  const counterparties = counterpartiesData?.myCounterparties || []
+
+  const handleSelectCounterparty = (counterpartyId: string) => {
+    setSelectedCounterparty(counterpartyId)
+  }
+
+  const selectedCounterpartyData = counterparties.find((cp: Organization) => cp.id === selectedCounterparty)
+
+  // Если нет контрагентов, показываем заглушку
+  if (!counterpartiesLoading && counterparties.length === 0) {
+    return (
+      <div className="h-screen bg-gradient-smooth flex overflow-hidden">
+        <Sidebar />
+        <main className="flex-1 ml-56 px-6 py-4 overflow-hidden">
+          <div className="h-full w-full flex flex-col">
+            <div className="flex items-center justify-between mb-4 flex-shrink-0">
+              <div>
+                <h1 className="text-xl font-bold text-white mb-1">Мессенджер</h1>
+                <p className="text-white/70 text-sm">Общение с контрагентами</p>
+              </div>
+            </div>
+            
+            <div className="flex-1 overflow-hidden">
+              <Card className="glass-card h-full overflow-hidden p-6">
+                <MessengerEmptyState />
+              </Card>
+            </div>
+          </div>
+        </main>
+      </div>
+    )
+  }
+
+  return (
+    <div className="h-screen bg-gradient-smooth flex overflow-hidden">
+      <Sidebar />
+      <main className="flex-1 ml-56 px-6 py-4 overflow-hidden">
+        <div className="h-full w-full flex flex-col">
+          {/* Заголовок - фиксированная высота */}
+          <div className="flex items-center justify-between mb-4 flex-shrink-0">
+            <div>
+              <h1 className="text-xl font-bold text-white mb-1">Мессенджер</h1>
+              <p className="text-white/70 text-sm">Общение с контрагентами</p>
+            </div>
+          </div>
+
+          {/* Основной контент - сетка из 2 колонок */}
+          <div className="flex-1 overflow-hidden">
+            <div className="grid grid-cols-[350px_1fr] gap-4 h-full">
+              {/* Левая колонка - список контрагентов */}
+              <Card className="glass-card h-full overflow-hidden p-4">
+                <MessengerConversations
+                  counterparties={counterparties}
+                  loading={counterpartiesLoading}
+                  selectedCounterparty={selectedCounterparty}
+                  onSelectCounterparty={handleSelectCounterparty}
+                />
+              </Card>
+
+              {/* Правая колонка - чат */}
+              <Card className="glass-card h-full overflow-hidden">
+                {selectedCounterparty && selectedCounterpartyData ? (
+                  <MessengerChat counterparty={selectedCounterpartyData} />
+                ) : (
+                  <div className="flex items-center justify-center h-full">
+                    <div className="text-center">
+                      <div className="w-16 h-16 bg-white/10 rounded-full flex items-center justify-center mx-auto mb-4">
+                        <MessageCircle className="h-8 w-8 text-white/40" />
+                      </div>
+                      <p className="text-white/60 text-lg mb-2">Выберите контрагента</p>
+                      <p className="text-white/40 text-sm">
+                        Начните беседу с одним из ваших контрагентов
+                      </p>
+                    </div>
+                  </div>
+                )}
+              </Card>
+            </div>
+          </div>
+        </div>
+      </main>
+    </div>
+  )
+}