Create no-auth header and update login and register pages header

Author: bensohh

apps/frontend/src/app/login/page.tsx

@@ -8,6 +8,7 @@ import Link from "next/link";
 import { loginUser } from "@/app/services/user";
 import { setToken } from "@/app/services/login-store";
 import { useRouter } from "next/navigation";
+import NoAuthHeader from "@/components/NoAuthHeader/NoAuthHeader";
 
 type InputFields = {
   email: string;
@@ -43,7 +44,7 @@ export default function Home() {
     <>
       {contextHolder}
       <Layout>
-        <Header selectedKey={undefined} />
+        <NoAuthHeader />
         <Content>
           <div className="login-card">
             <h1>Login</h1>

apps/frontend/src/app/register/page.tsx

@@ -1,12 +1,12 @@
 "use client";
-import Header from "@/components/Header/header";
 import { Button, Input, Layout, message, Form } from "antd";
 import { Content } from "antd/es/layout/layout";
 import "./styles.scss";
 import { useState } from "react";
 import Link from "next/link";
 import { createUser } from "@/app/services/user";
 import { useRouter } from "next/navigation";
+import NoAuthHeader from "@/components/NoAuthHeader/NoAuthHeader";
 
 type InputFields = {
   username: string;
@@ -42,7 +42,7 @@ export default function Home() {
     <>
       {contextHolder}
       <Layout>
-        <Header selectedKey={undefined} />
+        <NoAuthHeader />
         <Content>
           <div className="login-card">
             <h1>Register</h1>

apps/frontend/src/components/NoAuthHeader/NoAuthHeader.tsx

@@ -0,0 +1,42 @@
+import { Menu } from "antd";
+import { Header as AntdHeader } from "antd/es/layout/layout";
+import { useRouter } from "next/navigation";
+import "./styles.scss";
+
+const NoAuthHeader = (): JSX.Element => {
+  const { push } = useRouter();
+  // Disable the header for non-authenticated header
+  const items = [
+    {
+      key: 0,
+      label: "Problems",
+      disabled: true,
+    },
+    {
+      key: 1,
+      label: "Matching",
+      disabled: true,
+    },
+  ];
+
+  return (
+    // Header Component
+    <AntdHeader className="header">
+      <div className="logo-container">
+        <div className="logo1">Peer</div>
+        <div className="logo2">Prep</div>
+      </div>
+      {/* Left Menu Pages Component */}
+      <Menu
+        mode="horizontal"
+        items={items}
+        style={{ flex: 1, minWidth: 0 }}
+        onClick={(info) => {
+          push("/");
+        }}
+      />
+    </AntdHeader>
+  );
+};
+
+export default NoAuthHeader;