chore: improve UI/UX regarding Convex test

Author: NamesMT

apps/backend-convex/convex/crons.ts

@@ -5,7 +5,7 @@ const crons = cronJobs()
 
 crons.interval(
   'clear tasks table',
-  { minutes: 10 }, // every 10 minutes
+  { hours: 1 },
   internal.tasks.clearAll,
 )
 

apps/backend-convex/convex/tasks.ts

@@ -1,5 +1,5 @@
 import { MINUTE, RateLimiter } from '@convex-dev/rate-limiter'
-import { v } from 'convex/values'
+import { ConvexError, v } from 'convex/values'
 import { components } from './_generated/api'
 import { internalMutation, mutation, query } from './_generated/server'
 
@@ -21,7 +21,7 @@ export const add = mutation({
   handler: async (ctx, args) => {
     const userIdentity = await ctx.auth.getUserIdentity()
     if (userIdentity === null)
-      throw new Error('Not authenticated')
+      throw new ConvexError({ msg: 'Not authenticated' })
 
     await rateLimiter.limit(ctx, 'addTask', { key: userIdentity.subject, throws: true })
 

apps/frontend/app/components/ConvexIntegrationTest.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { api } from 'backend-convex/convex/_generated/api'
+import { ConvexError } from 'convex/values'
 
 const toast = useToast()
 const { $apiClient } = useNuxtApp()
@@ -15,7 +16,7 @@ async function addTask() {
   await mutateAddTask({ text: taskInputRef.value })
     .then((r) => {
       if ('error' in r && r.error)
-        return toast.add({ severity: 'error', detail: r.error.message, life: 10000 })
+        return toast.add({ severity: 'error', detail: r.error instanceof ConvexError ? r.error.data.msg : r.error.message, life: 10000 })
 
       taskInputRef.value = ''
     })
@@ -38,7 +39,7 @@ async function testConvexViaBackendTasksCTA() {
     <div>
       {{ $t('components.convexIntegrationTest.configuredUrl') }}: <code class="rounded bg-gray-100 px-1 py-0.5 text-base dark:bg-gray-800">{{ convexClient.client.url }}</code>
     </div>
-    <div>{{ $t('components.convexIntegrationTest.authInfo') }}: <pre class="max-w-full w-full overflow-x-auto rounded bg-black p-2 px-4 text-left text-xs text-white">{{ authInfo ?? 'Not authenticated' }}</pre></div>
+    <div>{{ $t('components.convexIntegrationTest.authenticated') }}: <code class="rounded bg-gray-100 px-1 py-0.5 text-base dark:bg-gray-800">{{ Boolean(authInfo) }}</code></div>
   </div>
   <div class="max-w-md w-full flex flex-col gap-5">
     <IftaLabel class="w-full">
@@ -51,7 +52,7 @@ async function testConvexViaBackendTasksCTA() {
     <h3 class="mb-2 text-lg font-semibold">
       {{ $t('components.convexIntegrationTest.tasksList.title') }}
     </h3>
-    <ul v-if="tasks && tasks.length > 0" class="list-disc rounded-md bg-gray-50 p-3 pl-5 space-y-1 dark:bg-gray-800">
+    <ul v-if="tasks && tasks.length > 0" class="list-disc rounded-md bg-gray-50 p-3 pl-5 text-left space-y-1 dark:bg-gray-800">
       <li v-for="task in tasks" :key="task._id" class="text-sm">
         {{ task.text }}
       </li>

apps/frontend/package.json

@@ -41,6 +41,7 @@
     "backend-convex": "workspace:*",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "convex": "^1.24.8",
     "convex-nuxt": "0.0.7",
     "dayjs": "^1.11.13",
     "destr": "^2.0.5",

i18n.lock

@@ -6,7 +6,7 @@ checksums:
     components.convexIntegrationTest.addTask.label: 94bfce6a5916c8955cea8d04ad41c10e
     components.convexIntegrationTest.addTask.placeholder: cfe9cb319a1f23515f7c2215dba202a3
     components.convexIntegrationTest.configuredUrl: ca306d17f0a8f6bd7e0b9b2efcf23fe7
-    components.convexIntegrationTest.authInfo: ae504fa548d6625c01f70b259601c382
+    components.convexIntegrationTest.authenticated: 7aeaface3edc0f5dca2c8ebd6c7e1974
     components.convexIntegrationTest.tasksList.empty: 353f149e9225b37a2651116189d0bb78
     components.convexIntegrationTest.tasksList.title: efde951ded884b7dbf0f81e45d93a8f9
     components.convexIntegrationTest.testBackendButton.fetchTasks: 9f58d5b60b733446f4620c944400c102

locals/locales/src/sheets/frontend/i18n.csv

@@ -2,7 +2,7 @@ KEY,Description,en,es,fr,ru,vi,zh-CN
 components.convexIntegrationTest.addTask.label,,Add task entry (press enter),Añadir tarea (pulsar enter),Ajouter une tâche (appuyer sur Entrée),Добавить задачу (нажмите Enter),Thêm mục công việc (nhấn enter),添加任务条目（按回车键）
 components.convexIntegrationTest.addTask.placeholder,,Enter new task...,Introducir nueva tarea...,Entrez une nouvelle tâche...,Введите новую задачу...,Nhập công việc mới...,输入新任务...
 components.convexIntegrationTest.configuredUrl,,Convex URL,URL de Convex,URL Convex,URL Convex,URL Convex,Convex URL
-components.convexIntegrationTest.authInfo,,Convex Auth Info,Información de autenticación de Convex,Informations d'authentification Convex,Информация об аутентификации Convex,Thông tin xác thực Convex,Convex 认证信息
+components.convexIntegrationTest.authenticated,,Convex Authenticated,Convex autenticado,Authentifié par Convex,Аутентифицировано через Convex,Đã xác thực Convex,Convex 已认证
 components.convexIntegrationTest.tasksList.empty,,No tasks yet.,Aún no hay tareas.,Aucune tâche pour le moment.,Задач пока нет.,Chưa có công việc nào.,暂无任务。
 components.convexIntegrationTest.tasksList.title,,Tasks,Tareas,Tâches,Задачи,Công việc,任务列表
 components.convexIntegrationTest.testBackendButton.fetchTasks,,Test Convex integration with `backend` (fetch tasks),Probar integración de Convex con `backend` (obtener tareas),Tester l'intégration de Convex avec `backend` (récupérer les tâches),Тестировать интеграцию Convex с `backend` (получить задачи),Kiểm tra tích hợp Convex với `backend` (lấy công việc),测试Convex与`backend`的集成（获取任务）