Описание изменений

frontend/src/components/chat/MessageThread.vue

@@ -1,28 +1,34 @@
 <template>
-  <div class="message-thread" ref="threadContainer">
-    <div v-if="loading" class="loading">Загрузка сообщений...</div>
+  <div v-if="authStore.isAuthenticated">
+    <div class="message-thread" ref="threadContainer">
+      <div v-if="loading" class="loading">Загрузка сообщений...</div>
 
-    <div v-else-if="messages.length === 0" class="empty-thread">
-      <p>Нет сообщений. Начните диалог, отправив сообщение.</p>
-    </div>
+      <div v-else-if="messages.length === 0" class="empty-thread">
+        <p>Нет сообщений. Начните диалог, отправив сообщение.</p>
+      </div>
 
-    <div v-else class="messages">
-      <div v-for="message in messages" :key="message.id" :class="['message', message.sender_type]">
-        <div class="message-content">{{ message.content }}</div>
-        <div class="message-meta">
-          <span class="time">{{ formatTime(message.created_at) }}</span>
-          <span v-if="message.channel" class="channel">
-            {{ channelName(message.channel) }}
-          </span>
+      <div v-else class="messages">
+        <div v-for="message in messages" :key="message.id" :class="['message', message.sender_type]">
+          <div class="message-content">{{ message.content }}</div>
+          <div class="message-meta">
+            <span class="time">{{ formatTime(message.created_at) }}</span>
+            <span v-if="message.channel" class="channel">
+              {{ channelName(message.channel) }}
+            </span>
+          </div>
         </div>
       </div>
     </div>
   </div>
+  <div v-else class="connect-wallet-prompt">
+    <p>Пожалуйста, подключите кошелек для просмотра сообщений</p>
+  </div>
 </template>
 
 <script setup>
 import { ref, onMounted, watch, nextTick, defineExpose } from 'vue';
 import axios from 'axios';
+import { useAuthStore } from '@/stores/auth'
 
 const props = defineProps({
   conversationId: {
@@ -34,6 +40,7 @@ const props = defineProps({
 const messages = ref([]);
 const loading = ref(true);
 const threadContainer = ref(null);
+const authStore = useAuthStore()
 
 // Загрузка сообщений диалога
 const fetchMessages = async () => {
@@ -104,6 +111,13 @@ watch(
   }
 );
 
+// Следим за изменением статуса аутентификации
+watch(() => authStore.isAuthenticated, (isAuthenticated) => {
+  if (!isAuthenticated) {
+    messages.value = []; // Очищаем сообщения при отключении
+  }
+});
+
 // Загрузка сообщений при монтировании компонента
 onMounted(() => {
   if (props.conversationId) {
@@ -191,4 +205,10 @@ defineExpose({
   border-radius: 3px;
   background-color: #f0f0f0;
 }
+
+.connect-wallet-prompt {
+  text-align: center;
+  padding: 2rem;
+  color: #666;
+}
 </style>