From 584f91d05a010b62f1d006b3c179f60839a3679a Mon Sep 17 00:00:00 2001
From: Francis Li <mail@francisli.com>
Date: Sun, 5 Jan 2025 14:35:28 -0800
Subject: [PATCH 1/5] Switch to neostandard for lint

---
 client/.eslintrc.cjs                        |  10 --
 client/eslint.config.js                     |  44 ++-------
 client/package.json                         |   7 +-
 client/src/Admin/AdminRoutes.jsx            |   6 +-
 client/src/Admin/Users/AdminUserInvite.jsx  |  62 ++++++------
 client/src/Admin/Users/AdminUsersList.jsx   |  52 +++++-----
 client/src/Admin/Users/AdminUsersRoutes.jsx |   8 +-
 client/src/Api.js                           |  46 ++++-----
 client/src/App.jsx                          |  18 ++--
 client/src/AppRedirects.jsx                 |   4 +-
 client/src/AppRedirectsConfig.js            |  10 +-
 client/src/AuthContext.js                   |   4 +-
 client/src/AuthContextProvider.jsx          |   2 +-
 client/src/Components/DropzoneUploader.jsx  |  14 +--
 client/src/Components/Pagination.jsx        |  52 +++++-----
 client/src/Components/PhotoInput.jsx        |  24 ++---
 client/src/Header.jsx                       |  48 ++++-----
 client/src/Home.jsx                         |   4 +-
 client/src/Invites/Invite.jsx               |  20 ++--
 client/src/Invites/InvitesRoutes.jsx        |   4 +-
 client/src/Login.jsx                        |  57 +++++------
 client/src/Passwords/ForgotPassword.jsx     |  36 +++----
 client/src/Passwords/PasswordsRoutes.jsx    |   8 +-
 client/src/Passwords/ResetPassword.jsx      |  42 ++++----
 client/src/Register.jsx                     |  22 ++---
 client/src/RegistrationForm.jsx             |  48 ++++-----
 client/src/StaticContext.js                 |   2 +-
 client/src/StaticContextProvider.jsx        |   2 +-
 client/src/UnexpectedError.js               |   2 +-
 client/src/Users/UserForm.jsx               | 103 ++++++++++----------
 client/src/Users/UsersRoutes.jsx            |   4 +-
 client/src/ValidationError.jsx              |   8 +-
 client/src/entry-server.jsx                 |   4 +-
 package-lock.json                           |  77 +--------------
 34 files changed, 370 insertions(+), 484 deletions(-)
 delete mode 100644 client/.eslintrc.cjs

diff --git a/client/.eslintrc.cjs b/client/.eslintrc.cjs
deleted file mode 100644
index 6910e43..0000000
--- a/client/.eslintrc.cjs
+++ /dev/null
@@ -1,10 +0,0 @@
-module.exports = {
-  env: { browser: true, es2020: true },
-  extends: ['eslint:recommended', 'plugin:react/recommended', 'plugin:react/jsx-runtime', 'plugin:react-hooks/recommended'],
-  parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
-  settings: { react: { version: '18.2' } },
-  plugins: ['react-refresh'],
-  rules: {
-    'react-refresh/only-export-components': 'warn',
-  },
-};
diff --git a/client/eslint.config.js b/client/eslint.config.js
index 238d2e4..aa78f70 100644
--- a/client/eslint.config.js
+++ b/client/eslint.config.js
@@ -1,38 +1,8 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import react from 'eslint-plugin-react'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
+import neostandard from 'neostandard';
 
-export default [
-  { ignores: ['dist'] },
-  {
-    files: ['**/*.{js,jsx}'],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-      parserOptions: {
-        ecmaVersion: 'latest',
-        ecmaFeatures: { jsx: true },
-        sourceType: 'module',
-      },
-    },
-    settings: { react: { version: '18.3' } },
-    plugins: {
-      react,
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
-    },
-    rules: {
-      ...js.configs.recommended.rules,
-      ...react.configs.recommended.rules,
-      ...react.configs['jsx-runtime'].rules,
-      ...reactHooks.configs.recommended.rules,
-      'react/jsx-no-target-blank': 'off',
-      'react-refresh/only-export-components': [
-        'warn',
-        { allowConstantExport: true },
-      ],
-    },
-  },
-]
+export default neostandard({
+  ignores: [
+    'dist/*',
+  ],
+  semi: true
+});
diff --git a/client/package.json b/client/package.json
index ae6a637..6b39e04 100644
--- a/client/package.json
+++ b/client/package.json
@@ -8,7 +8,7 @@
     "build": "npm run build:client && npm run build:server",
     "build:client": "vite build --outDir dist/client",
     "build:server": "vite build --ssr src/entry-server.jsx --outDir dist/server",
-    "lint": "eslint .",
+    "lint": "eslint --fix",
     "preview": "vite preview",
     "test": ""
   },
@@ -27,15 +27,12 @@
     "react-router": "^7.1.1"
   },
   "devDependencies": {
-    "@eslint/js": "^9.17.0",
     "@types/react": "^18.3.18",
     "@types/react-dom": "^18.3.5",
     "@vitejs/plugin-react-swc": "^3.7.2",
     "eslint": "^9.17.0",
-    "eslint-plugin-react": "^7.37.2",
-    "eslint-plugin-react-hooks": "^5.0.0",
-    "eslint-plugin-react-refresh": "^0.4.16",
     "globals": "^15.14.0",
+    "neostandard": "^0.12.0",
     "sass": "^1.83.0",
     "vite": "^6.0.7"
   },
diff --git a/client/src/Admin/AdminRoutes.jsx b/client/src/Admin/AdminRoutes.jsx
index d899a60..b90acfc 100644
--- a/client/src/Admin/AdminRoutes.jsx
+++ b/client/src/Admin/AdminRoutes.jsx
@@ -2,11 +2,11 @@ import { Navigate, Routes, Route } from 'react-router';
 
 import AdminUsersRoutes from './Users/AdminUsersRoutes';
 
-function AdminRoutes() {
+function AdminRoutes () {
   return (
     <Routes>
-      <Route path="users/*" element={<AdminUsersRoutes />} />
-      <Route path="" element={<Navigate to="users" />} />
+      <Route path='users/*' element={<AdminUsersRoutes />} />
+      <Route path='' element={<Navigate to='users' />} />
     </Routes>
   );
 }
diff --git a/client/src/Admin/Users/AdminUserInvite.jsx b/client/src/Admin/Users/AdminUserInvite.jsx
index 232dfa8..d472848 100644
--- a/client/src/Admin/Users/AdminUserInvite.jsx
+++ b/client/src/Admin/Users/AdminUserInvite.jsx
@@ -9,7 +9,7 @@ import UnexpectedError from '../../UnexpectedError';
 import ValidationError from '../../ValidationError';
 import { useStaticContext } from '../../StaticContext';
 
-function AdminUserInvite() {
+function AdminUserInvite () {
   const staticContext = useStaticContext();
   const navigate = useNavigate();
   const [invite, setInvite] = useState({
@@ -21,13 +21,13 @@ function AdminUserInvite() {
   const [isLoading, setLoading] = useState(false);
   const [error, setError] = useState(null);
 
-  function onChange(event) {
+  function onChange (event) {
     const newInvite = { ...invite };
     newInvite[event.target.name] = event.target.value;
     setInvite(newInvite);
   }
 
-  async function onSubmit(event) {
+  async function onSubmit (event) {
     event.preventDefault();
     setLoading(true);
     setError(null);
@@ -50,72 +50,72 @@ function AdminUserInvite() {
       <Helmet>
         <title>Invite a new User - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">Invite a new User</h2>
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>Invite a new User</h2>
                 <form onSubmit={onSubmit}>
-                  {error && error.message && <div className="alert alert-danger">{error.message}</div>}
+                  {error && error.message && <div className='alert alert-danger'>{error.message}</div>}
                   <fieldset disabled={isLoading}>
-                    <div className="mb-3">
-                      <label className="form-label" htmlFor="firstName">
+                    <div className='mb-3'>
+                      <label className='form-label' htmlFor='firstName'>
                         First name
                       </label>
                       <input
-                        type="text"
+                        type='text'
                         className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('firstName') })}
-                        id="firstName"
-                        name="firstName"
+                        id='firstName'
+                        name='firstName'
                         onChange={onChange}
                         value={invite.firstName ?? ''}
                       />
                       {error?.errorMessagesHTMLFor?.('firstName')}
                     </div>
-                    <div className="mb-3">
-                      <label className="form-label" htmlFor="lastName">
+                    <div className='mb-3'>
+                      <label className='form-label' htmlFor='lastName'>
                         Last name
                       </label>
                       <input
-                        type="text"
+                        type='text'
                         className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('lastName') })}
-                        id="lastName"
-                        name="lastName"
+                        id='lastName'
+                        name='lastName'
                         onChange={onChange}
                         value={invite.lastName ?? ''}
                       />
                       {error?.errorMessagesHTMLFor?.('lastName')}
                     </div>
-                    <div className="mb-3">
-                      <label className="form-label" htmlFor="email">
+                    <div className='mb-3'>
+                      <label className='form-label' htmlFor='email'>
                         Email
                       </label>
                       <input
-                        type="text"
+                        type='text'
                         className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('email') })}
-                        id="email"
-                        name="email"
+                        id='email'
+                        name='email'
                         onChange={onChange}
                         value={invite.email ?? ''}
                       />
                       {error?.errorMessagesHTMLFor?.('email')}
                     </div>
-                    <div className="mb-3">
-                      <label className="form-label" htmlFor="message">
+                    <div className='mb-3'>
+                      <label className='form-label' htmlFor='message'>
                         Message
                       </label>
                       <textarea
                         className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('message') })}
-                        id="message"
-                        name="message"
+                        id='message'
+                        name='message'
                         onChange={onChange}
                         value={invite.message ?? ''}
                       />
                       {error?.errorMessagesHTMLFor?.('message')}
                     </div>
-                    <div className="mb-3 d-grid">
-                      <button className="btn btn-primary" type="submit">
+                    <div className='mb-3 d-grid'>
+                      <button className='btn btn-primary' type='submit'>
                         Submit
                       </button>
                     </div>
diff --git a/client/src/Admin/Users/AdminUsersList.jsx b/client/src/Admin/Users/AdminUsersList.jsx
index 07f6114..dac462d 100644
--- a/client/src/Admin/Users/AdminUsersList.jsx
+++ b/client/src/Admin/Users/AdminUsersList.jsx
@@ -7,7 +7,7 @@ import Api from '../../Api';
 import { useStaticContext } from '../../StaticContext';
 import Pagination from '../../Components/Pagination';
 
