From bcdc7273aad0e313ce6af0cbd815cdc40e6b7072 Mon Sep 17 00:00:00 2001
From: axolotle <nchesnais@mailoo.org>
Date: Mon, 6 Sep 2021 21:14:14 +0200
Subject: [PATCH] add simplified breadcrumb as document title

---
 app/src/i18n/locales/en.json |  4 +++-
 app/src/router/index.js      | 27 +++++++++++++++++++++++++++
 app/src/router/routes.js     | 17 ++++++++++++++---
 3 files changed, 44 insertions(+), 4 deletions(-)

diff --git a/app/src/i18n/locales/en.json b/app/src/i18n/locales/en.json
index 607c6fa9..f53e4c7c 100644
--- a/app/src/i18n/locales/en.json
+++ b/app/src/i18n/locales/en.json
@@ -319,7 +319,8 @@
     "port": "Port",
     "ports": "Ports",
     "postinstall": {
-        "force": "Force the post-install"
+        "force": "Force the post-install",
+        "title": "Postinstall"
     },
     "postinstall_domain": "This is the first domain name linked to your YunoHost server, but also the one which will be used by your server's users to access the authentication portal. Accordingly, it will be visible by everyone, so choose it carefully.",
     "postinstall_intro_1": "Congratulations! YunoHost has been successfully installed.",
@@ -497,6 +498,7 @@
     },
     "wrong_password": "Wrong password",
     "yes": "Yes",
+    "yunohost_admin": "YunoHost Admin",
     "certificate_alert_not_valid": "CRITICAL: Current certificate is not valid! HTTPS won't work at all!",
     "certificate_alert_selfsigned": "WARNING: Current certificate is self-signed. Browsers will display a spooky warning to new visitors!",
     "certificate_alert_letsencrypt_about_to_expire": "Current certificate is about to expire. It should soon be renewed automatically.",
diff --git a/app/src/router/index.js b/app/src/router/index.js
index ade0eb37..6cb71d75 100644
--- a/app/src/router/index.js
+++ b/app/src/router/index.js
@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
+import i18n from '@/i18n'
 import routes from './routes'
 import store from '@/store'
 
@@ -39,4 +40,30 @@ router.beforeEach((to, from, next) => {
   }
 })
 
+router.afterEach((to, from) => {
+  // Display a simplified breadcrumb as the document title.
+  const routeParams = to.params
+  let breadcrumb = to.meta.breadcrumb
+  if (breadcrumb.length === 0) {
+    breadcrumb = [to.name]
+  } else if (breadcrumb.length > 2) {
+    breadcrumb = breadcrumb.slice(breadcrumb.length - 2)
+  }
+
+  const title = breadcrumb.map(name => {
+    const route = routes.find(route => route.name === name)
+    const { trad, param } = route ? route.meta.args : {}
+    // if a traduction key string has been given and we also need to pass
+    // the route param as a variable.
+    if (trad && param) {
+      return i18n.t(trad, { [param]: routeParams[param] })
+    } else if (trad) {
+      return i18n.t(trad)
+    }
+    return routeParams[param]
+  }).reverse().join(' / ')
+
+  document.title = `${title} | ${i18n.t('yunohost_admin')}`
+})
+
 export default router
diff --git a/app/src/router/routes.js b/app/src/router/routes.js
index 59c99865..c4042f82 100644
--- a/app/src/router/routes.js
+++ b/app/src/router/routes.js
@@ -18,14 +18,21 @@ const routes = [
     path: '/',
     component: Home,
     // Leave the empty breadcrumb as it is used by the animated transition to know which way to go
-    meta: { breadcrumb: [] }
+    meta: {
+      args: { trad: 'home' },
+      breadcrumb: []
+    }
   },
 
   {
     name: 'login',
     path: '/login',
     component: Login,
-    meta: { noAuth: true, breadcrumb: [] }
+    meta: {
+      noAuth: true,
+      args: { trad: 'login' },
+      breadcrumb: []
+    }
   },
 
   /* ───────────────╮
@@ -36,7 +43,11 @@ const routes = [
     path: '/postinstall',
     component: () => import(/* webpackChunkName: "views/post-install" */ '@/views/PostInstall'),
     // Leave the breadcrumb
-    meta: { noAuth: true, breadcrumb: [] }
+    meta: {
+      noAuth: true,
+      args: { trad: 'postinstall.title' },
+      breadcrumb: []
+     }
   },
 
   /* ───────╮