Production Build Working

2026-09-16 12:39:54 -04:00
parent 8b3bb209b3
commit ead18a4709
96 changed files with 3473 additions and 2144 deletions
@@ -0,0 +1,81 @@
+// /app/login/page.tsx
+'use test' // Marks this component as a client component
+'use client'
+
+import classnames from 'classnames';
+
+import { useEffect, useState } from 'react'
+
+import { Schibsted_Grotesk } from 'next/font/google'
+const font = Schibsted_Grotesk({ subsets: ['latin'] })
+
+export default function ForgotPasswordPage() {
+  const [email, setEmail] = useState('');
+  const [message, setMessage] = useState('');
+  const [apiUrl, setapiUrl] = useState("");
+
+  useEffect(() => {
+    fetch("/api/backendApiUrl")
+      .then((res) => res.json())
+      .then((data) => {
+        setapiUrl(data.apiUrl)
+      });
+  }, []);
+
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    const res = await fetch(`http://${apiUrl}/forgot_password`, {
+      method: 'POST',
+      headers: { 
+            'Content-Type': 'application/json' ,
+        },
+      body: JSON.stringify({ user: { email } }),
+    });
+
+    const data = await res.json();
+    if (res.ok || data.errors[0] == 'Email not found') {
+      setMessage('If there is an account with this address, a reset link will be sent to your email shortly.');
+    } else {
+      setMessage(data.errors?.join(', ') || 'An error occurred.');
+    }
+  };
+
+
+  return (
+    <div
+    className="h-full flex flex-col items-center justify-center py-6 mt-10 px-4 sm:px-6 lg:px-8"
+    >
+        <div className="flex w-full items-center justify-center text-7xl font-bold text-atmosphere">
+            Britton Benefits
+        </div>
+        <div className={classnames("w-md space-y-4", font.className)}>
+            <div className="mt-10 text-center text-3xl font-extrabold text-light-bronze border-b-2 border-light-bronze">
+                Forgot Password
+            </div>
+            <form onSubmit={handleSubmit}>  
+              <div className="mt-2">
+                <div className="rounded-md shadow-sm -space-y-px">
+                    <label className="block text-md font-bold text-platinum">Email</label>
+                    <input
+                      type="email"
+                      placeholder="Enter email"
+                      value={email}
+                      onChange={(e) => setEmail(e.target.value)}
+                      className="appearance-none relative block w-full px-3 py-2 bg-platinum border border-gray-300 placeholder-bluetang text-deepcove rounded-md focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 focus:z-10 sm:text-sm"
+                      required
+                    />
+                </div>
+              </div>
+
+              <button
+                type="submit"
+                className="relative w-full flex justify-center py-2 px-4 mt-6 border-4 border-cobalt font-bold rounded-lg text-lg text-platinum hover:text-light-bronze bg-cobalt hover:bg-deepcove hover:cursor-pointer"
+              >
+                Send Reset Link
+              </button>
+            </form>
+            {message && <p className="mt-4 text-sm text-center">{message}</p>}
+        </div>
+    </div>
+  )
+}