dashboard: enhance error/success messages

packages/dashboard/src/components/AlertBar.svelte

@@ -19,7 +19,8 @@
 
   let isHidden = false
   $: {
-    if (flash) {
+    isHidden = false
+    if (flash && message) {
       setTimeout(() => {
         isHidden = true
       }, 5000)

packages/dashboard/src/pocketbase-client/PocketbaseClient.ts

@@ -165,7 +165,7 @@ export const createPocketbaseClient = (config: PocketbaseClientConfig) => {
     )
 
   const parseError = (e: Error): string[] => {
-    if (!(e instanceof ClientResponseError)) return [e.message]
+    if (!(e instanceof ClientResponseError)) return [`${e}`]
     if (e.data.message && keys(e.data.data).length === 0)
       return [e.data.message]
     return map(e.data.data, (v, k) => (v ? v.message : undefined)).filter(

packages/dashboard/src/routes/(app)/instances/[instanceId]/rename/+page.svelte

@@ -20,10 +20,15 @@
   // Controls visibility of an error message
   let errorMessage = ''
 
+  let successMessage = ''
+
   // TODO: What are the limits for this?
   const onRename = (e: Event) => {
     e.preventDefault()
 
+    errorMessage = ''
+    successMessage = ''
+
     // Disable the button to prevent double submissions
     isButtonDisabled = true
 
@@ -43,9 +48,11 @@
           subdomain: instanceNameValidation,
         },
       })
-        .then(() => 'saved')
+        .then(() => {
+          successMessage = 'Instance renamed successfully'
+        })
         .catch((error) => {
-          errorMessage = error.message
+          errorMessage = client().parseError(error).join('\n')
         })
     }
 
@@ -54,7 +61,10 @@
   }
 </script>
 
-<CardHeader documentation={`/docs/rename-instance`}>Rename Instance</CardHeader>
+<div class="max-w-lg">
+  <CardHeader documentation={`/docs/rename-instance`}
+    >Rename Instance</CardHeader
+  >
 
   <p class="mb-8">
     Renaming your instance will cause it to become <strong class="text-error"
@@ -63,6 +73,7 @@
     else choose it.
   </p>
 
+  <AlertBar message={successMessage} type="success" flash />
   <AlertBar message={errorMessage} type="error" />
 
   <form
@@ -93,3 +104,4 @@
       }
     }
   </style>
+</div>

packages/dashboard/src/routes/(app)/instances/[instanceId]/version/+page.svelte

@@ -18,11 +18,15 @@
 
   // Controls visibility of an error message
   let errorMessage = ''
+  let successMessage = ''
 
   // Update the version number
   const handleSave = async (e: Event) => {
     e.preventDefault()
 
+    errorMessage = ''
+    successMessage = ''
+
     // Disable the button to prevent double submissions
     isButtonDisabled = true
 
@@ -41,7 +45,7 @@
           fields: { version: selectedVersion },
         })
         .then(() => {
-          return 'saved'
+          successMessage = 'Version updated successfully'
         })
         .catch((error) => {
           errorMessage = error.message
@@ -73,6 +77,7 @@
   > of PocketBase.
 </div>
 
+<AlertBar message={successMessage} type="success" flash />
 <AlertBar message={errorMessage} type="error" />
 
 <form

packages/pockethost/src/common/pocketbase-client-helpers/RestHelper.ts

@@ -1,12 +1,6 @@
 import Ajv, { JSONSchemaType } from 'ajv'
 import type { JsonObject } from 'type-fest'
-import {
-  ClientResponseError,
-  LoggerService,
-  PocketBase,
-  RestCommands,
-  RestMethods,
-} from '..'
+import { LoggerService, PocketBase, RestCommands, RestMethods } from '..'
 
 export type RestHelperConfig = {
   client: PocketBase
@@ -55,18 +49,9 @@ export const createRestHelper = (config: RestHelperConfig) => {
 
       dbg({ url, options })
 
-      try {
       const res = await client.send(url, options)
       dbg(res)
       return res
-      } catch (e) {
-        if (e instanceof ClientResponseError) {
-          error(`REST error: ${e.originalError}`)
-          throw e.originalError
-        }
-        error(`REST error: ${e}`)
-        throw e
-      }
     }
   }