diff --git a/src/app/page.tsx b/src/app/page.tsx index 641cfcf..64d066d 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,91 +1,267 @@ "use client"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; -import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple'; -import HeroCentered from '@/components/sections/hero/HeroCentered'; -import ContactText from '@/components/sections/contact/ContactText'; -import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia'; -import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; +import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay"; +import HeroBillboardScroll from "@/components/sections/hero/HeroBillboardScroll"; +import FooterMedia from "@/components/sections/footer/FooterMedia"; +import { Home } from "lucide-react"; -const navItems = [ - { name: "Home", id: "/" }, -]; +interface FormField { + id: string; + label: string; + type: "text" | "email" | "tel" | "textarea" | "select"; + required?: boolean; + placeholder?: string; + options?: string[]; +} -const heroAvatars = [ - { - src: "http://img.b2bpic.net/free-photo/close-up-businessman-smiling_23-2150771099.jpg", alt: "Paul Blaga"}, -]; +interface FormProps { + title: string; + userImage: string; + userName: string; + userPhone: string; + fields: FormField[]; + gdprCheckbox: { label: string; required: boolean }; + termsCheckbox: { label: string; required: boolean }; + buttonText: string; + successMessage: string; + floatingButton?: boolean; + validateOnChange?: boolean; +} -const gdprFaqs = [ - { - id: "1", title: "Cine este operatorul de date personale?", content: - "Datele dumneavoastră personale sunt colectate și prelucrate de MULTI TASK CLUB S.R.L., cu sediul în Loc. Deva, Aleea Romanilor 23, Bl. 12, Ap. 107, Județul Hunedoara, România, înregistrată la ONRC cu CUI 46528927, în calitate de operator de date."}, - { - id: "2", title: "Care este scopul prelucrării datelor?", content: - "Datele colectate prin acest formular vor fi utilizate exclusiv pentru: furnizarea de informații și oferte imobiliare; contactarea dumneavoastră în scopul prezentării serviciilor noastre; gestionarea cererilor și a leadurilor generate prin formular."}, - { - id: "3", title: "Care este temeiul legal al prelucrării?", content: - "Prelucrarea datelor se face pe baza consimțământului dumneavoastră explicit, conform art. 6 alin. (1) lit. a) din GDPR."}, - { - id: "4", title: "Ce categorii de date sunt colectate?", content: - "Datele pe care le vom prelucra pot include: nume și prenume; adresă de e-mail; număr de telefon; orice alte informații pe care le furnizați voluntar prin formular."}, - { - id: "5", title: "Cât timp sunt stocate datele personale?", content: - "Datele personale vor fi stocate pentru o perioadă de maximum 3 ani sau până la retragerea consimțământului."}, - { - id: "6", title: "Care sunt drepturile mele?", content: - "Aveți dreptul de a: accesa datele personale; rectifica datele inexacte; solicita ștergerea datelor (dreptul de a fi uitat); restricționa prelucrarea sau de a vă opune; solicita portabilitatea datelor; retrage consimțământul în orice moment; depune o plângere la ANSPDCP."}, -]; +const LeadForm: React.FC = ({ + title, + userImage, + userName, + userPhone, + fields, + gdprCheckbox, + termsCheckbox, + buttonText, + successMessage, + floatingButton = true, + validateOnChange = true, +}) => { + const [formData, setFormData] = React.useState>({}); + const [errors, setErrors] = React.useState>({}); + const [submitted, setSubmitted] = React.useState(false); + const [gdprChecked, setGdprChecked] = React.useState(false); + const [termsChecked, setTermsChecked] = React.useState(false); -const termsFaqs = [ - { - id: "1", title: "Operatorul și scopul", content: - "Acest site/formular este operat de MULTI TASK CLUB S.R.L., cu sediul în Loc. Deva, Aleea Romanilor 23, Bl. 12, Ap. 107, Județul Hunedoara, România, înregistrată la ONRC cu CUI 46528927. Prin accesarea și utilizarea acestui formular, sunteți de acord cu acești termeni și condiții."}, - { - id: "2", title: "Serviciile oferite", content: - "MULTI TASK CLUB S.R.L. furnizează servicii de intermediere imobiliară, consultanță și prezentarea de oferte pentru achiziții, închirieri și management imobiliar. Toate informațiile și materialele prezentate au caracter informativ și nu constituie oferte contractuale definitive."}, - { - id: "3", title: "Utilizarea formularului", content: - "Utilizatorul se angajează să furnizeze informații corecte și complete. Este interzisă utilizarea site-ului în scopuri ilegale sau pentru transmiterea de conținut neadecvat."}, - { - id: "4", title: "Protecția datelor personale", content: - "Datele colectate prin site sau formular sunt prelucrate conform Politicii de Confidențialitate și Clauzelor GDPR disponibile pe site."}, - { - id: "5", title: "Proprietatea intelectuală", content: - "Conținutul site-ului (texte, imagini, logo-uri, videoclipuri) este proprietatea MULTI TASK CLUB S.R.L. și nu poate fi copiat, distribuit sau folosit fără acordul scris al companiei."}, - { - id: "6", title: "Limitarea răspunderii", content: - "MULTI TASK CLUB S.R.L. nu este responsabilă pentru: erori, omisiuni sau inexactități ale informațiilor prezentate; deciziile luate pe baza informațiilor din site/formular; eventuale pierderi directe sau indirecte cauzate de accesarea serviciilor."}, -]; + const validateField = (field: FormField, value: string): string | null => { + if (field.required && !value.trim()) { + return `${field.label} is required`; + } + if (field.type === "email" && value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) { + return "Please enter a valid email"; + } + if (field.type === "tel" && value && !/^[\d\s\-\+\(\)]+$/.test(value)) { + return "Please enter a valid phone number"; + } + return null; + }; -const footerColumns = [ - { - title: "Companie", items: [ - { label: "Despre noi", href: "#" }, - { label: "Servicii", href: "#services" }, - { label: "Contact", href: "#contact" }, - ], - }, - { - title: "Legal", items: [ - { label: "Termeni și Condiții", href: "#terms" }, - { label: "GDPR", href: "#gdpr" }, - { label: "Politica de Confidențialitate", href: "#" }, - { label: "Politica Cookie", href: "#" }, - ], - }, - { - title: "Contact", items: [ - { - label: "Email: paul.blaga@activimob.ro", href: "mailto:paul.blaga@activimob.ro"}, - { label: "Telefon: 0750 290 998", href: "tel:+40750290998" }, - { - label: "Adresă: Aleea Romanilor 23, Bl. 12, Ap. 107, Loc. Deva, Județul Hunedoara, România", href: "#"}, - ], - }, -]; + const handleFieldChange = (fieldId: string, value: string) => { + setFormData((prev) => ({ ...prev, [fieldId]: value })); + if (validateOnChange) { + const field = fields.find((f) => f.id === fieldId); + if (field) { + const error = validateField(field, value); + setErrors((prev) => ({ + ...prev, + [fieldId]: error || ""})); + } + } + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + const newErrors: Record = {}; + + fields.forEach((field) => { + const error = validateField(field, formData[field.id] || ""); + if (error) { + newErrors[field.id] = error; + } + }); + + if (gdprCheckbox.required && !gdprChecked) { + newErrors.gdpr = "GDPR consent is required"; + } + if (termsCheckbox.required && !termsChecked) { + newErrors.terms = "Terms acceptance is required"; + } + + if (Object.keys(newErrors).length === 0) { + setSubmitted(true); + setTimeout(() => { + setSubmitted(false); + setFormData({}); + setGdprChecked(false); + setTermsChecked(false); + }, 3000); + } else { + setErrors(newErrors); + } + }; + + return ( +
+
+

{title}

+ + {submitted ? ( +
+

{successMessage}

+
+ ) : ( +
+
+ {userName} +
+

{userName}

+

{userPhone}

+
+
+ + {fields.map((field) => ( +
+ + {field.type === "select" ? ( + + ) : field.type === "textarea" ? ( +