feat(xo-6): add 404 page

vatesfr · Nov 26, 2024 · 1be5be5 · 1be5be5
1 parent 9676932
commit 1be5be5
Show file tree

Hide file tree

Showing 16 changed files with 191 additions and 5 deletions.
diff --git a/@xen-orchestra/lite/src/locales/de.json b/@xen-orchestra/lite/src/locales/de.json
@@ -137,7 +137,6 @@
   "ok": "OK",
   "on-object": "auf {object}",
   "or": "Oder",
-  "page-not-found": "Diese Seite wurde nicht gefunden…",
   "password": "Passwort",
   "password-invalid": "Ungültiges Passwort",
   "pause": "Pausieren",

diff --git a/@xen-orchestra/lite/src/locales/en.json b/@xen-orchestra/lite/src/locales/en.json
@@ -139,7 +139,6 @@
   "ok": "OK",
   "on-object": "on {object}",
   "or": "Or",
-  "page-not-found": "This page is not to be found…",
   "password": "Password",
   "password-invalid": "Password invalid",
   "pause": "Pause",

diff --git a/@xen-orchestra/lite/src/locales/fa.json b/@xen-orchestra/lite/src/locales/fa.json
@@ -137,7 +137,6 @@
   "ok": "اوکی",
   "on-object": "در {object}",
   "or": "یا",
-  "page-not-found": "این صفحه پیدا نمی شود…",
   "password": "کلمه عبور",
   "password-invalid": "کلمه عبور اشتباه است",
   "pause": "توقف",

diff --git a/@xen-orchestra/lite/src/locales/fr.json b/@xen-orchestra/lite/src/locales/fr.json
@@ -139,7 +139,6 @@
   "ok": "OK",
   "on-object": "sur {object}",
   "or": "Ou",
-  "page-not-found": "Cette page est introuvable…",
   "password": "Mot de passe",
   "password-invalid": "Mot de passe incorrect",
   "pause": "Pause",

