Refactor routing in App component to enhance navigation and improve error handling by integrating dynamic routes and updating the NotFound route.

node_modules/zwitch/index.d.ts

@@ -0,0 +1,67 @@
+/**
+ * Handle values based on a field.
+ *
+ * @template {InvalidHandler} [Invalid=InvalidHandler]
+ * @template {UnknownHandler} [Unknown=UnknownHandler]
+ * @template {Record<string, Handler>} [Handlers=Record<string, Handler>]
+ * @param {string} key
+ *   Field to switch on.
+ * @param {Options<Invalid, Unknown, Handlers>} [options]
+ *   Configuration (required).
+ * @returns {{unknown: Unknown, invalid: Invalid, handlers: Handlers, (...parameters: Parameters<Handlers[keyof Handlers]>): ReturnType<Handlers[keyof Handlers]>, (...parameters: Parameters<Unknown>): ReturnType<Unknown>}}
+ */
+export function zwitch<
+  Invalid extends InvalidHandler = InvalidHandler,
+  Unknown extends UnknownHandler = UnknownHandler,
+  Handlers extends Record<string, Handler> = Record<string, Handler>
+>(
+  key: string,
+  options?: Options<Invalid, Unknown, Handlers> | undefined
+): {
+  (...parameters: Parameters<Handlers[keyof Handlers]>): ReturnType<
+    Handlers[keyof Handlers]
+  >
+  (...parameters: Parameters<Unknown>): ReturnType<Unknown>
+  unknown: Unknown
+  invalid: Invalid
+  handlers: Handlers
+}
+/**
+ * Handle a value, with a certain ID field set to a certain value.
+ * The ID field is passed to `zwitch`, and it’s value is this function’s
+ * place on the `handlers` record.
+ */
+export type Handler = (...parameters: any[]) => any
+/**
+ * Handle values that do have a certain ID field, but it’s set to a value
+ * that is not listed in the `handlers` record.
+ */
+export type UnknownHandler = (value: unknown, ...rest: any[]) => any
+/**
+ * Handle values that do not have a certain ID field.
+ */
+export type InvalidHandler = (
+  value: unknown,
+  ...rest: any[]
+) => void | null | undefined | never
+/**
+ * Configuration (required).
+ */
+export type Options<
+  Invalid extends InvalidHandler = InvalidHandler,
+  Unknown extends UnknownHandler = UnknownHandler,
+  Handlers extends Record<string, Handler> = Record<string, Handler>
+> = {
+  /**
+   * Handler to use for invalid values.
+   */
+  invalid?: Invalid | undefined
+  /**
+   * Handler to use for unknown values.
+   */
+  unknown?: Unknown | undefined
+  /**
+   * Handlers to use.
+   */
+  handlers?: Handlers | undefined
+}

node_modules/zwitch/index.js