-function AdminUsersList() {
+function AdminUsersList () {
   const staticContext = useStaticContext();
   const [users, setUsers] = useState([]);
   const { search } = useLocation();
@@ -33,9 +33,9 @@ function AdminUsersList() {
     Api.invites.index().then((response) => setInvites(response.data));
   }, [page]);
 
-  async function revoke(invite) {
-    let name = `${invite.firstName} ${invite.lastName}`.trim();
-    let nameAndEmail = `${name} <${invite.email}>`.trim();
+  async function revoke (invite) {
+    const name = `${invite.firstName} ${invite.lastName}`.trim();
+    const nameAndEmail = `${name} <${invite.email}>`.trim();
     if (window.confirm(`Are you sure you wish to revoke the invite to ${nameAndEmail}?`)) {
       const response = await Api.invites.revoke(invite.id);
       if (response.status === 200) {
@@ -44,9 +44,9 @@ function AdminUsersList() {
     }
   }
 
-  async function resend(invite) {
-    let name = `${invite.firstName} ${invite.lastName}`.trim();
-    let nameAndEmail = `${name} <${invite.email}>`.trim();
+  async function resend (invite) {
+    const name = `${invite.firstName} ${invite.lastName}`.trim();
+    const nameAndEmail = `${name} <${invite.email}>`.trim();
     if (window.confirm(`Are you sure you wish to resend the invite to ${nameAndEmail}?`)) {
       const response = await Api.invites.resend(invite.id);
       if (response.status === 200) {
@@ -66,25 +66,25 @@ function AdminUsersList() {
       <Helmet>
         <title>Manage Users - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="users container">
+      <main className='users container'>
         <h1>Manage Users</h1>
-        <div className="mb-5">
-          <Link to="invite" className="btn btn-outline-primary">
+        <div className='mb-5'>
+          <Link to='invite' className='btn btn-outline-primary'>
             Invite a new User
           </Link>
         </div>
         {invites.length > 0 && (
           <>
             <h2>Invites</h2>
-            <div className="table-responsive mb-5">
-              <table className="table table-hover">
+            <div className='table-responsive mb-5'>
+              <table className='table table-hover'>
                 <thead>
                   <tr>
-                    <th className="w-20">First name</th>
-                    <th className="w-20">Last name</th>
-                    <th className="w-20">Email</th>
-                    <th className="w-20">Invited on</th>
-                    <th className="w-20">Actions</th>
+                    <th className='w-20'>First name</th>
+                    <th className='w-20'>Last name</th>
+                    <th className='w-20'>Email</th>
+                    <th className='w-20'>Invited on</th>
+                    <th className='w-20'>Actions</th>
                   </tr>
                 </thead>
                 <tbody>
@@ -97,11 +97,11 @@ function AdminUsersList() {
                       </td>
                       <td>{DateTime.fromISO(invite.updatedAt).toLocaleString()}</td>
                       <td>
-                        <button className="btn btn-link p-0" onClick={() => resend(invite)}>
+                        <button className='btn btn-link p-0' onClick={() => resend(invite)}>
                           Resend&nbsp;Invite
                         </button>
                         &nbsp;|&nbsp;
-                        <button className="btn btn-link p-0" onClick={() => revoke(invite)}>
+                        <button className='btn btn-link p-0' onClick={() => revoke(invite)}>
                           Revoke&nbsp;Invite
                         </button>
                       </td>
@@ -113,15 +113,15 @@ function AdminUsersList() {
           </>
         )}
         <h2>Users</h2>
-        <div className="table-responsive">
-          <table className="table table-hover">
+        <div className='table-responsive'>
+          <table className='table table-hover'>
             <thead>
               <tr>
-                <th className="w-20">First name</th>
-                <th className="w-20">Last name</th>
-                <th className="w-20">Email</th>
-                <th className="w-5">Admin?</th>
-                <th className="w-15">Actions</th>
+                <th className='w-20'>First name</th>
+                <th className='w-20'>Last name</th>
+                <th className='w-20'>Email</th>
+                <th className='w-5'>Admin?</th>
+                <th className='w-15'>Actions</th>
               </tr>
             </thead>
             <tbody>
diff --git a/client/src/Admin/Users/AdminUsersRoutes.jsx b/client/src/Admin/Users/AdminUsersRoutes.jsx
index cd5f0d5..123ad37 100644
--- a/client/src/Admin/Users/AdminUsersRoutes.jsx
+++ b/client/src/Admin/Users/AdminUsersRoutes.jsx
@@ -4,12 +4,12 @@ import AdminUserInvite from './AdminUserInvite';
 import AdminUsersList from './AdminUsersList';
 import UserForm from '../../Users/UserForm';
 
-function AdminUsersRoutes() {
+function AdminUsersRoutes () {
   return (
     <Routes>
-      <Route path="invite" element={<AdminUserInvite />} />
-      <Route path=":userId" element={<UserForm />} />
-      <Route path="" element={<AdminUsersList />} />
+      <Route path='invite' element={<AdminUserInvite />} />
+      <Route path=':userId' element={<UserForm />} />
+      <Route path='' element={<AdminUsersList />} />
     </Routes>
   );
 }
diff --git a/client/src/Api.js b/client/src/Api.js
index 456d0ae..e2c8a17 100644
--- a/client/src/Api.js
+++ b/client/src/Api.js
@@ -13,17 +13,17 @@ instance.interceptors.response.use(
       window.location = '/login';
     }
     return Promise.reject(error);
-  },
+  }
 );
 
-function parseLinkHeader(response) {
+function parseLinkHeader (response) {
   const link = response.headers?.link;
   if (link) {
     const linkRe = /<([^>]+)>; rel="([^"]+)"/g;
     const urls = {};
     let m;
     while ((m = linkRe.exec(link)) !== null) {
-      let url = m[1];
+      const url = m[1];
       urls[m[2]] = url;
     }
     return urls;
@@ -34,66 +34,66 @@ function parseLinkHeader(response) {
 const Api = {
   parseLinkHeader,
   assets: {
-    create(data) {
+    create (data) {
       return instance.post('/api/assets', data);
     },
-    upload(url, headers, file) {
+    upload (url, headers, file) {
       return instance.put(url, file, { headers });
     },
   },
   auth: {
-    login(email, password) {
+    login (email, password) {
       return instance.post('/api/auth/login', { email, password });
     },
-    logout() {
+    logout () {
       return instance.get('/api/auth/logout');
     },
-    register(data) {
+    register (data) {
       return instance.post('/api/auth/register', data);
     },
   },
   invites: {
-    index() {
-      return instance.get(`/api/invites`);
+    index () {
+      return instance.get('/api/invites');
     },
-    create(data) {
+    create (data) {
       return instance.post('/api/invites', data);
     },
-    get(id) {
+    get (id) {
       return instance.get(`/api/invites/${id}`);
     },
-    accept(id, data) {
+    accept (id, data) {
       return instance.post(`/api/invites/${id}/accept`, data);
     },
-    resend(id) {
+    resend (id) {
       return instance.patch(`/api/invites/${id}/resend`);
     },
-    revoke(id) {
+    revoke (id) {
       return instance.delete(`/api/invites/${id}`);
     },
   },
   passwords: {
-    reset(email) {
+    reset (email) {
       return instance.post('/api/passwords', { email });
     },
-    get(token) {
+    get (token) {
       return instance.get(`/api/passwords/${token}`);
     },
-    update(token, password) {
+    update (token, password) {
       return instance.patch(`/api/passwords/${token}`, { password });
     },
   },
   users: {
-    index(page = 1) {
-      return instance.get(`/api/users`, { params: { page } });
+    index (page = 1) {
+      return instance.get('/api/users', { params: { page } });
     },
-    me() {
+    me () {
       return instance.get('/api/users/me');
     },
-    get(id) {
+    get (id) {
       return instance.get(`/api/users/${id}`);
     },
-    update(id, data) {
+    update (id, data) {
       return instance.patch(`/api/users/${id}`, data);
     },
   },
diff --git a/client/src/App.jsx b/client/src/App.jsx
index 5bbb5c4..c1a9f56 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -14,7 +14,7 @@ import PasswordsRoutes from './Passwords/PasswordsRoutes';
 import Register from './Register';
 import UsersRoutes from './Users/UsersRoutes';
 
-function App() {
+function App () {
   const staticContext = useStaticContext();
 
   return (
@@ -22,17 +22,17 @@ function App() {
       <Header />
       <Routes>
         <Route
-          path="*"
+          path='*'
           element={
             <AppRedirects>
               <Routes>
-                <Route path="/" element={<Home />} />
-                <Route path="/login" element={<Login />} />
-                <Route path="/passwords/*" element={<PasswordsRoutes />} />
-                <Route path="/invites/*" element={<InvitesRoutes />} />
-                {staticContext?.env?.VITE_FEATURE_REGISTRATION === 'true' && <Route path="/register" element={<Register />} />}
-                <Route path="/account/*" element={<UsersRoutes />} />
-                <Route path="/admin/*" element={<AdminRoutes />} />
+                <Route path='/' element={<Home />} />
+                <Route path='/login' element={<Login />} />
+                <Route path='/passwords/*' element={<PasswordsRoutes />} />
+                <Route path='/invites/*' element={<InvitesRoutes />} />
+                {staticContext?.env?.VITE_FEATURE_REGISTRATION === 'true' && <Route path='/register' element={<Register />} />}
+                <Route path='/account/*' element={<UsersRoutes />} />
+                <Route path='/admin/*' element={<AdminRoutes />} />
               </Routes>
             </AppRedirects>
           }
diff --git a/client/src/AppRedirects.jsx b/client/src/AppRedirects.jsx
index 91325bf..8979764 100644
--- a/client/src/AppRedirects.jsx
+++ b/client/src/AppRedirects.jsx
@@ -2,7 +2,7 @@ import { Navigate, useLocation } from 'react-router';
 import { useAuthContext } from './AuthContext';
 import { handleRedirects } from './AppRedirectsConfig';
 
-function AppRedirects({ children }) {
+function AppRedirects ({ children }) {
   const location = useLocation();
   const authContext = useAuthContext();
   const result = handleRedirects(authContext, location, location.pathname, (to, state) => {
@@ -11,6 +11,6 @@ function AppRedirects({ children }) {
     }
     return <Navigate to={to} />;
   });
-  return result ? result : children;
+  return result || children;
 }
 export default AppRedirects;
diff --git a/client/src/AppRedirectsConfig.js b/client/src/AppRedirectsConfig.js
index 4154a6c..f5a023a 100644
--- a/client/src/AppRedirectsConfig.js
+++ b/client/src/AppRedirectsConfig.js
@@ -7,15 +7,15 @@ export const REDIRECTS = [
   ['/passwords', '/passwords/forgot'],
 ];
 
-export function handleRedirects(authContext, location, pathname, callback) {
+export function handleRedirects (authContext, location, pathname, handler) {
   let match;
   for (const pattern of ADMIN_AUTH_PROTECTED_PATHS) {
     match = matchPath(pattern, pathname);
     if (match) {
       if (!authContext.user) {
-        return callback('/login', { from: location });
+        return handler('/login', { from: location });
       } else if (!authContext.user.isAdmin) {
-        return callback('/');
+        return handler('/');
       }
       break;
     }
@@ -25,7 +25,7 @@ export function handleRedirects(authContext, location, pathname, callback) {
       match = matchPath(pattern, pathname);
       if (match) {
         if (!authContext.user) {
-          return callback('/login', { from: location });
+          return handler('/login', { from: location });
         }
         break;
       }
@@ -41,7 +41,7 @@ export function handleRedirects(authContext, location, pathname, callback) {
         }
       }
       if (dest !== src) {
-        return callback(dest);
+        return handler(dest);
       }
       break;
     }
diff --git a/client/src/AuthContext.js b/client/src/AuthContext.js
index 133dcfa..585be61 100644
--- a/client/src/AuthContext.js
+++ b/client/src/AuthContext.js
@@ -4,11 +4,11 @@ import { useStaticContext } from './StaticContext';
 
 export const authContext = createContext();
 
-export function useAuthContext() {
+export function useAuthContext () {
   return useContext(authContext);
 }
 
-export function AuthContextValue() {
+export function AuthContextValue () {
   const staticContext = useStaticContext();
   const [user, setUser] = useState(staticContext.authContext?.user);
   return {
diff --git a/client/src/AuthContextProvider.jsx b/client/src/AuthContextProvider.jsx
index 26565d5..a4640c2 100644
--- a/client/src/AuthContextProvider.jsx
+++ b/client/src/AuthContextProvider.jsx
@@ -1,7 +1,7 @@
 import { authContext, AuthContextValue } from './AuthContext';
 import PropTypes from 'prop-types';
 
-function AuthContextProvider({ children }) {
+function AuthContextProvider ({ children }) {
   const value = AuthContextValue();
   return <authContext.Provider value={value}>{children}</authContext.Provider>;
 }
diff --git a/client/src/Components/DropzoneUploader.jsx b/client/src/Components/DropzoneUploader.jsx
index 6fac5c2..d5078c9 100644
--- a/client/src/Components/DropzoneUploader.jsx
+++ b/client/src/Components/DropzoneUploader.jsx
@@ -5,7 +5,7 @@ import { v4 as uuid } from 'uuid';
 
 import Api from '../Api';
 
-function DropzoneUploader({ className, children, disabled, id, maxFiles, multiple, onRemoved, onUploaded, onUploading }) {
+function DropzoneUploader ({ className, children, disabled, id, maxFiles, multiple, onRemoved, onUploaded, onUploading }) {
   const [files, setFiles] = useState([]);
   const [rejectedFiles, setRejectedFiles] = useState([]);
   const [statuses, setStatuses] = useState([]);
@@ -15,7 +15,7 @@ function DropzoneUploader({ className, children, disabled, id, maxFiles, multipl
       // Make sure to revoke the data uris to avoid memory leaks
       files.forEach((file) => URL.revokeObjectURL(file.preview));
     },
-    [files],
+    [files]
   );
 
   useEffect(() => {
@@ -54,13 +54,13 @@ function DropzoneUploader({ className, children, disabled, id, maxFiles, multipl
     }
   }, [onUploaded, onUploading, statuses]);
 
-  function onDropAccepted(acceptedFiles) {
+  function onDropAccepted (acceptedFiles) {
     setFiles(
       acceptedFiles.map((file) =>
         Object.assign(file, {
           preview: URL.createObjectURL(file),
-        }),
-      ),
+        })
+      )
     );
     const statuses = [];
     for (const file of acceptedFiles) {
@@ -75,11 +75,11 @@ function DropzoneUploader({ className, children, disabled, id, maxFiles, multipl
     setStatuses(statuses);
   }
 
-  function onDropRejected(rejectedFiles) {
+  function onDropRejected (rejectedFiles) {
     setRejectedFiles(rejectedFiles);
   }
 
-  function onRemove(status) {
+  function onRemove (status) {
     setFiles(files.filter((f) => f !== status.file));
     setStatuses(statuses.filter((s) => s !== status));
     if (onRemoved) {
diff --git a/client/src/Components/Pagination.jsx b/client/src/Components/Pagination.jsx
index b312924..ccaa8d7 100644
--- a/client/src/Components/Pagination.jsx
+++ b/client/src/Components/Pagination.jsx
@@ -2,88 +2,88 @@ import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import { Link } from 'react-router';
 
-function Pagination({ page, lastPage, otherParams = {} }) {
-  function onClick() {
+function Pagination ({ page, lastPage, otherParams = {} }) {
+  function onClick () {
     window.scrollTo(0, 0);
   }
   return (
     <nav>
-      <ul className="pagination justify-content-center">
+      <ul className='pagination justify-content-center'>
         <li className={classNames('page-item', { disabled: page === 1 })}>
           {page > 2 && (
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: page - 1 })}`} onClick={onClick} className="page-link">
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: page - 1 })}`} onClick={onClick} className='page-link'>
               Prev
             </Link>
           )}
           {page === 2 && (
-            <Link to={`?${new URLSearchParams(otherParams)}`} onClick={onClick} className="page-link">
+            <Link to={`?${new URLSearchParams(otherParams)}`} onClick={onClick} className='page-link'>
               Prev
             </Link>
           )}
-          {page === 1 && <span className="page-link">Prev</span>}
+          {page === 1 && <span className='page-link'>Prev</span>}
         </li>
         {page > 1 && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams(otherParams)}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams(otherParams)}`} onClick={onClick} className='page-link'>
               1
             </Link>
           </li>
         )}
         {page - 3 >= 2 && (
-          <li className="page-item disabled">
-            <span className="page-link">&hellip;</span>
+          <li className='page-item disabled'>
+            <span className='page-link'>&hellip;</span>
           </li>
         )}
         {page === 4 && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: 2 })}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: 2 })}`} onClick={onClick} className='page-link'>
               2
             </Link>
           </li>
         )}
         {page > 2 && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: page - 1 })}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: page - 1 })}`} onClick={onClick} className='page-link'>
               {page - 1}
             </Link>
           </li>
         )}
-        <li className="page-item active" aria-current="page">
-          <span className="page-link">{page}</span>
+        <li className='page-item active' aria-current='page'>
+          <span className='page-link'>{page}</span>
         </li>
         {page < lastPage && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 1 })}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 1 })}`} onClick={onClick} className='page-link'>
               {page + 1}
             </Link>
           </li>
         )}
         {page + 2 === lastPage - 1 && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 2 })}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 2 })}`} onClick={onClick} className='page-link'>
               {page + 2}
             </Link>
           </li>
         )}
         {lastPage - (page + 1) > 2 && (
-          <li className="page-item disabled">
-            <span className="page-link">&hellip;</span>
+          <li className='page-item disabled'>
+            <span className='page-link'>&hellip;</span>
           </li>
         )}
         {page < lastPage - 1 && (
-          <li className="page-item">
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: lastPage })}`} onClick={onClick} className="page-link">
+          <li className='page-item'>
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: lastPage })}`} onClick={onClick} className='page-link'>
               {lastPage}
             </Link>
           </li>
         )}
         <li className={classNames('page-item', { disabled: page === lastPage })}>
           {page < lastPage && (
-            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 1 })}`} onClick={onClick} className="page-link">
+            <Link to={`?${new URLSearchParams({ ...otherParams, page: page + 1 })}`} onClick={onClick} className='page-link'>
               Next
             </Link>
           )}
-          {page === lastPage && <span className="page-link">Next</span>}
+          {page === lastPage && <span className='page-link'>Next</span>}
         </li>
       </ul>
     </nav>
diff --git a/client/src/Components/PhotoInput.jsx b/client/src/Components/PhotoInput.jsx
index fdff616..943f629 100644
--- a/client/src/Components/PhotoInput.jsx
+++ b/client/src/Components/PhotoInput.jsx
@@ -4,14 +4,14 @@ import PropTypes from 'prop-types';
 import DropzoneUploader from './DropzoneUploader';
 import './PhotoInput.scss';
 
-function PhotoInput({ className, children, id, name, onChange, value, valueUrl }) {
-  function onRemoved() {
+function PhotoInput ({ className, children, id, name, onChange, value, valueUrl }) {
+  function onRemoved () {
     if (onChange) {
       onChange({ target: { name, value: '' } });
     }
   }
 
-  function onUploaded(status) {
+  function onUploaded (status) {
     if (onChange) {
       onChange({ target: { name, value: status.filename } });
     }
@@ -24,7 +24,8 @@ function PhotoInput({ className, children, id, name, onChange, value, valueUrl }
       multiple={false}
       disabled={!!value && value !== ''}
       onRemoved={onRemoved}
-      onUploaded={onUploaded}>
+      onUploaded={onUploaded}
+    >
       {({ statuses, onRemove }) => {
         if (statuses.length > 0) {
           return statuses.map((s) => (
@@ -32,21 +33,22 @@ function PhotoInput({ className, children, id, name, onChange, value, valueUrl }
               key={s.id}
               className={classNames('photo-input__preview', {
                 'photo-input__preview--uploading': s.status === 'pending' || s.status === 'uploading',
-              })}>
-              <img src={s.file.preview} className="img-thumbnail" alt="" />
-              <button onClick={() => onRemove(s)} className="btn btn-danger photo-input__remove" type="button">
+              })}
+            >
+              <img src={s.file.preview} className='img-thumbnail' alt='' />
+              <button onClick={() => onRemove(s)} className='btn btn-danger photo-input__remove' type='button'>
                 &times;
               </button>
-              <div className="spinner-border photo-input__spinner" role="status">
-                <span className="visually-hidden">Loading...</span>
+              <div className='spinner-border photo-input__spinner' role='status'>
+                <span className='visually-hidden'>Loading...</span>
               </div>
             </div>
           ));
         } else if (statuses.length === 0 && value) {
           return (
             <div className={classNames('photo-input__preview')}>
-              <img src={valueUrl} className="img-thumbnail" alt="" />
-              <button onClick={onRemoved} className="btn btn-danger photo-input__remove" type="button">
+              <img src={valueUrl} className='img-thumbnail' alt='' />
+              <button onClick={onRemoved} className='btn btn-danger photo-input__remove' type='button'>
                 &times;
               </button>
             </div>
diff --git a/client/src/Header.jsx b/client/src/Header.jsx
index 2b1d98f..94382ba 100644
--- a/client/src/Header.jsx
+++ b/client/src/Header.jsx
@@ -7,7 +7,7 @@ import './Header.scss';
 import Api from './Api';
 import { useAuthContext } from './AuthContext';
 
-function Header() {
+function Header () {
   const navigate = useNavigate();
   const { user, setUser } = useAuthContext();
   const [isNavbarShowing, setNavbarShowing] = useState(false);
@@ -22,10 +22,10 @@ function Header() {
         }
       });
     },
-    [setUser],
+    [setUser]
   );
 
-  async function onLogout(event) {
+  async function onLogout (event) {
     event.preventDefault();
     await Api.auth.logout();
     setUser(null);
@@ -33,59 +33,59 @@ function Header() {
     navigate('/');
   }
 
-  function toggleNavbar() {
+  function toggleNavbar () {
     setNavbarShowing(!isNavbarShowing);
   }
 
-  function hideNavbar() {
+  function hideNavbar () {
     setNavbarShowing(false);
   }
 
   return (
-    <nav className="header navbar navbar-expand-md navbar-light bg-light fixed-top">
-      <div className="container">
-        <Link className="navbar-brand" to="/" onClick={hideNavbar}>
+    <nav className='header navbar navbar-expand-md navbar-light bg-light fixed-top'>
+      <div className='container'>
+        <Link className='navbar-brand' to='/' onClick={hideNavbar}>
           Full Stack Starter
         </Link>
-        <button onClick={toggleNavbar} className="navbar-toggler" type="button" aria-label="Toggle navigation">
-          <span className="navbar-toggler-icon"></span>
+        <button onClick={toggleNavbar} className='navbar-toggler' type='button' aria-label='Toggle navigation'>
+          <span className='navbar-toggler-icon' />
         </button>
         <div className={classNames('collapse navbar-collapse', { show: isNavbarShowing })}>
-          <ul className="navbar-nav flex-grow-1 mb-2 mb-md-0">
-            <li className="nav-item active">
-              <Link className="nav-link" aria-current="page" to="/" onClick={hideNavbar}>
+          <ul className='navbar-nav flex-grow-1 mb-2 mb-md-0'>
+            <li className='nav-item active'>
+              <Link className='nav-link' aria-current='page' to='/' onClick={hideNavbar}>
                 Home
               </Link>
             </li>
-            <div className="flex-grow-1 d-flex justify-content-end">
+            <div className='flex-grow-1 d-flex justify-content-end'>
               {user && (
                 <>
                   {user.isAdmin && (
-                    <li className="nav-item">
-                      <Link className="nav-link" to="/admin" onClick={hideNavbar}>
+                    <li className='nav-item'>
+                      <Link className='nav-link' to='/admin' onClick={hideNavbar}>
                         Admin
                       </Link>
                     </li>
                   )}
-                  <li className="nav-item me-3">
-                    <span className="nav-link d-inline-block me-1">
+                  <li className='nav-item me-3'>
+                    <span className='nav-link d-inline-block me-1'>
                       Hello,{' '}
-                      <Link to="/account" onClick={hideNavbar}>
+                      <Link to='/account' onClick={hideNavbar}>
                         {user.firstName}!
                       </Link>
                     </span>
-                    {user.pictureUrl && <div className="header__picture" style={{ backgroundImage: `url(${user.pictureUrl})` }}></div>}
+                    {user.pictureUrl && <div className='header__picture' style={{ backgroundImage: `url(${user.pictureUrl})` }} />}
                   </li>
-                  <li className="nav-item">
-                    <a className="nav-link" href="/logout" onClick={onLogout}>
+                  <li className='nav-item'>
+                    <a className='nav-link' href='/logout' onClick={onLogout}>
                       Log out
                     </a>
                   </li>
                 </>
               )}
               {!user && (
-                <li className="nav-item">
-                  <Link className="nav-link" to="/login" onClick={hideNavbar}>
+                <li className='nav-item'>
+                  <Link className='nav-link' to='/login' onClick={hideNavbar}>
                     Log in
                   </Link>
                 </li>
diff --git a/client/src/Home.jsx b/client/src/Home.jsx
index c118579..7f728db 100644
--- a/client/src/Home.jsx
+++ b/client/src/Home.jsx
@@ -1,14 +1,14 @@
 import { Helmet } from 'react-helmet-async';
 import { useStaticContext } from './StaticContext';
 
-function Home() {
+function Home () {
   const staticContext = useStaticContext();
   return (
     <>
       <Helmet>
         <title>Home - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
+      <main className='container'>
         <h1>Home</h1>
       </main>
     </>
diff --git a/client/src/Invites/Invite.jsx b/client/src/Invites/Invite.jsx
index a8e7cb6..e5a7684 100644
--- a/client/src/Invites/Invite.jsx
+++ b/client/src/Invites/Invite.jsx
@@ -10,7 +10,7 @@ import UnexpectedError from '../UnexpectedError';
 import ValidationError from '../ValidationError';
 import { useStaticContext } from '../StaticContext';
 
-function Invite() {
+function Invite () {
   const staticContext = useStaticContext();
   const { setUser: setAuthUser } = useAuthContext();
   const navigate = useNavigate();
@@ -37,20 +37,20 @@ function Invite() {
     }
   }, [inviteId, setAuthUser]);
 
-  function onChange(event) {
+  function onChange (event) {
     const newUser = { ...user };
     newUser[event.target.name] = event.target.value;
     setUser(newUser);
   }
 
-  async function onSubmit(event) {
+  async function onSubmit (event) {
     event.preventDefault();
     setError(null);
     setLoading(true);
     try {
       const response = await Api.invites.accept(invite.id, user);
       setAuthUser(response.data);
-      navigate(`/account`, { state: { flash: 'Your account has been created!' } });
+      navigate('/account', { state: { flash: 'Your account has been created!' } });
     } catch (error) {
       if (error.response?.status === StatusCodes.UNPROCESSABLE_ENTITY) {
         setError(new ValidationError(error.response.data));
@@ -67,12 +67,12 @@ function Invite() {
       <Helmet>
         <title>You&apos;re Invited - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">You&apos;re Invited</h2>
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>You&apos;re Invited</h2>
                 {invite?.acceptedAt && <p>This invite has already been accepted.</p>}
                 {invite?.revokedAt && <p>This invite is no longer available.</p>}
                 {invite && invite.acceptedAt === null && invite.revokedAt === null && (
diff --git a/client/src/Invites/InvitesRoutes.jsx b/client/src/Invites/InvitesRoutes.jsx
index bacccc1..c14c62d 100644
--- a/client/src/Invites/InvitesRoutes.jsx
+++ b/client/src/Invites/InvitesRoutes.jsx
@@ -2,10 +2,10 @@ import { Route, Routes } from 'react-router';
 
 import Invite from './Invite';
 
-function InvitesRoutes() {
+function InvitesRoutes () {
   return (
     <Routes>
-      <Route path=":inviteId" element={<Invite />} />
+      <Route path=':inviteId' element={<Invite />} />
     </Routes>
   );
 }
diff --git a/client/src/Login.jsx b/client/src/Login.jsx
index 83399bb..9ff4487 100644
--- a/client/src/Login.jsx
+++ b/client/src/Login.jsx
@@ -1,12 +1,13 @@
 import { useEffect, useState } from 'react';
 import { Helmet } from 'react-helmet-async';
 import { useNavigate, Link, useLocation, useSearchParams } from 'react-router';
+import { StatusCodes } from 'http-status-codes';
 
 import Api from './Api';
 import { useAuthContext } from './AuthContext';
 import { useStaticContext } from './StaticContext';
 
-function Login() {
+function Login () {
   const staticContext = useStaticContext();
   const authContext = useAuthContext();
   const location = useLocation();
@@ -26,7 +27,7 @@ function Login() {
 
   const [showInvalidError, setShowInvalidError] = useState(false);
 
-  async function onSubmit(event) {
+  async function onSubmit (event) {
     event.preventDefault();
     setShowInvalidError(false);
     try {
@@ -34,7 +35,7 @@ function Login() {
       authContext.setUser(response.data);
       navigate(from, { replace: true });
     } catch (error) {
-      if (error.response?.status === 422) {
+      if (error.response?.status === StatusCodes.UNPROCESSABLE_ENTITY || error.response?.status === StatusCodes.NOT_FOUND) {
         setShowInvalidError(true);
       } else {
         console.log(error);
@@ -47,52 +48,52 @@ function Login() {
       <Helmet>
         <title>Log in - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">Log in</h2>
-                {location.state?.flash && <div className="alert alert-success">{location.state?.flash}</div>}
-                {showInvalidError && <div className="alert alert-danger">Invalid email and/or password.</div>}
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>Log in</h2>
+                {location.state?.flash && <div className='alert alert-success'>{location.state?.flash}</div>}
+                {showInvalidError && <div className='alert alert-danger'>Invalid email and/or password.</div>}
                 <form onSubmit={onSubmit}>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="email">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='email'>
                       Email
                     </label>
                     <input
-                      type="text"
-                      className="form-control"
-                      id="email"
-                      name="email"
+                      type='text'
+                      className='form-control'
+                      id='email'
+                      name='email'
                       value={email}
                       onChange={(e) => setEmail(e.target.value)}
                     />
                   </div>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="password">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='password'>
                       Password
                     </label>
                     <input
-                      type="password"
-                      className="form-control"
-                      id="password"
-                      name="password"
+                      type='password'
+                      className='form-control'
+                      id='password'
+                      name='password'
                       value={password}
                       onChange={(e) => setPassword(e.target.value)}
                     />
                   </div>
-                  <div className="mb-3 d-grid">
-                    <button className="btn btn-primary" type="submit">
+                  <div className='mb-3 d-grid'>
+                    <button className='btn btn-primary' type='submit'>
                       Submit
                     </button>
                   </div>
-                  <div className="mb-3 text-center">
-                    <Link to="/passwords/forgot">Forgot your password?</Link>
+                  <div className='mb-3 text-center'>
+                    <Link to='/passwords/forgot'>Forgot your password?</Link>
                     {staticContext?.env?.VITE_FEATURE_REGISTRATION === 'true' && (
                       <>
                         <br />
-                        <Link to="/register">Need an account?</Link>
+                        <Link to='/register'>Need an account?</Link>
                       </>
                     )}
                   </div>
diff --git a/client/src/Passwords/ForgotPassword.jsx b/client/src/Passwords/ForgotPassword.jsx
index e595642..1d17c20 100644
--- a/client/src/Passwords/ForgotPassword.jsx
+++ b/client/src/Passwords/ForgotPassword.jsx
@@ -6,13 +6,13 @@ import classNames from 'classnames';
 import Api from '../Api';
 import { useStaticContext } from '../StaticContext';
 
-function ForgotPassword() {
+function ForgotPassword () {
   const staticContext = useStaticContext();
   const navigate = useNavigate();
   const [email, setEmail] = useState('');
   const [showError, setShowError] = useState(false);
 
-  function onSubmit(event) {
+  function onSubmit (event) {
     event.preventDefault();
     setShowError(false);
     Api.passwords
@@ -28,35 +28,35 @@ function ForgotPassword() {
       <Helmet>
         <title>Forgot your password? - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">Forgot your password?</h2>
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>Forgot your password?</h2>
                 <p>Enter the email address you registered to receive a reset password link.</p>
                 <form onSubmit={onSubmit}>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="email">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='email'>
                       Email
                     </label>
                     <input
-                      type="text"
+                      type='text'
                       className={classNames('form-control', { 'is-invalid': showError })}
-                      id="email"
-                      name="email"
+                      id='email'
+                      name='email'
                       onChange={(e) => setEmail(e.target.value)}
                       value={email}
                     />
-                    {showError && <div className="invalid-feedback d-block">Email not found.</div>}
+                    {showError && <div className='invalid-feedback d-block'>Email not found.</div>}
                   </div>
-                  <div className="mb-3 d-grid">
-                    <button className="btn btn-primary" type="submit">
+                  <div className='mb-3 d-grid'>
+                    <button className='btn btn-primary' type='submit'>
                       Submit
                     </button>
                   </div>
-                  <div className="mb-3 text-center">
-                    <Link to="/login">Back to login...</Link>
+                  <div className='mb-3 text-center'>
+                    <Link to='/login'>Back to login...</Link>
                   </div>
                 </form>
               </div>
diff --git a/client/src/Passwords/PasswordsRoutes.jsx b/client/src/Passwords/PasswordsRoutes.jsx
index 941f4ef..9b38845 100644
--- a/client/src/Passwords/PasswordsRoutes.jsx
+++ b/client/src/Passwords/PasswordsRoutes.jsx
@@ -3,12 +3,12 @@ import { Navigate, Route, Routes } from 'react-router';
 import ForgotPassword from './ForgotPassword';
 import ResetPassword from './ResetPassword';
 
-function PasswordsRoutes() {
+function PasswordsRoutes () {
   return (
     <Routes>
-      <Route path="" element={<Navigate to="forgot" replace />} />
-      <Route path="forgot" element={<ForgotPassword />} />
-      <Route path="reset/:token" element={<ResetPassword />} />
+      <Route path='' element={<Navigate to='forgot' replace />} />
+      <Route path='forgot' element={<ForgotPassword />} />
+      <Route path='reset/:token' element={<ResetPassword />} />
     </Routes>
   );
 }
diff --git a/client/src/Passwords/ResetPassword.jsx b/client/src/Passwords/ResetPassword.jsx
index 238a89f..5519ca8 100644
--- a/client/src/Passwords/ResetPassword.jsx
+++ b/client/src/Passwords/ResetPassword.jsx
@@ -6,7 +6,7 @@ import classNames from 'classnames';
 import Api from '../Api';
 import { useStaticContext } from '../StaticContext';
 
-function ResetPassword() {
+function ResetPassword () {
   const staticContext = useStaticContext();
   const navigate = useNavigate();
   const { token } = useParams();
@@ -15,7 +15,7 @@ function ResetPassword() {
   const [showExpired, setShowExpired] = useState(false);
   const [showInvalid, setShowInvalid] = useState(false);
 
-  function onSubmit(event) {
+  function onSubmit (event) {
     event.preventDefault();
     setShowError(false);
     setShowInvalid(false);
@@ -40,7 +40,7 @@ function ResetPassword() {
           });
       }
     },
-    [token],
+    [token]
   );
 
   return (
@@ -48,25 +48,25 @@ function ResetPassword() {
       <Helmet>
         <title>Reset your password - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">Reset your password</h2>
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>Reset your password</h2>
                 {showInvalid && (
-                  <div className="alert alert-danger">
+                  <div className='alert alert-danger'>
                     <p>Sorry, this password reset link is invalid.</p>
                     <p>
-                      <Link to="forgot">Request another?</Link>
+                      <Link to='forgot'>Request another?</Link>
                     </p>
                   </div>
                 )}
                 {showExpired && (
-                  <div className="alert alert-danger">
+                  <div className='alert alert-danger'>
                     <p>Sorry, this password reset link has expired.</p>
                     <p>
-                      <Link to="forgot">Request another?</Link>
+                      <Link to='forgot'>Request another?</Link>
                     </p>
                   </div>
                 )}
@@ -74,24 +74,24 @@ function ResetPassword() {
                   <>
                     <p>Enter a new password for your account.</p>
                     <form onSubmit={onSubmit}>
-                      <div className="mb-3">
-                        <label className="form-label" htmlFor="password">
+                      <div className='mb-3'>
+                        <label className='form-label' htmlFor='password'>
                           New password
                         </label>
                         <input
-                          type="password"
+                          type='password'
                           className={classNames('form-control', { 'is-invalid': showError })}
-                          id="password"
-                          name="password"
+                          id='password'
+                          name='password'
                           onChange={(e) => setPassword(e.target.value)}
                           value={password}
                         />
                         {showError && (
-                          <div className="invalid-feedback d-block">Minimum eight characters, at least one letter and one number.</div>
+                          <div className='invalid-feedback d-block'>Minimum eight characters, at least one letter and one number.</div>
                         )}
                       </div>
-                      <div className="mb-3 d-grid">
-                        <button className="btn btn-primary" type="submit">
+                      <div className='mb-3 d-grid'>
+                        <button className='btn btn-primary' type='submit'>
                           Submit
                         </button>
                       </div>
diff --git a/client/src/Register.jsx b/client/src/Register.jsx
index 9b82c13..deba371 100644
--- a/client/src/Register.jsx
+++ b/client/src/Register.jsx
@@ -10,7 +10,7 @@ import UnexpectedError from './UnexpectedError';
 import ValidationError from './ValidationError';
 import { useStaticContext } from './StaticContext';
 
-function Register() {
+function Register () {
   const authContext = useAuthContext();
   const staticContext = useStaticContext();
   const navigate = useNavigate();
@@ -23,13 +23,13 @@ function Register() {
   });
   const [error, setError] = useState(null);
 
-  function onChange(event) {
+  function onChange (event) {
     const newUser = { ...user };
     newUser[event.target.name] = event.target.value;
     setUser(newUser);
   }
 
-  async function onSubmit(event) {
+  async function onSubmit (event) {
     event.preventDefault();
     setError(null);
     try {
@@ -50,15 +50,15 @@ function Register() {
       <Helmet>
         <title>Register - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">Register</h2>
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>Register</h2>
                 <RegistrationForm onChange={onChange} onSubmit={onSubmit} error={error} user={user} />
-                <div className="mb-3 text-center">
-                  <Link to="/login">Already have an account?</Link>
+                <div className='mb-3 text-center'>
+                  <Link to='/login'>Already have an account?</Link>
                 </div>
               </div>
             </div>
diff --git a/client/src/RegistrationForm.jsx b/client/src/RegistrationForm.jsx
index 39f7234..5f4211d 100644
--- a/client/src/RegistrationForm.jsx
+++ b/client/src/RegistrationForm.jsx
@@ -1,69 +1,69 @@
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 
-function RegistrationForm({ error, isLoading, onChange, onSubmit, user }) {
+function RegistrationForm ({ error, isLoading, onChange, onSubmit, user }) {
   return (
     <form onSubmit={onSubmit}>
       <fieldset disabled={isLoading}>
-        {error && error.message && <div className="alert alert-danger">{error.message}</div>}
-        <div className="mb-3">
-          <label className="form-label" htmlFor="firstName">
+        {error && error.message && <div className='alert alert-danger'>{error.message}</div>}
+        <div className='mb-3'>
+          <label className='form-label' htmlFor='firstName'>
             First name
           </label>
           <input
-            type="text"
+            type='text'
             className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('firstName') })}
-            id="firstName"
-            name="firstName"
+            id='firstName'
+            name='firstName'
             onChange={onChange}
             value={user.firstName}
           />
           {error?.errorMessagesHTMLFor?.('firstName')}
         </div>
-        <div className="mb-3">
-          <label className="form-label" htmlFor="lastName">
+        <div className='mb-3'>
+          <label className='form-label' htmlFor='lastName'>
             Last name
           </label>
           <input
-            type="text"
+            type='text'
             className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('lastName') })}
-            id="lastName"
-            name="lastName"
+            id='lastName'
+            name='lastName'
             onChange={onChange}
             value={user.lastName}
           />
           {error?.errorMessagesHTMLFor?.('lastName')}
         </div>
-        <div className="mb-3">
-          <label className="form-label" htmlFor="email">
+        <div className='mb-3'>
+          <label className='form-label' htmlFor='email'>
             Email
           </label>
           <input
-            type="email"
+            type='email'
             className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('email') })}
-            id="email"
-            name="email"
+            id='email'
+            name='email'
             onChange={onChange}
             value={user.email}
           />
           {error?.errorMessagesHTMLFor?.('email')}
         </div>
-        <div className="mb-3">
-          <label className="form-label" htmlFor="password">
+        <div className='mb-3'>
+          <label className='form-label' htmlFor='password'>
             Password
           </label>
           <input
-            type="password"
+            type='password'
             className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('password') })}
-            id="password"
-            name="password"
+            id='password'
+            name='password'
             onChange={onChange}
             value={user.password}
           />
           {error?.errorMessagesHTMLFor?.('password')}
         </div>
-        <div className="mb-3 d-grid">
-          <button className="btn btn-primary" type="submit">
+        <div className='mb-3 d-grid'>
+          <button className='btn btn-primary' type='submit'>
             Submit
           </button>
         </div>
diff --git a/client/src/StaticContext.js b/client/src/StaticContext.js
index 687a733..fc2bf25 100644
--- a/client/src/StaticContext.js
+++ b/client/src/StaticContext.js
@@ -12,6 +12,6 @@ export const defaultValue = {
   },
 };
 
-export function useStaticContext() {
+export function useStaticContext () {
   return useContext(staticContext);
 }
diff --git a/client/src/StaticContextProvider.jsx b/client/src/StaticContextProvider.jsx
index 6d6a82c..76fe95e 100644
--- a/client/src/StaticContextProvider.jsx
+++ b/client/src/StaticContextProvider.jsx
@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 
 import { staticContext } from './StaticContext';
 
-function StaticContextProvider({ value, children }) {
+function StaticContextProvider ({ value, children }) {
   return <staticContext.Provider value={value}>{children}</staticContext.Provider>;
 }
 
diff --git a/client/src/UnexpectedError.js b/client/src/UnexpectedError.js
index a4dad00..3a763c5 100644
--- a/client/src/UnexpectedError.js
+++ b/client/src/UnexpectedError.js
@@ -1,5 +1,5 @@
 class UnexpectedError extends Error {
-  constructor() {
+  constructor () {
     super('An unexpected error has occurred. Please try again.');
   }
 }
diff --git a/client/src/Users/UserForm.jsx b/client/src/Users/UserForm.jsx
index df39d29..e7a458a 100644
--- a/client/src/Users/UserForm.jsx
+++ b/client/src/Users/UserForm.jsx
@@ -11,7 +11,7 @@ import PhotoInput from '../Components/PhotoInput';
 import UnexpectedError from '../UnexpectedError';
 import ValidationError from '../ValidationError';
 
-function UserForm() {
+function UserForm () {
   const staticContext = useStaticContext();
   const authContext = useAuthContext();
   const location = useLocation();
@@ -36,24 +36,24 @@ function UserForm() {
         setUser({
           ...response.data,
           password: '',
-        }),
+        })
       );
     }
   }, [userId]);
 
-  function onChange(event) {
+  function onChange (event) {
     const newUser = { ...user };
     newUser[event.target.name] = event.target.value;
     setUser(newUser);
   }
 
-  function onToggle(event) {
+  function onToggle (event) {
     const newUser = { ...user };
     newUser[event.target.name] = event.target.checked;
     setUser(newUser);
   }
 
-  async function onSubmit(event) {
+  async function onSubmit (event) {
     event.preventDefault();
     setError(null);
     setSuccess(false);
@@ -77,113 +77,114 @@ function UserForm() {
       <Helmet>
         <title>My Account - {staticContext?.env?.VITE_SITE_TITLE ?? ''}</title>
       </Helmet>
-      <main className="container">
-        <div className="row justify-content-center">
-          <div className="col col-sm-10 col-md-8 col-lg-6 col-xl-4">
-            <div className="card">
-              <div className="card-body">
-                <h2 className="card-title">My Account</h2>
-                {location.state?.flash && <div className="alert alert-success">{location.state?.flash}</div>}
+      <main className='container'>
+        <div className='row justify-content-center'>
+          <div className='col col-sm-10 col-md-8 col-lg-6 col-xl-4'>
+            <div className='card'>
+              <div className='card-body'>
+                <h2 className='card-title'>My Account</h2>
+                {location.state?.flash && <div className='alert alert-success'>{location.state?.flash}</div>}
                 <form onSubmit={onSubmit}>
-                  {error && error.message && <div className="alert alert-danger">{error.message}</div>}
-                  {success && <div className="alert alert-info">Your account has been updated!</div>}
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="picture">
+                  {error && error.message && <div className='alert alert-danger'>{error.message}</div>}
+                  {success && <div className='alert alert-info'>Your account has been updated!</div>}
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='picture'>
                       Picture
                     </label>
                     <PhotoInput
-                      className="card"
-                      id="picture"
-                      name="picture"
+                      className='card'
+                      id='picture'
+                      name='picture'
                       value={user.picture}
                       valueUrl={user.pictureUrl}
                       onChange={onChange}
-                      onUploading={setUploading}>
-                      <div className="card-body">
-                        <div className="card-text">Drag-and-drop a photo file here, or click here to browse and select a file.</div>
+                      onUploading={setUploading}
+                    >
+                      <div className='card-body'>
+                        <div className='card-text'>Drag-and-drop a photo file here, or click here to browse and select a file.</div>
                       </div>
                     </PhotoInput>
                     {error?.errorMessagesHTMLFor?.('picture')}
                   </div>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="firstName">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='firstName'>
                       First name
                     </label>
                     <input
-                      type="text"
+                      type='text'
                       className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('firstName') })}
-                      id="firstName"
-                      name="firstName"
+                      id='firstName'
+                      name='firstName'
                       onChange={onChange}
                       value={user.firstName}
                     />
                     {error?.errorMessagesHTMLFor?.('firstName')}
                   </div>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="lastName">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='lastName'>
                       Last name
                     </label>
                     <input
-                      type="text"
+                      type='text'
                       className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('lastName') })}
-                      id="lastName"
-                      name="lastName"
+                      id='lastName'
+                      name='lastName'
                       onChange={onChange}
                       value={user.lastName}
                     />
                     {error?.errorMessagesHTMLFor?.('lastName')}
                   </div>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="email">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='email'>
                       Email
                     </label>
                     <input
-                      type="text"
+                      type='text'
                       className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('email') })}
-                      id="email"
-                      name="email"
+                      id='email'
+                      name='email'
                       onChange={onChange}
                       value={user.email}
                     />
                     {error?.errorMessagesHTMLFor?.('email')}
                   </div>
-                  <div className="mb-3">
-                    <label className="form-label" htmlFor="password">
+                  <div className='mb-3'>
+                    <label className='form-label' htmlFor='password'>
                       Password
                     </label>
                     <input
-                      type="password"
+                      type='password'
                       className={classNames('form-control', { 'is-invalid': error?.errorsFor?.('password') })}
-                      id="password"
-                      name="password"
+                      id='password'
+                      name='password'
                       onChange={onChange}
                       value={user.password}
                     />
                     {error?.errorMessagesHTMLFor?.('password')}
                   </div>
                   {authContext.user.isAdmin && (
-                    <div className="mb-3">
-                      <label className="form-label" htmlFor="isAdmin">
+                    <div className='mb-3'>
+                      <label className='form-label' htmlFor='isAdmin'>
                         Administrator
                       </label>
-                      <div className="form-check">
+                      <div className='form-check'>
                         <input
-                          type="checkbox"
+                          type='checkbox'
                           className={classNames('form-check-input', { 'is-invalid': error?.errorsFor?.('isAdmin') })}
-                          id="isAdmin"
-                          name="isAdmin"
+                          id='isAdmin'
+                          name='isAdmin'
                           onChange={onToggle}
                           checked={user.isAdmin}
                         />
-                        <label htmlFor="isAdmin" className="form-check-label">
+                        <label htmlFor='isAdmin' className='form-check-label'>
                           Is an administrator?
                         </label>
                       </div>
                       {error?.errorMessagesHTMLFor?.('isAdmin')}
                     </div>
                   )}
-                  <div className="mb-3 d-grid">
-                    <button disabled={isUploading} className="btn btn-primary" type="submit">
+                  <div className='mb-3 d-grid'>
+                    <button disabled={isUploading} className='btn btn-primary' type='submit'>
                       Submit
                     </button>
                   </div>
diff --git a/client/src/Users/UsersRoutes.jsx b/client/src/Users/UsersRoutes.jsx
index 62832fa..4ce8c29 100644
--- a/client/src/Users/UsersRoutes.jsx
+++ b/client/src/Users/UsersRoutes.jsx
@@ -2,10 +2,10 @@ import { Route, Routes } from 'react-router';
 
 import UserForm from './UserForm';
 
-function UsersRoutes() {
+function UsersRoutes () {
   return (
     <Routes>
-      <Route path="" element={<UserForm />} />
+      <Route path='' element={<UserForm />} />
     </Routes>
   );
 }
diff --git a/client/src/ValidationError.jsx b/client/src/ValidationError.jsx
index 0aa87e2..0fdc146 100644
--- a/client/src/ValidationError.jsx
+++ b/client/src/ValidationError.jsx
@@ -1,20 +1,20 @@
 import { capitalize } from 'inflection';
 
 class ValidationError extends Error {
-  constructor(data) {
+  constructor (data) {
     super();
     this.data = data;
   }
 
-  errorsFor(name) {
+  errorsFor (name) {
     const errors = this.data.errors.filter((e) => e.path === name);
     return errors.length ? errors : null;
   }
 
-  errorMessagesHTMLFor(name) {
+  errorMessagesHTMLFor (name) {
     const errors = this.errorsFor(name);
     if (errors) {
-      return <div className="invalid-feedback d-block">{capitalize([...new Set(errors.map((e) => e.message))].join(', '))}.</div>;
+      return <div className='invalid-feedback d-block'>{capitalize([...new Set(errors.map((e) => e.message))].join(', '))}.</div>;
     }
   }
 }
diff --git a/client/src/entry-server.jsx b/client/src/entry-server.jsx
index 42acab2..d90546f 100644
--- a/client/src/entry-server.jsx
+++ b/client/src/entry-server.jsx
@@ -7,7 +7,7 @@ import StaticContextProvider from './StaticContextProvider';
 import { handleRedirects } from './AppRedirectsConfig';
 import App from './App';
 
-export function render(request, reply, helmetContext, staticContext) {
+export function render (request, reply, helmetContext, staticContext) {
   const { url: location } = request;
   const path = request.urlData('path');
   const isRedirected = handleRedirects(request, location, path, (to, state) => {
@@ -32,6 +32,6 @@ export function render(request, reply, helmetContext, staticContext) {
           <App />
         </StaticRouter>
       </HelmetProvider>
-    </StaticContextProvider>,
+    </StaticContextProvider>
   );
 }
diff --git a/package-lock.json b/package-lock.json
index 386c65b..3adb8de 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,15 +33,12 @@
         "react-router": "^7.1.1"
       },
       "devDependencies": {
-        "@eslint/js": "^9.17.0",
         "@types/react": "^18.3.18",
         "@types/react-dom": "^18.3.5",
         "@vitejs/plugin-react-swc": "^3.7.2",
         "eslint": "^9.17.0",
-        "eslint-plugin-react": "^7.37.2",
-        "eslint-plugin-react-hooks": "^5.0.0",
-        "eslint-plugin-react-refresh": "^0.4.16",
         "globals": "^15.14.0",
+        "neostandard": "^0.12.0",
         "sass": "^1.83.0",
         "vite": "^6.0.7"
       },
@@ -1854,29 +1851,6 @@
         "mime": "^3"
       }
     },
-    "node_modules/@fastify/sensible": {
-      "version": "6.0.2",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/fastify"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/fastify"
-        }
-      ],
-      "license": "MIT",
-      "dependencies": {
-        "@lukeed/ms": "^2.0.2",
-        "dequal": "^2.0.3",
-        "fastify-plugin": "^5.0.0",
-        "forwarded": "^0.2.0",
-        "http-errors": "^2.0.0",
-        "type-is": "^1.6.18",
-        "vary": "^1.1.2"
-      }
-    },
     "node_modules/@fastify/static": {
       "version": "8.0.3",
       "resolved": "https://registry.npmjs.org/@fastify/static/-/static-8.0.3.tgz",
@@ -8013,29 +7987,6 @@
         "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7"
       }
     },
-    "node_modules/eslint-plugin-react-hooks": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-5.1.0.tgz",
-      "integrity": "sha512-mpJRtPgHN2tNAvZ35AMfqeB3Xqeo273QxrHJsbBEPWODRM4r0yB6jfoROqKEYrOn27UtRPpcpHc2UqyBSuUNTw==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=10"
-      },
-      "peerDependencies": {
-        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0"
-      }
-    },
-    "node_modules/eslint-plugin-react-refresh": {
-      "version": "0.4.16",
-      "resolved": "https://registry.npmjs.org/eslint-plugin-react-refresh/-/eslint-plugin-react-refresh-0.4.16.tgz",
-      "integrity": "sha512-slterMlxAhov/DZO8NScf6mEeMBBXodFUolijDvrtTxyezyLoTQaa73FyYus/VbTdftd8wBgBxPMRk3poleXNQ==",
-      "dev": true,
-      "license": "MIT",
-      "peerDependencies": {
-        "eslint": ">=8.40"
-      }
-    },
     "node_modules/eslint-plugin-react/node_modules/brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -10835,13 +10786,6 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/media-typer": {
-      "version": "0.3.0",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/mensch": {
       "version": "0.3.4",
       "resolved": "https://registry.npmjs.org/mensch/-/mensch-0.3.4.tgz",
@@ -14298,17 +14242,6 @@
         "node": ">=4"
       }
     },
-    "node_modules/type-is": {
-      "version": "1.6.18",
-      "license": "MIT",
-      "dependencies": {
-        "media-typer": "0.3.0",
-        "mime-types": "~2.1.24"
-      },
-      "engines": {
-        "node": ">= 0.6"
-      }
-    },
     "node_modules/typed-array-buffer": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
@@ -14568,13 +14501,6 @@
         "node": ">=10"
       }
     },
-    "node_modules/vary": {
-      "version": "1.1.2",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.8"
-      }
-    },
     "node_modules/vite": {
       "version": "6.0.7",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.0.7.tgz",
@@ -15186,7 +15112,6 @@
         "@aws-sdk/cloudfront-signer": "^3.709.0",
         "@aws-sdk/s3-request-presigner": "^3.717.0",
         "@fastify/autoload": "^6.0.0",
-        "@fastify/sensible": "^6.0.0",
         "@fastify/static": "^8.0.3",
         "@fastify/swagger": "^9.4.0",
         "@fastify/url-data": "^6.0.2",

From 1bbbbe77e14d540f5fc627008fe2ce9d1ac0b467 Mon Sep 17 00:00:00 2001
From: Francis Li <mail@francisli.com>
Date: Sun, 5 Jan 2025 14:36:36 -0800
Subject: [PATCH 2/5] Switch to delete for logout

---
 client/src/Api.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/Api.js b/client/src/Api.js
index e2c8a17..fbbf485 100644
--- a/client/src/Api.js
+++ b/client/src/Api.js
@@ -46,7 +46,7 @@ const Api = {
       return instance.post('/api/auth/login', { email, password });
     },
     logout () {
-      return instance.get('/api/auth/logout');
+      return instance.delete('/api/auth/logout');
     },
     register (data) {
       return instance.post('/api/auth/register', data);

From 4c52e059f8988edfcfcb142d139502eece2d019b Mon Sep 17 00:00:00 2001
From: Francis Li <mail@francisli.com>
Date: Sun, 5 Jan 2025 15:09:54 -0800
Subject: [PATCH 3/5] Updated README

---
 README.md | 68 +++++++++++++++++++++++++++++++++++++++++++++----------
 1 file changed, 56 insertions(+), 12 deletions(-)

diff --git a/README.md b/README.md
index a6b7c1e..bbb44a0 100644
--- a/README.md
+++ b/README.md
@@ -1,14 +1,15 @@
-# Full-Stack Starter
+# Full Stack Starter
 
 This repository contains a "starter" project for web application development in JavaScript. This includes the following components, from front-end to back-end:
 
-- React 18.2.0
-- React Router 6.20.0
-- Bootstrap 5.3.2
-- Node.js 20.11.0
-- Express 4.18.2
-- Sequelize 6.35.1
-- Postgres 15.5
+- React 18.3.1
+- React Router 7.1.1
+- Bootstrap 5.3.3
+- Vite 6.0.7
+- Fastify 5.2.0
+- Prisma 6.1.0
+- Node.js 22.12.0
+- Postgres 17.2
 
 ## One-time Setup
 
@@ -42,10 +43,10 @@ This repository contains a "starter" project for web application development in
 
    ```
    full-stack-starter-server-1       | 5:31:23 PM client.1 |    VITE v4.3.9  ready in 327 ms
-   full-stack-starter-server-1       | 5:31:23 PM client.1 |    ➜  Local:   http://localhost:3000/
+   full-stack-starter-server-1       | 5:31:23 PM client.1 |    ➜  Local:   http://localhost:5000/
    ```
 
-5. Now you should be able to open the web app in your browser at: http://localhost:3000/
+5. Now you should be able to open the web app in your browser at: http://localhost:5000/
 
 6. Open a new tab or window of your shell, change into your repo directory as needed, and execute this command:
 
@@ -90,6 +91,49 @@ This repository contains a "starter" project for web application development in
 8. That's it! After all this setup is complete, the only command you need to run to get
    started again is the `docker compose up` command.
 
+## Development Tools
+
+This project includes components with helpful developer tools, such as the following:
+
+1. Mailcatcher
+
+   The Docker Compose configuration includes the Mailcatcher development mail server. Email sent from the
+   server will be captured by this mail server and can be viewed on the web at:
+
+   http://localhost:1080
+
+   NO live emails will be sent over the Internet.
+
+2. Prisma Studio
+
+   The Prisma library includes a web interface for browsing the contents of the development database at:
+
+   http://localhost:5555
+
+3. Scalar API Documentation Renderer
+
+   The Scalar library automatically generates web-based API documentation for the server based on the
+   Swagger/OpenAPI schema definitions included with each route, viewable at:
+
+   http://localhost:5000/api/reference
+
+4. Minio
+
+   The Docker Compose configuration includes the Minio object storage server as a local development
+   simulation of AWS S3. You can browse the contents of the storage server at:
+
+   http://localhost:9001
+
+   Username and password are: minioadmin/minioadmin
+
+## Testing
+
+This repo includes a Github Actions workflow for running server tests. To test locally, log in
+to a running server container as describe above (`docker compose exec server bash -l`) and then run
+`npm test`. The server tests use the Testcontainers library to automatically launch test databases and
+storage servers for testing- if tests terminate unexpectedly, you may have dangling/orphan containers
+running. Use `docker ps` to list and check running containers.
+
 ## Heroku Deployment Setup
 
 1. Sign up for a Heroku account at: https://signup.heroku.com/
@@ -290,8 +334,8 @@ This repository contains a "starter" project for web application development in
 
 ## License
 
-Full-Stack Starter  
-Copyright (C) 2023 <Dev/Mission>
+Full Stack Starter  
+Copyright (C) 2025 Dev/Mission
 
 This program is free software: you can redistribute it and/or modify
 it under the terms of the GNU Affero General Public License as

From 2ceb0d63ce7ecfb9fd30f2d3154fcab704eb4fcd Mon Sep 17 00:00:00 2001
From: Francis Li <mail@francisli.com>
Date: Sun, 5 Jan 2025 16:27:47 -0800
Subject: [PATCH 4/5] Starting documentation, make tests a bit more reliable

---
 compose.yml                        |  1 +
 server/routes/api/assets/create.js |  1 +
 server/routes/api/assets/get.js    |  5 +++
 server/routes/root.js              | 60 ++++++++++++++++--------------
 server/test/helper.js              |  7 ++++
 5 files changed, 47 insertions(+), 27 deletions(-)

diff --git a/compose.yml b/compose.yml
index 4eb78e6..0383d08 100644
--- a/compose.yml
+++ b/compose.yml
@@ -44,3 +44,4 @@ networks:
   app:
     name: app
     driver: bridge
+    external: true
diff --git a/server/routes/api/assets/create.js b/server/routes/api/assets/create.js
index 9088aaa..4cf6531 100644
--- a/server/routes/api/assets/create.js
+++ b/server/routes/api/assets/create.js
@@ -9,6 +9,7 @@ export default async function (fastify, opts) {
   fastify.post('/',
     {
       schema: {
+        description: 'Returns a signed URL for asset upload to storage.',
         body: z.object({
           contentType: z.string(),
         }),
diff --git a/server/routes/api/assets/get.js b/server/routes/api/assets/get.js
index b0a71c0..395eb16 100644
--- a/server/routes/api/assets/get.js
+++ b/server/routes/api/assets/get.js
@@ -2,6 +2,11 @@ import s3 from '#lib/s3.js';
 
 export default async function (fastify, opts) {
   fastify.get('/*',
+    {
+      schema: {
+        description: 'Redirects to a signed url for the specified asset in storage',
+      }
+    },
     async function (request, reply) {
       const { '*': assetPath } = request.params;
       const url = await s3.getSignedAssetUrl(assetPath, 900);
diff --git a/server/routes/root.js b/server/routes/root.js
index 876eabb..3117bb4 100644
--- a/server/routes/root.js
+++ b/server/routes/root.js
@@ -23,34 +23,40 @@ export default async function (fastify, opts) {
     index: false,
   });
 
-  fastify.get('/*', async function (request, reply) {
-    const accept = accepts(request.raw);
-    if (accept.types(['html'])) {
-      try {
-        const { render } = await import('../../client/dist/server/entry-server.js');
-        const helmetContext = {};
-        const staticContext = { context: { env: {} } };
-        Object.keys(process.env).forEach((key) => {
-          if (key.startsWith('VITE_')) {
-            staticContext.context.env[key] = process.env[key];
+  fastify.get('/*',
+    {
+      schema: {
+        description: 'This catch-all route returns the html markup fo the client SPA after performing server-side rendering.',
+      }
+    },
+    async function (request, reply) {
+      const accept = accepts(request.raw);
+      if (accept.types(['html'])) {
+        try {
+          const { render } = await import('../../client/dist/server/entry-server.js');
+          const helmetContext = {};
+          const staticContext = { context: { env: {} } };
+          Object.keys(process.env).forEach((key) => {
+            if (key.startsWith('VITE_')) {
+              staticContext.context.env[key] = process.env[key];
+            }
+          });
+          const app = render(request, reply, helmetContext, staticContext);
+          if (app) {
+            const { helmet } = helmetContext;
+            reply.header('Content-Type', 'text/html');
+            reply.send(
+              HTML.replace(/<title\b[^>]*>(.*?)<\/title>/i, helmet.title.toString())
+                .replace('window.STATIC_CONTEXT = {}', `window.STATIC_CONTEXT=${JSON.stringify(staticContext.context)}`)
+                .replace('<div id="root"></div>', `<div id="root">${app}</div>`)
+            );
           }
-        });
-        const app = render(request, reply, helmetContext, staticContext);
-        if (app) {
-          const { helmet } = helmetContext;
-          reply.header('Content-Type', 'text/html');
-          reply.send(
-            HTML.replace(/<title\b[^>]*>(.*?)<\/title>/i, helmet.title.toString())
-              .replace('window.STATIC_CONTEXT = {}', `window.STATIC_CONTEXT=${JSON.stringify(staticContext.context)}`)
-              .replace('<div id="root"></div>', `<div id="root">${app}</div>`)
-          );
+        } catch (error) {
+          console.error(error);
+          reply.code(StatusCodes.INTERNAL_SERVER_ERROR).send();
         }
-      } catch (error) {
-        console.error(error);
-        reply.code(StatusCodes.INTERNAL_SERVER_ERROR).send();
+      } else {
+        reply.code(StatusCodes.NOT_ACCEPTABLE).send();
       }
-    } else {
-      reply.code(StatusCodes.NOT_ACCEPTABLE).send();
-    }
-  });
+    });
 }
diff --git a/server/test/helper.js b/server/test/helper.js
index 3c84282..f7cc964 100644
--- a/server/test/helper.js
+++ b/server/test/helper.js
@@ -99,6 +99,7 @@ async function build (t) {
     await t.prisma.$disconnect();
     await app.prisma.$disconnect();
     await prisma.$executeRawUnsafe(`DROP DATABASE IF EXISTS ${startedDbContainer.getDatabase()} WITH (FORCE)`);
+    await sleep(100);
     await prisma.$executeRawUnsafe(`CREATE DATABASE ${startedDbContainer.getDatabase()} `);
     await app.prisma.$connect();
     await t.prisma.$connect();
@@ -140,6 +141,12 @@ async function authenticate (app, email, password) {
   };
 }
 
+function sleep (ms) {
+  return new Promise((resolve) => {
+    setTimeout(resolve, ms);
+  });
+}
+
 async function upload (fixtures) {
   return Promise.all(
     fixtures.map((f) => s3.putObject(path.join('_uploads', f[1]), path.resolve(__dirname, `fixtures/assets/${f[0]}`)))

From f2f0978a09e9ea40cae9d0e8175fd83eb547f6ff Mon Sep 17 00:00:00 2001
From: Francis Li <mail@francisli.com>
Date: Sun, 5 Jan 2025 16:37:07 -0800
Subject: [PATCH 5/5] Add descriptions for all API endpoints

---
 server/routes/api/auth/login.js       |  1 +
 server/routes/api/auth/logout.js      | 14 ++++++++++----
 server/routes/api/auth/register.js    |  1 +
 server/routes/api/invites/create.js   |  1 +
 server/routes/api/invites/get.js      |  1 +
 server/routes/api/invites/list.js     |  1 +
 server/routes/api/invites/resend.js   |  1 +
 server/routes/api/invites/revoke.js   |  1 +
 server/routes/api/passwords/create.js |  1 +
 server/routes/api/passwords/get.js    |  1 +
 server/routes/api/passwords/patch.js  |  1 +
 server/routes/api/users/get.js        |  1 +
 server/routes/api/users/list.js       |  1 +
 server/routes/api/users/me.js         |  1 +
 server/routes/api/users/patch.js      |  1 +
 15 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/server/routes/api/auth/login.js b/server/routes/api/auth/login.js
index 446eeb6..b8f09f1 100644
--- a/server/routes/api/auth/login.js
+++ b/server/routes/api/auth/login.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.post('/login',
     {
       schema: {
+        description: 'Creates an authenticated session with email and password.',
         body: z.object({
           email: z.string().email(),
           password: z.string(),
diff --git a/server/routes/api/auth/logout.js b/server/routes/api/auth/logout.js
index 368dbde..2560f92 100644
--- a/server/routes/api/auth/logout.js
+++ b/server/routes/api/auth/logout.js
@@ -1,6 +1,12 @@
 export default async function (fastify, opts) {
-  fastify.delete('/logout', async function (request, reply) {
-    request.session.delete();
-    return reply.send();
-  });
+  fastify.delete('/logout',
+    {
+      schema: {
+        description: 'Logs out the current user by deleting the current session.'
+      }
+    },
+    async function (request, reply) {
+      request.session.delete();
+      return reply.send();
+    });
 }
diff --git a/server/routes/api/auth/register.js b/server/routes/api/auth/register.js
index 01ea7ed..787f727 100644
--- a/server/routes/api/auth/register.js
+++ b/server/routes/api/auth/register.js
@@ -9,6 +9,7 @@ export default async function (fastify, opts) {
   fastify.post('/register',
     {
       schema: {
+        description: 'Creates a new User. If registration is disabled, then a valid Invite id is required.',
         body: User.RegisterSchema,
         response: {
           [StatusCodes.CREATED]: User.ResponseSchema,
diff --git a/server/routes/api/invites/create.js b/server/routes/api/invites/create.js
index fe20296..3aa3fe5 100644
--- a/server/routes/api/invites/create.js
+++ b/server/routes/api/invites/create.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.post('/',
     {
       schema: {
+        description: 'Creates a new Invite and sends it via email.',
         body: Invite.AttibutesSchema,
         response: {
           [StatusCodes.CREATED]: Invite.ResponseSchema,
diff --git a/server/routes/api/invites/get.js b/server/routes/api/invites/get.js
index 35f030d..c70f945 100644
--- a/server/routes/api/invites/get.js
+++ b/server/routes/api/invites/get.js
@@ -8,6 +8,7 @@ export default async function (fastify, opts) {
     '/:id',
     {
       schema: {
+        description: 'Returns an Invite by id if valid',
         params: z.object({
           id: z.string().uuid()
         }),
diff --git a/server/routes/api/invites/list.js b/server/routes/api/invites/list.js
index af9a882..40a0c5d 100644
--- a/server/routes/api/invites/list.js
+++ b/server/routes/api/invites/list.js
@@ -6,6 +6,7 @@ import Invite from '#models/invite.js';
 export default async function (fastify, opts) {
   fastify.get('/', {
     schema: {
+      description: 'Returns a paginated list of Invites.',
       querystring: z.object({
         page: z.number().optional(),
         perPage: z.number().optional(),
diff --git a/server/routes/api/invites/resend.js b/server/routes/api/invites/resend.js
index 1be7556..694f2dc 100644
--- a/server/routes/api/invites/resend.js
+++ b/server/routes/api/invites/resend.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.patch('/:id/resend',
     {
       schema: {
+        description: 'Resends an Invite by email.',
         params: z.object({
           id: z.string().uuid()
         }),
diff --git a/server/routes/api/invites/revoke.js b/server/routes/api/invites/revoke.js
index 3c64315..619f455 100644
--- a/server/routes/api/invites/revoke.js
+++ b/server/routes/api/invites/revoke.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.delete('/:id',
     {
       schema: {
+        description: 'Revokes an Invite by id',
         params: z.object({
           id: z.string().uuid()
         }),
diff --git a/server/routes/api/passwords/create.js b/server/routes/api/passwords/create.js
index 8880ef3..c90cbb7 100644
--- a/server/routes/api/passwords/create.js
+++ b/server/routes/api/passwords/create.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.post('/',
     {
       schema: {
+        description: 'Requests a password reset email.',
         body: z.object({
           email: z.string().email(),
         }),
diff --git a/server/routes/api/passwords/get.js b/server/routes/api/passwords/get.js
index ea21c66..d58bdbd 100644
--- a/server/routes/api/passwords/get.js
+++ b/server/routes/api/passwords/get.js
@@ -8,6 +8,7 @@ export default async function (fastify, opts) {
     '/:token',
     {
       schema: {
+        description: 'Returns a status code whether the specified password reset token is valid or not.',
         params: z.object({
           token: z.string(),
         }),
diff --git a/server/routes/api/passwords/patch.js b/server/routes/api/passwords/patch.js
index 0dc5fca..8cb0191 100644
--- a/server/routes/api/passwords/patch.js
+++ b/server/routes/api/passwords/patch.js
@@ -8,6 +8,7 @@ export default async function (fastify, opts) {
     '/:token',
     {
       schema: {
+        description: 'Sets a new password for the User associated with the token.',
         params: z.object({
           token: z.string(),
         }),
diff --git a/server/routes/api/users/get.js b/server/routes/api/users/get.js
index 6dd3871..541a1a7 100644
--- a/server/routes/api/users/get.js
+++ b/server/routes/api/users/get.js
@@ -8,6 +8,7 @@ export default async function (fastify, opts) {
     '/:id',
     {
       schema: {
+        descriptions: 'Returns a User object by id.',
         params: z.object({
           id: z.string().uuid()
         }),
diff --git a/server/routes/api/users/list.js b/server/routes/api/users/list.js
index 699ff85..d3d9aff 100644
--- a/server/routes/api/users/list.js
+++ b/server/routes/api/users/list.js
@@ -6,6 +6,7 @@ import User from '#models/user.js';
 export default async function (fastify, opts) {
   fastify.get('/', {
     schema: {
+      description: 'Returns a paginated list of Users.',
       querystring: z.object({
         page: z.number().optional(),
         perPage: z.number().optional(),
diff --git a/server/routes/api/users/me.js b/server/routes/api/users/me.js
index 2a1daf5..086e613 100644
--- a/server/routes/api/users/me.js
+++ b/server/routes/api/users/me.js
@@ -7,6 +7,7 @@ export default async function (fastify, opts) {
   fastify.get('/me',
     {
       schema: {
+        description: 'Returns the currently logged in User object, if any.',
         response: {
           [StatusCodes.OK]: User.ResponseSchema,
           [StatusCodes.NO_CONTENT]: z.null(),
diff --git a/server/routes/api/users/patch.js b/server/routes/api/users/patch.js
index b17dd68..e668090 100644
--- a/server/routes/api/users/patch.js
+++ b/server/routes/api/users/patch.js
@@ -9,6 +9,7 @@ export default async function (fastify, opts) {
   fastify.patch('/:id',
     {
       schema: {
+        description: 'Updates a User object by id.',
         params: z.object({
           id: z.string().uuid()
         }),