From 0e31e9ab4fc1e89300a23a4f5da57b2c7a483112 Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Fri, 24 Sep 2021 00:13:25 +0100
Subject: [PATCH] :sparkles: Redirects not-found pages to the 404 route

---
 src/router.js | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/router.js b/src/router.js
index a1bdd95b..e76efe42 100644
--- a/src/router.js
+++ b/src/router.js
@@ -9,17 +9,17 @@ import Vue from 'vue';
 import Router from 'vue-router';
 import ProgressBar from 'rsup-progress';
 
-// Import views
+// Import views, that are not lazy-loaded
 import Home from '@/views/Home.vue';
 import Login from '@/views/Login.vue';
 import Workspace from '@/views/Workspace.vue';
 import Minimal from '@/views/Minimal.vue';
-import DownloadConfig from '@/views/DownloadConfig.vue';
 
 // Import helper functions, config data and defaults
 import { isAuthEnabled, isLoggedIn, isGuestAccessEnabled } from '@/utils/Auth';
 import { config } from '@/utils/ConfigHelpers';
 import { metaTagData, startingView, routePaths } from '@/utils/defaults';
+import ErrorHandler from '@/utils/ErrorHandler';
 
 Vue.use(Router);
 const progress = new ProgressBar({ color: 'var(--progress-bar)' });
@@ -102,16 +102,32 @@ const router = new Router({
     { // The about app page
       path: routePaths.about,
       name: 'about', // We lazy load the About page so as to not slow down the app
-      component: () => import(/* webpackChunkName: "about" */ './views/About.vue'),
+      component: () => import('./views/About.vue'),
       meta: makeMetaTags('About Dashy'),
     },
     { // The export config page
       path: routePaths.download,
       name: 'download',
-      component: DownloadConfig,
+      component: () => import('./views/DownloadConfig.vue'),
       props: config,
       meta: makeMetaTags('Download Config'),
     },
+    { // Page not found, any non-defined routes will land here
+      path: routePaths.notFound,
+      name: '404',
+      component: () => import('./views/404.vue'),
+      meta: makeMetaTags('404 Not Found'),
+      beforeEnter: (to, from, next) => {
+        if (to.redirectedFrom) { // Log error, if redirected here from another route
+          ErrorHandler(`Route not found: '${to.redirectedFrom}'`);
+        }
+        next();
+      },
+    },
+    { // Redirect any not-found routed to the 404 view
+      path: '*',
+      redirect: '/404',
+    },
   ],
 });