add not found handler

apps/frontend/src/components/QueryRender.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts" generic="R, E">
 import type { UseQueryReturnType } from '@tanstack/vue-query'
+import { ROUTE_NAMES } from '@/constants/routes'
 
 type Props = {
   query: UseQueryReturnType<R, E>
@@ -7,6 +8,7 @@ type Props = {
 
 const slots = defineSlots<{
   default?: (slotBindings: { data: R }) => void
+  notFound?: (slotBindings: { error: E; reload: typeof refetch }) => void
   error?: (slotBindings: { error: E; reload: typeof refetch }) => void
   loading?: () => void
 }>()
@@ -23,6 +25,28 @@ const { data, error, refetch, isSuccess, isError, isLoading } = query
       <ProgressSpinner styleClass="mt-4" />
     </div>
   </slot>
+
+  <slot
+    v-else-if="
+      isError &&
+      error &&
+      typeof error === 'object' &&
+      'error' in error &&
+      error.error === 'not_found'
+    "
+    name="notFound"
+    :error="error!"
+    :reload="refetch"
+  >
+    <template v-if="!slots.notFound">
+      Страница не найдена<br />
+      <RouterLink
+        :to="{ name: ROUTE_NAMES.HOME }"
+        class="underline text-blue-600 dark:text-blue-400"
+        >Перейти на главную</RouterLink
+      ></template
+    >
+  </slot>
   <slot v-else-if="isError" name="error" :error="error!" :reload="refetch">
     <template v-if="!slots.error">
       Ошибка загрузки данных:

apps/frontend/src/views/ReadQRCodeView.vue

@@ -11,7 +11,23 @@
   <div class="flex flex-col min-h-full">
     <main class="flex-grow flex items-center justify-center py-6 px-4 md:px-6 pt-safe-or-6">
       <section class="max-w-prose w-full flex flex-col gap-10">
-        <QueryRender :query #default="{ data: doc }">
+        <QueryRender :query>
+          <template #notFound="{ error }">
+            <template v-if="'reason' in error && error.reason === 'deleted'">
+              Этот QR-код был удален.
+            </template>
+            <template v-else-if="'reason' in error && error.reason === 'missing'">
+              Такой QR-код не существует.
+            </template>
+            <template v-else>QR-код не найден: его не существовало или он был удален.</template>
+            <br />
+            <RouterLink
+              :to="{ name: ROUTE_NAMES.HOME }"
+              class="underline text-blue-600 dark:text-blue-400"
+              >Перейти на главную</RouterLink
+            >
+          </template>
+          <template #default="{ data: doc }">
             <template v-for="action in doc.actions" :key="action">
               <ReadContactInfo
                 v-if="action === 'viewContactInfo' && doc.contactInfo"
@@ -19,6 +35,7 @@
               />
               <ReadMessageSender v-else-if="action === 'sendMessage'" :doc />
             </template>
+          </template>
         </QueryRender>
       </section>
     </main>
@@ -51,10 +68,10 @@ import { getQrCodeDocument } from '@/api/qrCode'
 import type { QRCodeDocument } from '@hereconnect/types'
 import QueryRender from '@/components/QueryRender.vue'
 import { Head as MetaHead } from '@unhead/vue/components'
+import { ROUTE_NAMES } from '@/constants/routes'
 
 const { qr_code_uri } = defineProps<{ qr_code_uri: string }>()
 
-// Хук для загрузки данных QR-кода
 const query = useQuery({
   queryKey: ['qrCodeData', qr_code_uri],
   queryFn: (): Promise<QRCodeDocument> => getQrCodeDocument(qr_code_uri),

apps/frontend/vite.config.ts

@@ -180,6 +180,7 @@ export default defineConfig(({ mode }) => {
       },
     },
     server: {
+      allowedHosts: ['hcqr.loc', 'hcqr-debug.loc'],
       proxy: {
         '/api': {
           target: process.env.VITE_PROXY_API_URL,