⬇️ Downgrade NextJS and React

Middleware didn't work in v12.2.3. Hopefully the password protection will work again now.

src/pages/_middleware.ts

@@ -0,0 +1,16 @@
+import { NextFetchEvent, NextRequest, NextResponse } from 'next/server';
+
+// eslint-disable-next-line consistent-return
+export function middleware(req: NextRequest, ev: NextFetchEvent) {
+  const isCorrectPassword = req.cookies.password === process.env.PASSWORD;
+  const url = req.nextUrl.clone();
+  if (
+    !isCorrectPassword &&
+    url.pathname !== '/login' &&
+    process.env.PASSWORD &&
+    url.pathname !== '/api/configs/tryPassword'
+  ) {
+    url.pathname = '/login';
+    return NextResponse.rewrite(url);
+  }
+}

src/pages/api/docker/container/[id].tsx

@@ -42,9 +42,7 @@ async function Get(req: NextApiRequest, res: NextApiResponse) {
       message: `Container ${id} ${action}ed`,
     });
   } catch (err) {
-    return res.status(500).json(
-      err,
-    );
+    return res.status(500).json(err);
   }
 }
 

src/pages/api/modules/systeminfo.ts

@@ -1,30 +0,0 @@
-import { NextApiRequest, NextApiResponse } from 'next';
-import si from 'systeminformation';
-
-async function Get(req: NextApiRequest, res: NextApiResponse) {
-  const [osInfo, cpuInfo, memInfo, cpuLoad] = await Promise.all([
-    si.osInfo(),
-    si.cpu(),
-    si.mem(),
-    si.currentLoad(),
-  ]);
-
-  const sysinfo = {
-    cpu: cpuInfo,
-    os: osInfo,
-    mem: memInfo,
-    load: cpuLoad,
-  };
-  res.status(200).json(sysinfo);
-}
-
-export default async (req: NextApiRequest, res: NextApiResponse) => {
-  // Filter out if the reuqest is a POST or a GET
-  if (req.method === 'GET') {
-    return Get(req, res);
-  }
-  return res.status(405).json({
-    statusCode: 405,
-    message: 'Method not allowed',
-  });
-};

src/pages/login.tsx

@@ -5,10 +5,11 @@ import { useForm } from '@mantine/hooks';
 import { showNotification, updateNotification } from '@mantine/notifications';
 import axios from 'axios';
 import { IconCheck, IconX } from '@tabler/icons';
-import { Logo } from '../components/layout/Logo';
+import { useRouter } from 'next/router';
 
 // TODO: Add links to the wiki articles about the login process.
 export default function AuthenticationTitle() {
+  const router = useRouter();
   const form = useForm({
     initialValues: {
       password: '',
@@ -33,7 +34,6 @@ export default function AuthenticationTitle() {
         >
           Welcome back!
         </Title>
-        <Logo withoutText />
       </Group>
 
       <Text color="dimmed" size="sm" align="center" mt={5}>
@@ -72,16 +72,14 @@ export default function AuthenticationTitle() {
               .then((res) => {
                 setTimeout(() => {
                   if (res.data.success === true) {
+                    router.push('/');
                     updateNotification({
                       id: 'load-data',
                       color: 'teal',
-                      title: 'Password correct',
+                      title: 'Password correct, redirecting you...',
                       message: undefined,
                       icon: <IconCheck />,
-                      autoClose: 300,
-                      onClose: () => {
-                        window.location.reload();
-                      },
+                      autoClose: 1000,
                     });
                   }
                   if (res.data.success === false) {