@@ -0,0 +1,118 @@
+/**
+ * @callback Handler
+ *   Handle a value, with a certain ID field set to a certain value.
+ *   The ID field is passed to `zwitch`, and it’s value is this function’s
+ *   place on the `handlers` record.
+ * @param {...any} parameters
+ *   Arbitrary parameters passed to the zwitch.
+ *   The first will be an object with a certain ID field set to a certain value.
+ * @returns {any}
+ *   Anything!
+ */
+
+/**
+ * @callback UnknownHandler
+ *   Handle values that do have a certain ID field, but it’s set to a value
+ *   that is not listed in the `handlers` record.
+ * @param {unknown} value
+ *   An object with a certain ID field set to an unknown value.
+ * @param {...any} rest
+ *   Arbitrary parameters passed to the zwitch.
+ * @returns {any}
+ *   Anything!
+ */
+
+/**
+ * @callback InvalidHandler
+ *   Handle values that do not have a certain ID field.
+ * @param {unknown} value
+ *   Any unknown value.
+ * @param {...any} rest
+ *   Arbitrary parameters passed to the zwitch.
+ * @returns {void|null|undefined|never}
+ *   This should crash or return nothing.
+ */
+
+/**
+ * @template {InvalidHandler} [Invalid=InvalidHandler]
+ * @template {UnknownHandler} [Unknown=UnknownHandler]
+ * @template {Record<string, Handler>} [Handlers=Record<string, Handler>]
+ * @typedef Options
+ *   Configuration (required).
+ * @property {Invalid} [invalid]
+ *   Handler to use for invalid values.
+ * @property {Unknown} [unknown]
+ *   Handler to use for unknown values.
+ * @property {Handlers} [handlers]
+ *   Handlers to use.
+ */
+
+const own = {}.hasOwnProperty
+
+/**
+ * Handle values based on a field.
+ *
+ * @template {InvalidHandler} [Invalid=InvalidHandler]
+ * @template {UnknownHandler} [Unknown=UnknownHandler]
+ * @template {Record<string, Handler>} [Handlers=Record<string, Handler>]
+ * @param {string} key
+ *   Field to switch on.
+ * @param {Options<Invalid, Unknown, Handlers>} [options]
+ *   Configuration (required).
+ * @returns {{unknown: Unknown, invalid: Invalid, handlers: Handlers, (...parameters: Parameters<Handlers[keyof Handlers]>): ReturnType<Handlers[keyof Handlers]>, (...parameters: Parameters<Unknown>): ReturnType<Unknown>}}
+ */
+export function zwitch(key, options) {
+  const settings = options || {}
+
+  /**
+   * Handle one value.
+   *
+   * Based on the bound `key`, a respective handler will be called.
+   * If `value` is not an object, or doesn’t have a `key` property, the special
+   * “invalid” handler will be called.
+   * If `value` has an unknown `key`, the special “unknown” handler will be
+   * called.
+   *
+   * All arguments, and the context object, are passed through to the handler,
+   * and it’s result is returned.
+   *
+   * @this {unknown}
+   *   Any context object.
+   * @param {unknown} [value]
+   *   Any value.
+   * @param {...unknown} parameters
+   *   Arbitrary parameters passed to the zwitch.
+   * @property {Handler} invalid
+   *   Handle for values that do not have a certain ID field.
+   * @property {Handler} unknown
+   *   Handle values that do have a certain ID field, but it’s set to a value
+   *   that is not listed in the `handlers` record.
+   * @property {Handlers} handlers
+   *   Record of handlers.
+   * @returns {unknown}
+   *   Anything.
+   */
+  function one(value, ...parameters) {
+    /** @type {Handler|undefined} */
+    let fn = one.invalid
+    const handlers = one.handlers
+
+    if (value && own.call(value, key)) {
+      // @ts-expect-error Indexable.
+      const id = String(value[key])
+      // @ts-expect-error Indexable.
+      fn = own.call(handlers, id) ? handlers[id] : one.unknown
+    }
+
+    if (fn) {
+      return fn.call(this, value, ...parameters)
+    }
+  }
+
+  one.handlers = settings.handlers || {}
+  one.invalid = settings.invalid
+  one.unknown = settings.unknown
+
+  // @ts-expect-error: matches!
+  return one
+}

node_modules/zwitch/license

@@ -0,0 +1,22 @@
+(The MIT License)
+
+Copyright (c) 2016 Titus Wormer <tituswormer@gmail.com>
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+'Software'), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

