Add toast error

app.d.ts

@@ -0,0 +1,5 @@
+import { $Fetch } from 'ofetch'
+
+declare global {
+    var $fetch: $Fetch
+}

app.vue

@@ -9,13 +9,28 @@
 </template>
 
 <script setup lang="ts">
+const toast = useToast()
+
 const { appTheme } = useAppTheme()
 useHead({
     htmlAttrs: {
         class: [appTheme],
     },
     title: 'DistApp',
 })
+
+globalThis.$fetch = globalThis.$fetch.create({
+    onResponseError(response) {
+        if (!response.response.ok) {
+            toast.add({
+                severity: 'error',
+                summary: 'Error',
+                detail: normalizeError(response),
+                life: 3000,
+            })
+        }
+    }
+})
 </script>
 
 <style lang="scss">

components/BottomMenu.vue

@@ -20,7 +20,7 @@ const cookie = useCookie(cookieAuthKey)
 const cookiePayload = cookie.value ? decodeJwt(cookie.value) : undefined
 const userEmail = cookiePayload?.email?.toString()
 const signout = () => {
-    if (process.client) {
+    if (import.meta.client) {
         const userTokens = useLocalStorage<UserTokenInfo[]>(userTokensKey, [])
         try {
             if (cookie.value) {
@@ -30,7 +30,7 @@ const signout = () => {
         } catch (e) {
             console.error('Error decode on signout', e)
         }
-        cookie.value = userTokens.value.find(e => new Boolean(e))?.token
+        cookie.value = userTokens.value.find(e => e ? true : false)?.token
         navigateTo({
             name: 'index',
         })

utils/showErrorAlert.ts

@@ -8,7 +8,10 @@ export function normalizeError(error: FetchContext | FetchError): string {
             return undefined
         }
     }
-    const message = error.response?._data?.message || error.response?.statusText || getFetchError()?.data?.message || 'Unexpected happen'
+    const message: string = error.response?._data?.message || error.response?.statusText || getFetchError()?.data?.message || 'Unexpected happen'
+    if (message.includes(`undefined (reading 'userId')`)) {
+        return 'Unauthorized. Try login again'
+    }
     return message
 }