fix: handle errors

client/components/DatabaseDetail.vue

@@ -78,19 +78,24 @@ function editDocument(document: any) {
   selectedDocument.value = { ...document }
 }
 
-async function saveDocument(document: any) {
-  await rpc.createDocument(props.collection, document)
-  editing.value = false
-  selectedDocument.value = undefined
-  documents.value = await rpc.listDocuments(props.collection, pagination)
-}
+async function saveDocument(document: any, create = true) {
+  const method = create ? rpc.createDocument : rpc.updateDocument
+  const newDocument = await method(props.collection, document)
+  if (newDocument?.error)
+    return alert(newDocument.error.message)
 
-async function updateDocument() {
-  // TODO: validate & show errors
-  await rpc.updateDocument(props.collection, selectedDocument.value)
-  editing.value = false
-  selectedDocument.value = undefined
+  if (create) {
+    if (!documents.value.length) {
       documents.value = await rpc.listDocuments(props.collection, pagination)
+      return discardEditing()
+    }
+    documents.value.push({ _id: newDocument.insertedId, ...document })
+  }
+  else {
+    const index = documents.value.findIndex((doc: any) => doc._id === newDocument.value._id)
+    documents.value[index] = document
+  }
+  discardEditing()
 }
 
 function discardEditing() {
@@ -99,8 +104,11 @@ function discardEditing() {
 }
 
 async function deleteDocument(document: any) {
-  rpc.deleteDocument(props.collection, document._id)
-  documents.value = await rpc.listDocuments(props.collection, pagination)
+  const newDocument = await rpc.deleteDocument(props.collection, document._id)
+  if (newDocument.deletedCount === 0)
+    return alert('Failed to delete document')
+
+  documents.value = documents.value.filter((doc: any) => doc._id !== document._id)
 }
 
 const copy = useCopy()
@@ -163,7 +171,7 @@ const copy = useCopy()
           <td class="actions">
             <div flex justify-center gap2 class="group">
               <template v-if="editing && selectedDocument._id === document._id">
-                <NIconButton icon="carbon-save" @click="updateDocument" />
+                <NIconButton icon="carbon-save" @click="saveDocument(selectedDocument, false)" />
                 <NIconButton icon="carbon-close" @click="discardEditing" />
               </template>
               <template v-else>

src/server-rpc/database.ts

@@ -1,4 +1,3 @@
-import { logger } from '@nuxt/kit'
 import mongoose from 'mongoose'
 import type { NuxtDevtoolsServerContext, ServerFunctions } from '../types'
 
@@ -10,24 +9,54 @@ export function setupDatabaseRPC({ options }: NuxtDevtoolsServerContext): any {
       return mongoose.connection.readyState
     },
     async createCollection(name: string) {
+      try {
         return await mongoose.connection.db.createCollection(name)
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
     async listCollections() {
+      try {
         return await mongoose.connection.db.listCollections().toArray()
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
     async getCollection(name: string) {
-      return mongoose.connection.db.collection(name)
+      try {
+        return await mongoose.connection.db.collection(name).findOne()
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
     async dropCollection(name: string) {
-      return await mongoose.connection.db.collection(name).drop()
+      try {
+        return await mongoose.connection.db.dropCollection(name)
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
 
     async createDocument(collection: string, data: any) {
       const { _id, ...rest } = data
+      try {
         return await mongoose.connection.db.collection(collection).insertOne(rest)
+      }
+      catch (error: any) {
+        return ErrorIT(error)
+      }
     },
     async countDocuments(collection: string) {
+      try {
         return await mongoose.connection.db.collection(collection).countDocuments()
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
     async listDocuments(collection: string, options: { page: number; limit: number } = { page: 1, limit: 10 }) {
       const skip = (options.page - 1) * options.limit
@@ -36,8 +65,13 @@ export function setupDatabaseRPC({ options }: NuxtDevtoolsServerContext): any {
         cursor.limit(options.limit)
       return await cursor.toArray()
     },
-    async getDocument(collection: string, document: {}) {
+    async getDocument(collection: string, document: any) {
+      try {
         return await mongoose.connection.db.collection(collection).findOne({ document })
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
     async updateDocument(collection: string, data: any) {
       const { _id, ...rest } = data
@@ -45,12 +79,25 @@ export function setupDatabaseRPC({ options }: NuxtDevtoolsServerContext): any {
         return await mongoose.connection.db.collection(collection).findOneAndUpdate({ _id: new mongoose.Types.ObjectId(_id) }, { $set: rest })
       }
       catch (error) {
-        logger.log(error)
-        return error
+        return ErrorIT(error)
       }
     },
     async deleteDocument(collection: string, id: string) {
+      try {
         return await mongoose.connection.db.collection(collection).deleteOne({ _id: new mongoose.Types.ObjectId(id) })
+      }
+      catch (error) {
+        return ErrorIT(error)
+      }
     },
   } satisfies Partial<ServerFunctions>
 }
+
+function ErrorIT(error: any) {
+  return {
+    error: {
+      message: error?.message,
+      code: error?.code,
+    },
+  }
+}

src/server-rpc/resource.ts

@@ -1,11 +1,10 @@
 import fs from 'fs-extra'
 import { resolve } from 'pathe'
-import mongoose from 'mongoose'
 import type { Collection, NuxtDevtoolsServerContext, Resource, ServerFunctions } from '../types'
 import { generateApiRoute, generateSchemaFile } from '../utils/schematics'
 import { capitalize, pluralize, singularize } from '../utils/formatting'
 
-export function setupResourceRPC({ nuxt }: NuxtDevtoolsServerContext): any {
+export function setupResourceRPC({ nuxt, rpc }: NuxtDevtoolsServerContext): any {
   return {
     // TODO: maybe separate functions
     async generateResource(collection: Collection, resources: Resource[]) {
@@ -45,8 +44,9 @@ export function setupResourceRPC({ nuxt }: NuxtDevtoolsServerContext): any {
       }
 
       // create collection if not exists
-      if (!mongoose.connection.modelNames().includes(dbName))
-        await mongoose.connection.db.createCollection(plural)
+      const collections = await rpc.functions.listCollections()
+      if (!collections.find((c: any) => c.name === plural))
+        await rpc.functions.createCollection(plural)
     },
     async resourceSchema(collection: string) {
       // TODO: use magicast