From ed21966ed81d701d7195c480e0054e7a249c8d00 Mon Sep 17 00:00:00 2001
From: Zeke Abshire <zekeabshire@gmail.com>
Date: Tue, 4 Apr 2023 20:07:27 -0500
Subject: [PATCH] Added settings page and signout button on menu

---
 src/components/layouts/MainLayout.tsx | 23 ++++++++++++++++++++---
 src/pages/settings/index.tsx          | 12 ++++++++++++
 2 files changed, 32 insertions(+), 3 deletions(-)
 create mode 100644 src/pages/settings/index.tsx

diff --git a/src/components/layouts/MainLayout.tsx b/src/components/layouts/MainLayout.tsx
index aa30463..24c9c16 100644
--- a/src/components/layouts/MainLayout.tsx
+++ b/src/components/layouts/MainLayout.tsx
@@ -8,6 +8,7 @@ import {
   FiEdit,
   FiArchive,
   FiUser,
+  FiLogOut,
   FiSettings,
 } from "react-icons/fi";
 import type { IconType } from "react-icons/lib";
@@ -27,6 +28,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { proposalSchema } from "@utils/constants/schema/project";
 import type { z } from "zod";
 import type { SubmitHandler } from "react-hook-form";
+import { signOut } from "next-auth/react";
 
 export const MainLayout: React.FC<Children> = ({ children }) => {
   return (
@@ -218,9 +220,24 @@ const MoreMenu: React.FC = () => {
           className="min-w-[250px] rounded-md bg-bg-700 p-3 data-[side=top]:animate-slideUpAndFade"
           sideOffset={10}
         >
-          <DropdownMenu.Item className="flex select-none items-center justify-between px-[5px] pl-[25px] outline-none">
-            <p className="text-r-lg">Settings</p>
-            <FiSettings />
+          <DropdownMenu.Item>
+            <Link
+              href="/settings"
+              className="flex w-full select-none items-center justify-between px-[5px] pl-[25px] outline-none"
+            >
+              <p className="text-r-lg">Settings</p>
+              <FiSettings />
+            </Link>
+          </DropdownMenu.Item>
+          <DropdownMenu.Item>
+            <button
+              type="button"
+              className="flex w-full select-none items-center justify-between px-[5px] pl-[25px] outline-none"
+              onClick={() => void signOut()}
+            >
+              <p className="text-r-lg">Sign Out</p>
+              <FiLogOut />
+            </button>
           </DropdownMenu.Item>
         </DropdownMenu.Content>
       </DropdownMenu.Portal>
diff --git a/src/pages/settings/index.tsx b/src/pages/settings/index.tsx
new file mode 100644
index 0000000..5137358
--- /dev/null
+++ b/src/pages/settings/index.tsx
@@ -0,0 +1,12 @@
+import { MainLayout } from "@components/layouts";
+import { type NextPage } from "next";
+
+const Settings: NextPage = () => {
+  return (
+    <MainLayout>
+      <h1 className="text-r-5xl font-bold text-primary">Settings</h1>
+    </MainLayout>
+  );
+};
+
+export default Settings;