From ac2dc00af2ebf505960844ae75c27602118c5c5f Mon Sep 17 00:00:00 2001
From: Derek Herman <derek.herman@xwp.co>
Date: Fri, 30 Jul 2021 19:59:05 -0700
Subject: [PATCH 1/5] Add @rollup/plugin-json to convert .json files to ES6
 modules

---
 package-lock.json | 9 +++++++++
 package.json      | 1 +
 rollup.config.js  | 2 ++
 3 files changed, 12 insertions(+)

diff --git a/package-lock.json b/package-lock.json
index 114cdd4..9dacdae 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1719,6 +1719,15 @@
         "fastq": "^1.6.0"
       }
     },
+    "@rollup/plugin-json": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/plugin-json/-/plugin-json-4.1.0.tgz",
+      "integrity": "sha512-yfLbTdNS6amI/2OpmbiBoW12vngr5NW2jCJVZSBEz+H5KfUJZ2M7sDjk0U6GOOdCWFVScShte29o9NezJ53TPw==",
+      "dev": true,
+      "requires": {
+        "@rollup/pluginutils": "^3.0.8"
+      }
+    },
     "@rollup/pluginutils": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-3.1.0.tgz",
diff --git a/package.json b/package.json
index 02e3ec1..f3a68b8 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "@babel/eslint-parser": "^7.14.4",
     "@babel/eslint-plugin": "^7.13.16",
     "@babel/preset-env": "^7.14.4",
+    "@rollup/plugin-json": "^4.1.0",
     "chokidar-cli": "^2.1.0",
     "eslint": "^7.27.0",
     "eslint-config-airbnb-base": "^14.2.1",
diff --git a/rollup.config.js b/rollup.config.js
index 7e5a1ea..8d9d7ad 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -17,6 +17,7 @@
 import css from 'rollup-plugin-import-css';
 import generateApi from './src/js/utils/generateApi.js';
 import generateAssetsToCache from './src/js/utils/generateAssetsToCache';