diff --git a/@xen-orchestra/web-core/lib/assets/not-found.svg b/@xen-orchestra/web-core/lib/assets/not-found.svg
diff --git a/@xen-orchestra/web-core/lib/components/state-hero/VtsPageNotFoundHero.vue b/@xen-orchestra/web-core/lib/components/state-hero/VtsPageNotFoundHero.vue
@@ -0,0 +1,30 @@
+<template>
+  <VtsStateHero class="vts-page-not-found-hero" image="not-found" :type>
+    <span class="numeric">404</span><br />
+    {{ $t('page-not-found') }}
+  </VtsStateHero>
+</template>
+
+<script lang="ts" setup>
+import VtsStateHero, { type StateHeroType } from '@core/components/state-hero/VtsStateHero.vue'
+
+defineProps<{
+  type: StateHeroType
+}>()
+</script>
+
+<style lang="postcss" scoped>
+.vts-page-not-found-hero {
+  text-align: center;
+  margin-top: 4rem;
+
+  .numeric {
+    color: var(--color-info-txt-base);
+    font-size: 9.6rem;
+    font-weight: 900;
+    letter-spacing: 1em;
+    line-height: 100%;
+    margin-right: -1em;
+  }
+}
+</style>
diff --git a/@xen-orchestra/web-core/lib/components/state-hero/VtsStateHero.vue b/@xen-orchestra/web-core/lib/components/state-hero/VtsStateHero.vue
@@ -17,7 +17,7 @@ export type StateHeroType = 'page' | 'card' | 'panel'
 const props = defineProps<{
   type: StateHeroType
   busy?: boolean
-  image?: 'no-result' | 'under-construction' | 'no-data' | 'no-selection' | 'error' // TODO: 'offline' |  'not-found' | 'all-good' | 'all-done''
+  image?: 'no-result' | 'under-construction' | 'no-data' | 'no-selection' | 'error' | 'not-found' // TODO: 'offline' | 'all-good' | 'all-done''
 }>()
 
 const slots = defineSlots<{

diff --git a/@xen-orchestra/web-core/lib/locales/de.json b/@xen-orchestra/web-core/lib/locales/de.json
@@ -29,6 +29,7 @@
   "network": "Netzwerk",
   "object-not-found": "Objekt {id} wurde nicht gefunden…",
   "open-console-in-new-tab": "Konsole in neuem Reiter öffnen",
+  "page-not-found": "Diese Seite wurde nicht gefunden…",
   "patches": "Patches",
   "power-on-vm-for-console": "Konsole ist nach Start der VM verfügbar",
   "power-on-host-for-console": "Konsole ist nach Start des Hosts verfügbar",

diff --git a/@xen-orchestra/web-core/lib/locales/en.json b/@xen-orchestra/web-core/lib/locales/en.json
@@ -58,6 +58,7 @@
   "object-not-found": "Object {id} can't be found…",
   "open-console-in-new-tab": "Open console in new tab",
   "other": "Other",
+  "page-not-found": "This page is not to be found…",
   "patches": "Patches",
   "power-on-vm-for-console": "Power on your VM to access its console",
   "power-on-host-for-console": "Power on your host to access its console",

diff --git a/@xen-orchestra/web-core/lib/locales/fa.json b/@xen-orchestra/web-core/lib/locales/fa.json
@@ -40,6 +40,7 @@
   "master": "میزبان اصلی",
   "network": "شبکه",
   "open-console-in-new-tab": "باز کردن کنسول در برگه جدید",
+  "page-not-found": "این صفحه پیدا نمی شود…",
   "patches": "وصله ها",
   "power-on-vm-for-console": "ماشین مجازی خود را روشن کنید تا به کنسول آن دسترسی داشته باشید",
   "power-on-host-for-console": "هاست خود را برای دسترسی به کنسول آن روشن کنید",

diff --git a/@xen-orchestra/web-core/lib/locales/fr.json b/@xen-orchestra/web-core/lib/locales/fr.json
@@ -58,6 +58,7 @@
   "object-not-found": "L'objet {id} est introuvable…",
   "open-console-in-new-tab": "Ouvrir la console dans un nouvel onglet",
   "other": "Autre",
+  "page-not-found": "Cette page est introuvable…",
   "patches": "Patches",
   "power-on-vm-for-console": "Allumez votre VM pour accéder à sa console",
   "power-on-host-for-console": "Allumez votre hôte pour accéder à sa console",

diff --git a/@xen-orchestra/web/src/locales/en.json b/@xen-orchestra/web/src/locales/en.json
@@ -1,6 +1,7 @@
 {
   "account-organization-more": "Account, organization & more…",
   "available": "Available",
+  "back-site-dashboard": "Go back to your site dashboard",
   "backup-issues": "Backup issues",
   "backups": "Backups",
   "backup-repository": "Backup repository (local, NFS, SMB)",

diff --git a/@xen-orchestra/web/src/locales/fr.json b/@xen-orchestra/web/src/locales/fr.json
@@ -1,6 +1,7 @@
 {
   "account-organization-more": "Compte, organisation et plus…",
   "available": "Disponible",
+  "back-site-dashboard": "Revenez au tableau de bord de votre site",
   "backup-issues": "Problèmes de sauvegarde",
   "backups": "Sauvegardes",
   "backup-repository": "Dépot de sauvegarde (local, NFS, SMB)",

diff --git a/@xen-orchestra/web/src/pages/[...path].vue b/@xen-orchestra/web/src/pages/[...path].vue
@@ -0,0 +1,23 @@
+<template>
+  <div class="page-not-found">
+    <VtsPageNotFoundHero type="page" />
+    <RouterLink class="link" to="/">
+      {{ $t('back-site-dashboard') }}
+    </RouterLink>
+  </div>
+</template>
+
+<script setup lang="ts">
+import VtsPageNotFoundHero from '@core/components/state-hero/VtsPageNotFoundHero.vue'
+</script>
+
+<style lang="postcss" scoped>
+.page-not-found {
+  display: flex;
+  margin-bottom: 4rem;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 2rem;
+}
+</style>
diff --git a/@xen-orchestra/web/typed-router.d.ts b/@xen-orchestra/web/typed-router.d.ts
@@ -19,6 +19,7 @@ declare module 'vue-router/auto-routes' {
    */
   export interface RouteNamedMap {
     '/': RouteRecordInfo<'/', '/', Record<never, never>, Record<never, never>>,
+    '/[...path]': RouteRecordInfo<'/[...path]', '/:path(.*)', { path: ParamValue<true> }, { path: ParamValue<false> }>,
     '/dev/': RouteRecordInfo<'/dev/', '/dev', Record<never, never>, Record<never, never>>,
     '/dev/colors': RouteRecordInfo<'/dev/colors', '/dev/colors', Record<never, never>, Record<never, never>>,
     '/dev/token': RouteRecordInfo<'/dev/token', '/dev/token', Record<never, never>, Record<never, never>>,

diff --git a/CHANGELOG.unreleased.md b/CHANGELOG.unreleased.md
@@ -14,6 +14,7 @@
 - **XO 6**:
   - [VM,Host/Console] Display _Console Clipboard_ and _Console Actions_ (PR [#8125](https://github.com/vatesfr/xen-orchestra/pull/8125))
   - [i18n] Add Czech translation (contribution made by [@p-bo](https://github.com/p-bo)) (PR [#8099](https://github.com/vatesfr/xen-orchestra/pull/8099))
+  - Add 404 page (PR [#8145](https://github.com/vatesfr/xen-orchestra/pull/8145))
 
 ### Bug fixes