Nikolay Tatarinov
adfdfd01c4
- Modified docker-compose.dev.yml to conditionally run npm install based on the presence of package-lock.json. - Upgraded Nuxt version in package-lock.json from 3.21.1 to 4.3.1 for enhanced features. - Enhanced ConfirmModal component with aria-modal attribute for better accessibility. - Updated MapErrorBoundary component's error message for clarity. - Added role and aria-label attributes to MapView and MapSearch components for improved screen reader support. - Refactored various components to manage focus behavior on modal close, enhancing user experience. - Improved ToastContainer styling for better responsiveness and visibility. - Updated layout components to include skip navigation links for improved accessibility.
34 lines
913 B
Vue
34 lines
913 B
Vue
<template>
|
|
<div class="relative h-full w-full">
|
|
<slot v-if="!caughtError" />
|
|
<div
|
|
v-else
|
|
class="absolute inset-0 z-[600] flex flex-col items-center justify-center gap-4 bg-base-200/95 p-8"
|
|
role="alert"
|
|
>
|
|
<p class="text-center text-lg font-medium">Map failed to load</p>
|
|
<p class="text-center text-sm text-base-content/80">
|
|
Something went wrong while loading the map. This can be due to a network or script error. You can try reloading the page.
|
|
</p>
|
|
<button type="button" class="btn btn-primary" @click="reload">
|
|
Reload page
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const caughtError = ref<Error | null>(null)
|
|
|
|
function reload() {
|
|
if (import.meta.client) {
|
|
window.location.reload()
|
|
}
|
|
}
|
|
|
|
onErrorCaptured((err) => {
|
|
caughtError.value = err
|
|
return true
|
|
})
|
|
</script>
|