+import json from '@rollup/plugin-json';
 
 async function setupApi() {
   try {
@@ -35,6 +36,7 @@ export default [
       format: 'cjs',
     },
     plugins: [
+      json(),
       css(),
     ],
   },

From 5d9043209731de49e43fc99fefe1bff252f8461e Mon Sep 17 00:00:00 2001
From: Derek Herman <derek.herman@xwp.co>
Date: Fri, 30 Jul 2021 20:02:27 -0700
Subject: [PATCH 2/5] Route missing pages to a basic 404 handler

---
 src/index.js          | 21 ++++++++++++++++-----
 src/js/pages/Error.js | 43 +++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 59 insertions(+), 5 deletions(-)
 create mode 100644 src/js/pages/Error.js

diff --git a/src/index.js b/src/index.js
index c89c4e2..7559bd0 100644
--- a/src/index.js
+++ b/src/index.js
@@ -20,6 +20,7 @@
 import Router from './js/classes/Router';
 import VideoDownloaderRegistry from './js/classes/VideoDownloaderRegistry';
 import ConnectionStatus from './js/classes/ConnectionStatus';
+import api from '../public/api.json';
 
 /**
  * Web Components implementation.
@@ -39,6 +40,7 @@ import VideoPage from './js/pages/Video';
 import CategoryPage from './js/pages/Category';
 import DownloadsPage from './js/pages/Downloads';
 import SettingsPage from './js/pages/Settings';
+import ErrorPage from './js/pages/Error';
 
 /**
  * Settings
@@ -118,15 +120,24 @@ const router = new Router({
   videoDownloaderRegistry,
   connectionStatus,
 });
-router.route('^/settings/?', SettingsPage);
-router.route('^/downloads/?', DownloadsPage);
-router.route('^/category/([^/]*)/?', CategoryPage);
 router.route('^/?$', HomePage);
+router.route('^/downloads/$', DownloadsPage);
+router.route('^/settings/$', SettingsPage);
 
 /**
- * Consider all else a single video page.
+ * Add the category pages.
  */
-router.route('.*', VideoPage);
+api.categories.forEach((category) => router.route(`^/category/${category.slug}/$`, CategoryPage));
+
+/**
+ * Add the video pages.
+ */
+api.videos.forEach((video) => router.route(`^/${video.id}/$`, VideoPage));
+
+/**
+ * Consider all else an error.
+ */
+router.route('.*', ErrorPage);
 
 /**
  * Register Service Worker.
diff --git a/src/js/pages/Error.js b/src/js/pages/Error.js
new file mode 100644
index 0000000..e74f682
--- /dev/null
+++ b/src/js/pages/Error.js
@@ -0,0 +1,43 @@
+/**
+ * Copyright 2021 Google Inc. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @param {RouterContext} routerContext Context object passed by the Router.
+ */
+export default (routerContext) => {
+  const {
+    mainContent,
+  } = routerContext;
+
+  mainContent.innerHTML = `
+    <style>
+      .button {
+        color: var(--accent);
+      }
+    </style>
+    <div class="container">
+      <header class="page-header">
+        <h1>Not Found</h1>
+        <p>Looks like something went wrong. Try returning to the <a data-use-router href="/" class="button">home</a> page.</p>
+      </header>
+    </div>
+  `;
+
+  const meta = document.createElement('meta');
+  meta.name = 'robots';
+  meta.content = 'noindex';
+  document.head.appendChild(meta);
+};

From 66376113a72853de65c4d36a028379d184e91302 Mon Sep 17 00:00:00 2001
From: Derek Herman <derek.herman@xwp.co>
Date: Fri, 30 Jul 2021 20:16:09 -0700
Subject: [PATCH 3/5] Update error text

---
 src/js/pages/Error.js | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/js/pages/Error.js b/src/js/pages/Error.js
index e74f682..fde2115 100644
--- a/src/js/pages/Error.js
+++ b/src/js/pages/Error.js
@@ -20,18 +20,20 @@
 export default (routerContext) => {
   const {
     mainContent,
+    path,
   } = routerContext;
 
   mainContent.innerHTML = `
     <style>
-      .button {
-        color: var(--accent);
+      ins {
+        color: var(--accent-text);
+        font-weight: normal;
       }
     </style>
     <div class="container">
       <header class="page-header">
-        <h1>Not Found</h1>
-        <p>Looks like something went wrong. Try returning to the <a data-use-router href="/" class="button">home</a> page.</p>
+        <h1>404. <ins>That’s an error.</ins></h1>
+        <p>The requested URL <code>${path}</code> was not found on this server. <br><ins>That’s all we know.</ins></p>
       </header>
     </div>
   `;

From 305bf94329440cca372e87e8e119857bd6d87bce Mon Sep 17 00:00:00 2001
From: Derek Herman <derek.herman@xwp.co>
Date: Fri, 30 Jul 2021 21:15:39 -0700
Subject: [PATCH 4/5] Ignore file when missing from CI/CD pipeline

---
 .eslintrc.json | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/.eslintrc.json b/.eslintrc.json
index 3f0a65a..c120c02 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -32,6 +32,13 @@
           "src/js/utils/generateApi.js"
         ]
       }
+    ],
+    "import/no-unresolved": [
+      "error", {
+        "ignore": [
+          "../public/api.json"
+        ]
+      }
     ]
   }
 }

From 35c8fcc39837d9f511abaef15e6ba8c906fc7c3c Mon Sep 17 00:00:00 2001
From: Derek Herman <derek.herman@xwp.co>
Date: Fri, 30 Jul 2021 21:19:23 -0700
Subject: [PATCH 5/5] Ensure API is generated for both rollup input files

---
 rollup.config.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/rollup.config.js b/rollup.config.js
index 8d9d7ad..8dc4536 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -36,6 +36,7 @@ export default [
       format: 'cjs',
     },
     plugins: [
+      setupApi(),
       json(),
       css(),
     ],