node_modules/zwitch/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "zwitch",
+  "version": "2.0.4",
+  "description": "Handle values based on a property",
+  "license": "MIT",
+  "keywords": [
+    "handle",
+    "switch",
+    "property"
+  ],
+  "repository": "wooorm/zwitch",
+  "bugs": "https://github.com/wooorm/zwitch/issues",
+  "funding": {
+    "type": "github",
+    "url": "https://github.com/sponsors/wooorm"
+  },
+  "author": "Titus Wormer <tituswormer@gmail.com> (https://wooorm.com)",
+  "contributors": [
+    "Titus Wormer <tituswormer@gmail.com> (https://wooorm.com)"
+  ],
+  "sideEffects": false,
+  "type": "module",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "files": [
+    "index.d.ts",
+    "index.js"
+  ],
+  "devDependencies": {
+    "@types/node": "^18.0.0",
+    "c8": "^7.0.0",
+    "prettier": "^2.0.0",
+    "remark-cli": "^11.0.0",
+    "remark-preset-wooorm": "^9.0.0",
+    "tsd": "^0.24.0",
+    "type-coverage": "^2.0.0",
+    "typescript": "^4.0.0",
+    "xo": "^0.52.0"
+  },
+  "scripts": {
+    "prepack": "npm run build && npm run format",
+    "build": "tsc --build --clean && tsc --build && tsd && type-coverage",
+    "format": "remark . -qfo && prettier . -w --loglevel warn && xo --fix",
+    "test-api": "node --conditions development test.js",
+    "test-coverage": "c8 --check-coverage --100 --reporter lcov npm run test-api",
+    "test": "npm run build && npm run format && npm run test-coverage"
+  },
+  "prettier": {
+    "tabWidth": 2,
+    "useTabs": false,
+    "singleQuote": true,
+    "bracketSpacing": false,
+    "semi": false,
+    "trailingComma": "none"
+  },
+  "xo": {
+    "prettier": true
+  },
+  "remarkConfig": {
+    "plugins": [
+      "preset-wooorm"
+    ]
+  },
+  "typeCoverage": {
+    "atLeast": 100,
+    "detail": true,
+    "strict": true,
+    "ignoreFiles": [
+      "index.d.ts"
+    ]
+  }
+}

node_modules/zwitch/readme.md

