|
1 | | -import React, { useEffect, useState } from "react"; |
| 1 | +import React, { useEffect, useState, useRef } from "react"; |
2 | 2 | import { supabase } from "@/integrations/supabase/client"; |
3 | 3 | import { useAuth } from "@/contexts/AuthContext"; |
4 | | -import { useNavigate } from "react-router-dom"; |
| 4 | +import { useNavigate, useSearchParams } from "react-router-dom"; |
5 | 5 | import Navbar from "@/components/Navbar"; |
6 | 6 | import Footer from "@/components/Footer"; |
7 | 7 | import { Loader2, CheckCircle2, Smile } from "lucide-react"; |
8 | 8 |
|
9 | 9 | const ArchitectsPage = () => { |
10 | 10 | const { user } = useAuth(); |
11 | 11 | const navigate = useNavigate(); |
| 12 | + const [searchParams, setSearchParams] = useSearchParams(); |
| 13 | + const formRef = useRef<HTMLElement>(null); |
12 | 14 | const [architects, setArchitects] = useState<any[]>([]); |
13 | 15 | const [loading, setLoading] = useState(true); |
14 | 16 | const [search, setSearch] = useState(""); |
@@ -56,6 +58,25 @@ const ArchitectsPage = () => { |
56 | 58 | if (user) checkIfRegistered(); |
57 | 59 | }, [user]); |
58 | 60 |
|
| 61 | + useEffect(() => { |
| 62 | + const shouldShowForm = searchParams.get("showForm"); |
| 63 | + |
| 64 | + if (shouldShowForm === "true" && user && !isAlreadyRegistered) { |
| 65 | + setShowForm(true); |
| 66 | + |
| 67 | + const newSearchParams = new URLSearchParams(searchParams); |
| 68 | + newSearchParams.delete("showForm"); |
| 69 | + setSearchParams(newSearchParams, { replace: true }); |
| 70 | + |
| 71 | + setTimeout(() => { |
| 72 | + formRef.current?.scrollIntoView({ |
| 73 | + behavior: "smooth", |
| 74 | + block: "start" |
| 75 | + }); |
| 76 | + }, 300); |
| 77 | + } |
| 78 | + }, [user, isAlreadyRegistered]); |
| 79 | + |
59 | 80 | // ✅ Handle input |
60 | 81 | const handleChange = ( |
61 | 82 | e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> |
@@ -179,11 +200,17 @@ const ArchitectsPage = () => { |
179 | 200 |
|
180 | 201 | const handleRegisterClick = () => { |
181 | 202 | if (!user) { |
182 | | - navigate("/auth/login"); |
| 203 | + navigate("/auth/login?redirect=/categories/architects&showForm=true"); |
183 | 204 | } else if (isAlreadyRegistered) { |
184 | 205 | setMessage("You are already registered as an architect."); |
185 | 206 | } else { |
186 | 207 | setShowForm(true); |
| 208 | + setTimeout(() => { |
| 209 | + formRef.current?.scrollIntoView({ |
| 210 | + behavior: "smooth", |
| 211 | + block: "start" |
| 212 | + }); |
| 213 | + }, 100); |
187 | 214 | } |
188 | 215 | }; |
189 | 216 |
|
@@ -278,7 +305,10 @@ const ArchitectsPage = () => { |
278 | 305 |
|
279 | 306 | {/* Registration Form */} |
280 | 307 | {showForm && user && !isAlreadyRegistered && ( |
281 | | - <section className="max-w-4xl mx-auto mt-10 bg-gray-50 p-6 rounded-2xl shadow-md border border-gray-200 relative"> |
| 308 | + <section |
| 309 | + ref={formRef} |
| 310 | + className="max-w-4xl mx-auto mt-10 bg-gray-50 p-6 rounded-2xl shadow-md border border-gray-200 relative" |
| 311 | + > |
282 | 312 | <button |
283 | 313 | onClick={() => setShowForm(false)} |
284 | 314 | className="absolute top-4 right-4 text-gray-600 hover:text-gray-800 text-3xl font-bold" |
|
0 commit comments