diff --git a/frontend/src/components/Faq.jsx b/frontend/src/components/Faq.jsx
new file mode 100644
index 0000000..d351c56
--- /dev/null
+++ b/frontend/src/components/Faq.jsx
@@ -0,0 +1,104 @@
+import React, { useState, useEffect } from "react";
+import { Box, TextField, Typography, Collapse } from "@mui/material";
+
+const Faq = ({ showFAQ }) => {
+ const [faqSearch, setFaqSearch] = useState("");
+ const [filteredFaqs, setFilteredFaqs] = useState([]);
+
+ const faqs = [
+ {
+ question: "Comment contacter notre service client ?",
+ answer:
+ "Vous pouvez nous appeler au +33 1 23 45 67 89 ou nous écrire via le formulaire de contact.",
+ },
+ {
+ question: "Quels sont vos horaires d'ouverture ?",
+ answer: "Nous sommes ouverts du lundi au vendredi de 9h00 à 18h00.",
+ },
+ {
+ question: "Où êtes-vous situés ?",
+ answer: "Notre adresse est 123 Rue Exemple, Paris, France.",
+ },
+ {
+ question: "Proposez-vous des services personnalisés ?",
+ answer: "Oui, contactez-nous pour discuter de vos besoins spécifiques.",
+ },
+ ];
+
+ useEffect(() => {
+ setFilteredFaqs(faqs);
+ }, []);
+
+ const handleSearch = (e) => {
+ const searchTerm = e.target.value.toLowerCase();
+ setFaqSearch(searchTerm);
+
+ const filtered = faqs.filter((faq) =>
+ faq.question.toLowerCase().includes(searchTerm)
+ );
+ setFilteredFaqs(filtered);
+ };
+
+ return (
+
+
+
+ FAQ
+
+
+ {/* Barre de recherche */}
+
+
+ {/* Liste des FAQs */}
+
+ {filteredFaqs.length > 0 ? (
+ filteredFaqs.map((faq, index) => (
+
+
+ {faq.question}
+
+
+ {faq.answer}
+
+
+ ))
+ ) : (
+
+ Aucun résultat trouvé.
+
+ )}
+
+
+
+ );
+};
+
+export default Faq;
\ No newline at end of file
diff --git a/frontend/src/components/Pages/Contact.jsx b/frontend/src/components/Pages/Contact.jsx
index 847aff2..74928c8 100644
--- a/frontend/src/components/Pages/Contact.jsx
+++ b/frontend/src/components/Pages/Contact.jsx
@@ -18,6 +18,7 @@ import {
} from "@mui/material";
import SEO from "../SEO";
import api from "../../api";
+import Faq from "../Faq";
const Contact = () => {
const [metaTitle, setMetaTitle] = useState("Contactez-nous");
@@ -36,20 +37,12 @@ const Contact = () => {
const [successMessage, setSuccessMessage] = useState(false);
const [openLightbox, setOpenLightbox] = useState(false);
- // FAQ State
- const [showFAQ, setShowFAQ] = useState(false);
- const [faqSearch, setFaqSearch] = useState("");
- const [filteredFaqs, setFilteredFaqs] = useState([]);
- const faqs = [
- { question: "Comment contacter notre service client ?", answer: "Vous pouvez nous appeler au +33 1 23 45 67 89 ou nous écrire via le formulaire de contact." },
- { question: "Quels sont vos horaires d'ouverture ?", answer: "Nous sommes ouverts du lundi au vendredi de 9h00 à 18h00." },
- { question: "Où êtes-vous situés ?", answer: "Notre adresse est 123 Rue Exemple, Paris, France." },
- { question: "Proposez-vous des services personnalisés ?", answer: "Oui, contactez-nous pour discuter de vos besoins spécifiques." },
- ];
+ const [showFAQ, setShowFAQ] = useState(false); // État pour afficher/masquer la FAQ
- useEffect(() => {
- setFilteredFaqs(faqs);
- }, []);
+
+ const handleToggleFAQ = () => {
+ setShowFAQ((prev) => !prev);
+ };
useEffect(() => {
const fetchSEOData = async () => {
@@ -61,7 +54,10 @@ const Contact = () => {
setMetaTitle(rank_math_title || "Contactez-nous");
setMetaDescription(rank_math_description || "Contactez notre équipe.");
} catch (error) {
- console.error("Erreur lors de la récupération des données SEO :", error);
+ console.error(
+ "Erreur lors de la récupération des données SEO :",
+ error
+ );
}
};
@@ -76,7 +72,8 @@ const Contact = () => {
if (!formData.subject) newErrors.subject = "Le sujet est requis.";
if (!formData.message) newErrors.message = "Le message est requis.";
if (!formData.consent)
- newErrors.consent = "Vous devez accepter la politique de confidentialité.";
+ newErrors.consent =
+ "Vous devez accepter la politique de confidentialité.";
return newErrors;
};
@@ -88,19 +85,6 @@ const Contact = () => {
});
};
- const handleSearch = (e) => {
- const searchTerm = e.target.value.toLowerCase();
- setFaqSearch(searchTerm);
- const filtered = faqs.filter((faq) =>
- faq.question.toLowerCase().includes(searchTerm)
- );
- setFilteredFaqs(filtered);
- };
-
- const handleToggleFAQ = () => {
- setShowFAQ((prev) => !prev);
- };
-
const handleSubmit = async (e) => {
e.preventDefault();
const validationErrors = validate();
@@ -209,7 +193,6 @@ const Contact = () => {
justifyContent: "space-between",
alignItems: "center",
height: "80%",
-
}}
>
@@ -224,13 +207,14 @@ const Contact = () => {
Nos coordonnées
- Adresse : 123 Rue Exemple, Paris, France
+ Adresse :67 Bd Winston Churchill, Le Mans,
+ France
- Téléphone : +33 1 23 45 67 89
+ Téléphone : 02.43.85.09.01
- Email : contact@exemple.com
+ Email : contact@be-in3.com
{
overflow: "hidden",
boxShadow: 3,
"&:hover": {
- transform: "scale(1.10)",
- boxShadow: 4,
- transition: "transform 0.3s, box-shadow 0.3s",
- },
+ transform: "scale(1.10)",
+ boxShadow: 4,
+ transition: "transform 0.3s, box-shadow 0.3s",
+ },
"&:hover::before": {
content: '"Cliquez pour agrandir"',
position: "absolute",
@@ -266,7 +250,6 @@ const Contact = () => {
src="https://picsum.photos/id/442/300.webp"
alt="Carte"
style={{ width: "100%", height: "100%", objectFit: "cover" }}
-
/>
@@ -290,19 +273,22 @@ const Contact = () => {
fontWeight: "bold",
color: "#0e467f",
mb: 2,
- textAlign: "center",
+ textAlign: "left",
}}
>
Horaires d'ouverture
- Lundi - Vendredi : 9h00 - 18h00
+ Lundi - Mardi : 9h00 - 16h00
- Samedi : 10h00 - 14h00
+ Mercredi : 09h00 - 12h00
- Dimanche : Fermé
+ Jeudi - Vendredi : 09h00 - 17h00
+
+
+ Samedi - Dimanche : Fermé
@@ -334,7 +320,7 @@ const Contact = () => {
}}
>