hereconnect/apps/frontend/src/views/PublicChatView.vue

<template>
  <LayoutWithTabs>
    <MetaHead>
      <title>Чат — НаСвязи</title>
      <meta
        name="description"
        content="Чат QR-кода. Безопасная и конфиденциальная связь для решения всех вопросов"
      />
    </MetaHead>

    <div class="flex flex-col min-h-full">
      <!-- Основной контент -->
      <main class="flex-grow flex flex-col">
        <section class="flex flex-col flex-grow max-w-prose w-full mx-auto">
          <ChatComponent userRole="guest" :qr_code_uri="qr_code_uri" :chat="chat">
            <template #endOfMessages="{ count, lastMessage }">
              <!-- Уведомление, если гость отправил только одно сообщение -->
              <div
                v-if="count === 1 && lastMessage && lastMessage.from === 'guest'"
                class="flex flex-col items-center justify-center text-center bg-gray-50 border border-gray-200 rounded-lg shadow-md p-6 mt-6"
              >
                <p class="text-gray-700 font-medium text-lg">Ваше сообщение отправлено.</p>
                <p class="text-gray-600 mt-2">
                  Вы можете написать ещё одно сообщение или подождать ответа.
                </p>
              </div>
            </template>
          </ChatComponent>
        </section>
      </main>

      <!-- Футер -->
      <!--    <footer class="bg-gray-100 text-center py-4 border-t text-sm text-gray-700">-->
      <!--      <p><a href="/create" class="underline underline-offset-2">Создайте свой QR‑код</a>.</p>-->
      <!--      <p class="mt-1">-->
      <!--        Сделайте НаСвязи удобнее. Будем рады вашей&nbsp;<a href="/donate" class="underline underline-offset-2"-->
      <!--          >поддержке</a-->
      <!--        >.-->
      <!--      </p>-->
      <!--    </footer>-->
    </div>
  </LayoutWithTabs>
</template>

<script setup lang="ts">
import type { MessageDocument } from '@hereconnect/types'
import ChatComponent from '@/components/ChatComponent.vue'
defineProps<{ qr_code_uri: MessageDocument['qr_code_uri']; chat: MessageDocument['chat'] }>()
</script>