@@ -0,0 +1,226 @@
+# zwitch
+
+[![Build][build-badge]][build]
+[![Coverage][coverage-badge]][coverage]
+[![Downloads][downloads-badge]][downloads]
+[![Size][size-badge]][size]
+
+Handle values based on a field.
+
+## Contents
+
+*   [What is this?](#what-is-this)
+*   [When should I use this?](#when-should-i-use-this)
+*   [Install](#install)
+*   [Use](#use)
+*   [API](#api)
+    *   [`zwitch(key[, options])`](#zwitchkey-options)
+    *   [`one(value[, rest…])`](#onevalue-rest)
+    *   [`function handler(value[, rest…])`](#function-handlervalue-rest)
+*   [Types](#types)
+*   [Compatibility](#compatibility)
+*   [Related](#related)
+*   [Contribute](#contribute)
+*   [Security](#security)
+*   [License](#license)
+
+## What is this?
+
+This is a tiny package that lets you `switch` between some field on objects.
+
+## When should I use this?
+
+This package is very useful when mapping one AST to another.
+It’s a lot like a `switch` statement on one field, but it’s extensible.
+
+## Install
+
+This package is [ESM only][esm].
+In Node.js (version 14.14+, 16.0+), install with [npm][]:
+
+```sh
+npm install zwitch
+```
+
+In Deno with [`esm.sh`][esmsh]:
+
+```js
+import {zwitch} from 'https://esm.sh/zwitch@2'
+```
+
+In browsers with [`esm.sh`][esmsh]:
+
+```html
+<script type="module">
+  import {zwitch} from 'https://esm.sh/zwitch@2?bundle'
+</script>
+```
+
+## Use
+
+```js
+import {zwitch} from 'zwitch'
+
+const handle = zwitch('type', {invalid, unknown, handlers: {alpha: handleAlpha}})
+
+handle({type: 'alpha'})
+
+function handleAlpha() { /* … */ }
+```
+
+Or, with a `switch` statement:
+
+```js
+const field = 'type'
+
+function handle(value) {
+  let fn = invalid
+
+  if (value && typeof value === 'object' && field in value) {
+    switch (value[field]) {
+      case 'alpha':
+        fn = handleAlpha
+        break
+      default:
+        fn = unknown
+        break
+    }
+  }
+
+  return fn.apply(this, arguments)
+}
+
+handle({type: 'alpha'})
+
+function handleAlpha() { /* … */ }
+function unknown() { /* … */ }
+function invalid() { /* … */ }
+```
+
+## API
+
+This package exports the identifier `zwitch`.
+There is no default export.
+
+### `zwitch(key[, options])`
+
+Create a switch, based on a `key` (`string`).
+
+##### `options`
+
+Options can be omitted and added later to `one`.
+
+###### `options.handlers`
+
+Handlers to use, stored on `one.handlers` (`Record<string, Function>`,
+optional).
+
+###### `options.unknown`
+
+Handler to use for unknown values, stored on `one.unknown` (`Function`,
+optional).
+
+###### `options.invalid`
+
+Handler to use for invalid values, stored on `one.invalid` (`Function`,
+optional).
+
+###### Returns
+
+See [`one`][one] (`Function`).
+
+### `one(value[, rest…])`
+
+Handle one value.
+Based on the bound `key`, a respective handler will be called.
+If `value` is not an object, or doesn’t have a `key` property, the special
+“invalid” handler will be called.
+If `value` has an unknown `key`, the special “unknown” handler will be called.
+
+All arguments, and the context object (`this`), are passed through to the
+[handler][], and it’s result is returned.
+
+###### `one.handlers`
+
+Map of [handler][]s (`Record<string, Function>`).
+
+###### `one.invalid`
+
+Special [`handler`][handler] called if a value doesn’t have a `key` property.
+If not set, `undefined` is returned for invalid values.
+
+###### `one.unknown`
+
+Special [`handler`][handler] called if a value does not have a matching
+handler.
+If not set, `undefined` is returned for unknown values.
+
+### `function handler(value[, rest…])`
+
+Handle one value.
+
+## Types
+
+This package is fully typed with [TypeScript][].
+It exports the types `Handler`, `UnknownHandler`, `InvalidHandler`, and
+`Options`.
+
+## Compatibility
+
+This package is at least compatible with all maintained versions of Node.js.
+As of now, that is Node.js 14.14+ and 16.0+.
+It also works in Deno and modern browsers.
+
+## Related
+
+*   [`mapz`](https://github.com/wooorm/mapz)
+    — functional map
+
+## Contribute
+
+Yes please!
+See [How to Contribute to Open Source][contribute].
+
+## Security
+
+This package is safe.
+
+## License
+
+[MIT][license] © [Titus Wormer][author]
+
+<!-- Definitions -->
+
+[build-badge]: https://github.com/wooorm/zwitch/workflows/main/badge.svg
+
+[build]: https://github.com/wooorm/zwitch/actions
+
+[coverage-badge]: https://img.shields.io/codecov/c/github/wooorm/zwitch.svg
+
+[coverage]: https://codecov.io/github/wooorm/zwitch
+
+[downloads-badge]: https://img.shields.io/npm/dm/zwitch.svg
+
+[downloads]: https://www.npmjs.com/package/zwitch
+
+[size-badge]: https://img.shields.io/bundlephobia/minzip/zwitch.svg
+
+[size]: https://bundlephobia.com/result?p=zwitch
+
+[npm]: https://docs.npmjs.com/cli/install
+
+[esm]: https://gist.github.com/sindresorhus/a39789f98801d908bbc7ff3ecc99d99c
+
+[esmsh]: https://esm.sh
+
+[typescript]: https://www.typescriptlang.org
+
+[contribute]: https://opensource.guide/how-to-contribute/
+
+[license]: license
+
+[author]: https://wooorm.com
+
+[one]: #onevalue-rest
+
+[handler]: #function-handlervalue-rest