Hack4Impact-UMD · anyajain5 · Nov 11, 2025 · Nov 11, 2025 · Nov 11, 2025 · Nov 11, 2025
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,5 +1,6 @@
 import "./globals.css";
 import localFont from "next/font/local";
+import { AuthProvider } from "../contexts/AuthContext";
 
 const openSans = localFont({
   src: '../public/fonts/OpenSans/OpenSans.ttf',
@@ -24,8 +25,10 @@ export default function RootLayout({
   return (
     <html lang="en" className={`${openSans.variable} ${raleway.variable} ${roboto.variable} w-full h-full overscroll-none`}>
       <body className="w-full h-full font-family-roboto">
-        {children}
+        <AuthProvider>
+          {children}
+        </AuthProvider>
       </body>
     </html>
   );
-}
+}
diff --git a/app/login/page.tsx b/app/login/page.tsx
@@ -6,6 +6,9 @@
 import InputBox from '../../components/auth/InputBox';
 import { FirebaseError } from 'firebase/app';
 import { login } from '@/lib/services/auth';
+// Import Firestore functions to check user status
+import { doc, getDoc } from 'firebase/firestore';
+import { db } from '@/lib/firebase';
 
 export default function LoginPage() {
   const router = useRouter();
@@ -20,7 +23,29 @@
     setLoading(true);
 
     try {
-      await login(email, password);
+      // Authenticate user with Firebase Auth
+      const user = await login(email, password);
+
+      // Fetch user document from Firestore to check their status
+      const userDoc = await getDoc(doc(db, "users", user.uid));
+
+      if (userDoc.exists()) {
+        const userData = userDoc.data();
+
+        // Check status field: pending users can't access the app yet
+        if (userData.status === "pending") {
+          router.push("/status?type=pending");
+          return;
+        } 
+        // Rejected users should see an error message
+        else if (userData.status === "rejected") {
+          setError("Your account request was not approved. Please contact an administrator.");
+          setLoading(false);
+          return;
+        }
+      }
+
+      // If approved or no status field exists, allow access to inventory
       router.push("/inventory");
     } catch (e: unknown) {
       console.error("Login failed:", e);
@@ -32,7 +57,7 @@
  return (
    <div className="flex h-screen overflow-hidden">
      <div>
        <img
          src="/background.png"
          alt="Login Background"
          className="object-cover w-[30em] h-[52em]"
@@ -45,7 +70,7 @@
          className="w-[24em] h-[35em] flex flex-col text-black space-y-[1.2em]"
        >
          <div className="flex justify-center">
            <img
              src="/journey-home-logo.png"
              alt="Journey Home"
              className="h-[6em] w-[22em]"

diff --git a/app/signup/SignUpInformation.tsx b/app/signup/SignUpInformation.tsx
@@ -34,10 +34,13 @@ export default function SignUpInformation({
 
         setLoading(true);
         try {
-
-            await signUp(email, pw, first, last, dob, selectedRole);
-            router.push("/inventory");
-
+            const { status } = await signUp(email, pw, first, last, dob, selectedRole);
+
+            if (status === "pending") {
+                router.push("/status?type=pending");
+            } else {
+                router.push("/status?type=created");
+            }
         } catch (e: unknown) {
             console.error("Signup failed:", e);
             setErr((e as FirebaseError).message);
@@ -47,7 +50,7 @@ export default function SignUpInformation({
     }
 
     return (
-        <div className="">
+        <div>
             <div className="relative mb-9">
                 <button onClick={onBack} className="absolute left-0 text-2xl">
                     ←
@@ -127,7 +130,7 @@ export default function SignUpInformation({
                 />
 
                 <div className="mt-6 flex justify-center mb-3 flex-col">
-                    {err ? <span className="text-red-500 text-center mb-2">{err}</span> : null}
+                    {err && <span className="text-red-500 text-center mb-2">{err}</span>}
                     <button
                         type="submit"
                         disabled={loading}
@@ -138,16 +141,9 @@ export default function SignUpInformation({
                 </div>
 
                 <p className="text-center">
-                    Already have an account?{" "}
-                    <a
-                        href="/login"
-                        className="font-semibold hover:underline"
-                        style={{ color: "var(--color-primary)" }}
-                    >
-                        Login
-                    </a>
+                    Already have an account? <a href="/login" className="font-semibold hover:underline" style={{ color: "var(--color-primary)" }}>Login</a>
                 </p>
             </form>
         </div>
     );
-}
+}
diff --git a/app/status/creation-confirmation.tsx b/app/status/creation-confirmation.tsx
@@ -0,0 +1,52 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+
+export default function AccountCreated() {
+  const router = useRouter();
+
+  return (
+    <div className="bg-background flex h-full">
+      {/* Left side - background image */}
+      <div className="flex shrink-0 items-start justify-start h-full">
+        <img
+          src="/background.png"
+          alt="Background"
+          className="h-[58em] w-[30em] object-cover object-left overflow-hidden"
+        />
+      </div>
+
+      {/* Right side - content */}
+      <div className="flex flex-1 flex-col h-full items-center justify-center">
+        <div className="flex flex-col items-center w-[28em]">
+          {/* Logo */}
+          <div className="flex justify-center mb-16">
+            <img
+              src="/journey-home-logo.png"
+              alt="Journey Home"
+              className="h-[6em] w-[22em]"
+            />
+          </div>
+
+          {/* Heading */}
+          <h1 className="text-2xl font-bold font-family-roboto text-text-1 mb-6">
+            Account Created
+          </h1>
+
+          {/* Message */}
+          <p className="text-center font-family-roboto text-text-1 mb-12">
+            Thanks for being a part of the Journey Home team!
+          </p>
+
+          {/* Back to Login button */}
+          <button
+            onClick={() => router.push("/login")}
+            className="w-full h-10 rounded-xs bg-primary text-white font-medium font-family-roboto"
+          >
+            Back to Login
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/app/status/page.tsx b/app/status/page.tsx
@@ -0,0 +1,30 @@
+"use client";
+
+import { useSearchParams } from "next/navigation";
+import AccountPending from "./pending";
+import AccountCreated from "./creation-confirmation";
+import { Suspense } from "react";
+
+function StatusContent() {
+  const searchParams = useSearchParams();
+  const type = searchParams.get("type");
+
+  if (type === "created") {
+    return <AccountCreated />;
+  }
+
+  // Default to pending if type is "pending" or not specified
+  return <AccountPending />;
+}
+
+export default function StatusPage() {
+  return (
+    <Suspense fallback={
+      <div className="flex items-center justify-center h-screen">
+        <p className="font-family-roboto">Loading...</p>
+      </div>
+    }>
+      <StatusContent />
+    </Suspense>
+  );
+}
diff --git a/app/status/pending.tsx b/app/status/pending.tsx
@@ -0,0 +1,53 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+
+export default function AccountPending() {
+  const router = useRouter();
+
+  return (
+    <div className="bg-background flex h-full">
+      {/* Left side - background image */}
+      <div className="flex shrink-0 items-start justify-start h-full">
+        <img
+          src="/background.png"
+          alt="Background"
+          className="h-[58em] w-[30em] object-cover object-left overflow-hidden"
+        />
+      </div>
+
+      {/* Right side - content */}
+      <div className="flex flex-1 flex-col h-full items-center justify-center">
+        <div className="flex flex-col items-center w-[28em]">
+          {/* Logo */}
+          <div className="flex justify-center mb-16">
+            <img
+              src="/journey-home-logo.png"
+              alt="Journey Home"
+              className="h-[6em] w-[22em]"
+            />
+          </div>
+
+          {/* Heading */}
+          <h1 className="text-2xl font-bold font-family-roboto text-text-1 mb-6">
+            Account Pending
+          </h1>
+
+          {/* Message */}
+          <p className="text-center font-family-roboto text-text-1 mb-12 px-8">
+            Thanks for requesting to be a part of the Journey Home team! You can
+            expect to hear back from us within X business days.
+          </p>
+
+          {/* Back to Login button */}
+          <button
+            onClick={() => router.push("/login")}
+            className="w-full h-10 rounded-xs bg-primary text-white font-medium font-family-roboto"
+          >
+            Back to Login
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}