diff --git a/frontend/app.vue b/frontend/app.vue index 1eea4dd..f8d4c74 100644 --- a/frontend/app.vue +++ b/frontend/app.vue @@ -1,8 +1,10 @@ <script setup lang="ts"> +import { serializeError } from 'serialize-error' + const { loading: { clearLoading }, error: { errorModalVisible, error } } = useModal() const handleError = (err: Error) => { - error.value = err + error.value = serializeError(err) errorModalVisible.value = true clearLoading() } diff --git a/frontend/components/modal/Error.vue b/frontend/components/modal/Error.vue index d48502e..731298b 100644 --- a/frontend/components/modal/Error.vue +++ b/frontend/components/modal/Error.vue @@ -1,4 +1,6 @@ <script setup lang="ts"> +import { deserializeError } from 'serialize-error' + const { error: { errorModalVisible, error: modalError } } = useModal() const error = useError() const router = useRouter() @@ -26,7 +28,7 @@ const maybeGoBack = async () => { } const fullError = computed(() => { - const err = error.value ?? modalError.value + const err = error.value ?? deserializeError(modalError.value) if (err instanceof Error) { return { name: err.name ?? '', diff --git a/frontend/composables/useModal.ts b/frontend/composables/useModal.ts index 1e9b611..27e1ea8 100644 --- a/frontend/composables/useModal.ts +++ b/frontend/composables/useModal.ts @@ -1,4 +1,5 @@ import { type Ref } from 'vue' +import { type ErrorObject } from 'serialize-error' export const useModal = () => { const prefix = 'useModal' @@ -22,7 +23,7 @@ export const useModal = () => { // error const errorModalVisible = newModalVisibilityState('errorModalVisible') - const error = useState<Error>('errorModal.error') + const error = useState<ErrorObject>('errorModal.error') // loading const loadingSet = useState<Set<string>>(`${prefix}.loadingSet`, () => new Set<string>()) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 4722b88..bec86ab 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -11,6 +11,7 @@ "primeflex": "^3.3.1", "primeicons": "^6.0.1", "primevue": "^3.32.0", + "serialize-error": "^11.0.3", "uuid": "^9.0.0", "vue-i18n": "^9.5.0" }, @@ -15640,6 +15641,20 @@ "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", "dev": true }, + "node_modules/serialize-error": { + "version": "11.0.3", + "resolved": "https://registry.npmjs.org/serialize-error/-/serialize-error-11.0.3.tgz", + "integrity": "sha512-2G2y++21dhj2R7iHAdd0FIzjGwuKZld+7Pl/bTU6YIkrC2ZMbVUjm+luj6A6V34Rv9XfKJDKpTWu9W4Gse1D9g==", + "dependencies": { + "type-fest": "^2.12.2" + }, + "engines": { + "node": ">=14.16" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/serialize-javascript": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz", @@ -17273,7 +17288,6 @@ "version": "2.19.0", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz", "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==", - "dev": true, "engines": { "node": ">=12.20" }, @@ -30285,6 +30299,14 @@ } } }, + "serialize-error": { + "version": "11.0.3", + "resolved": "https://registry.npmjs.org/serialize-error/-/serialize-error-11.0.3.tgz", + "integrity": "sha512-2G2y++21dhj2R7iHAdd0FIzjGwuKZld+7Pl/bTU6YIkrC2ZMbVUjm+luj6A6V34Rv9XfKJDKpTWu9W4Gse1D9g==", + "requires": { + "type-fest": "^2.12.2" + } + }, "serialize-javascript": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz", @@ -31516,8 +31538,7 @@ "type-fest": { "version": "2.19.0", "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz", - "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==", - "dev": true + "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==" }, "typed-array-buffer": { "version": "1.0.0", diff --git a/frontend/package.json b/frontend/package.json index 11e6188..53b6056 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -44,6 +44,7 @@ "primeflex": "^3.3.1", "primeicons": "^6.0.1", "primevue": "^3.32.0", + "serialize-error": "^11.0.3", "uuid": "^9.0.0", "vue-i18n": "^9.5.0" }