From 52f9cb4598e7acc46222e708dab28ee582927dab Mon Sep 17 00:00:00 2001
From: Cody Epstein <codyepstein@gmail.com>
Date: Mon, 28 Oct 2024 14:08:31 -0700
Subject: [PATCH] add logout page

---
 app/(main)/account/logout/page.tsx | 53 ++++++++++++++++++++++++++++++
 1 file changed, 53 insertions(+)
 create mode 100644 app/(main)/account/logout/page.tsx

diff --git a/app/(main)/account/logout/page.tsx b/app/(main)/account/logout/page.tsx
new file mode 100644
index 00000000..a120ff13
--- /dev/null
+++ b/app/(main)/account/logout/page.tsx
@@ -0,0 +1,53 @@
+// Copyright (c) Gridiron Survivor.
+// Licensed under the MIT License.
+
+'use client';
+import GlobalSpinner from '@/components/GlobalSpinner/GlobalSpinner';
+import React, { useEffect, JSX } from 'react';
+import { useAuthContext } from '@/context/AuthContextProvider';
+import { useRouter } from 'next/navigation';
+import Heading from '@/components/Heading/Heading';
+
+/**
+ * Renders the logout page.
+ * @returns {React.JSX.Element} The rendered logout page.
+ */
+const Logout = (): JSX.Element => {
+  const { logoutAccount } = useAuthContext();
+  const router = useRouter();
+
+  useEffect(() => {
+    /**
+     * Handles the logout.
+     * @returns {Promise<void>} The logout promise.
+     */
+    const handleLogout = async (): Promise<void> => {
+      try {
+        await logoutAccount();
+        router.push('/login');
+      } catch (error) {
+        throw error;
+      }
+    };
+
+    handleLogout();
+  }, [logoutAccount, router]);
+
+  return (
+    <>
+      <section className="mx-auto max-w-5xl pt-10 text-center relative">
+        <div className="absolute top-0">
+          <Heading as="h2" className="text-2xl font-semibold mb-2">
+            Logging Out
+          </Heading>
+          <p className="text-muted-foreground">
+            Please wait while we securely log you out of your account...
+          </p>
+        </div>
+        <GlobalSpinner />
+      </section>
+    </>
+  );
+};
+
+export default Logout;