update contact & FAQ loop compossent

frontend/src/components/Faq.jsx

@@ -1,32 +1,44 @@
 import React, { useState, useEffect } from "react";
-import { Box, TextField, Typography, Collapse } from "@mui/material";
+import { Box, TextField, Typography, Collapse, CircularProgress } from "@mui/material";
+import axios from "axios";
 
 const Faq = ({ showFAQ }) => {
   const [faqSearch, setFaqSearch] = useState("");
   const [filteredFaqs, setFilteredFaqs] = useState([]);
-
+  const [faqs, setFaqs] = useState([]);
-  const faqs = [
+  const [loading, setLoading] = useState(true); // Ajout d'un état de chargement
-    {
+  const [error, setError] = useState(null); // Ajout d'un état d'erreur
-      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 fetchFaqs = async () => {
+      try {
+        // Requête pour récupérer les FAQs depuis l'API WordPress
+        const response = await axios.get(
+          "https://preprod.octopusdesign.fr/api-octopus/server/wp-json/wp/v2/pages/116?_fields=acf.faq.faq_list"
+        );
+
+        const faqList = response.data.acf?.faq?.faq_list; // Chemin vers le répéteur dans l'API
+        if (faqList && Array.isArray(faqList)) {
+          const formattedFaqs = faqList.map((item) => ({
+            question: item.question || "Question non définie",
+            answer: item.answer || "Réponse non définie",
+          }));
+
+          setFaqs(formattedFaqs);
+          setFilteredFaqs(formattedFaqs); // Initialiser la liste filtrée
+        } else {
+          console.warn("Aucune FAQ trouvée dans le champ répéteur.");
+          setError("Aucune FAQ disponible pour le moment.");
+        }
+      } catch (error) {
+        console.error("Erreur lors de la récupération des FAQs :", error);
+        setError("Impossible de récupérer les FAQs. Veuillez réessayer plus tard.");
+      } finally {
+        setLoading(false); // Désactiver le chargement
+      }
+    };
+
+    fetchFaqs();
   }, []);
 
   const handleSearch = (e) => {
@@ -51,7 +63,7 @@ const Faq = ({ showFAQ }) => {
         }}
       >
         <Typography
-          variant="h4"
+          variant="h3"
           sx={{
             fontWeight: "bold",
             mb: 4,
@@ -62,40 +74,54 @@ const Faq = ({ showFAQ }) => {
           FAQ
         </Typography>
 
-        {/* Barre de recherche */}
+        {loading ? (
-        <TextField
+          <Box sx={{ textAlign: "center", py: 4 }}>
-          placeholder="Rechercher dans la FAQ..."
+            <CircularProgress />
-          fullWidth
+          </Box>
-          variant="outlined"
+        ) : error ? (
-          value={faqSearch}
+          <Typography variant="body1" sx={{ color: "red", textAlign: "center" }}>
-          onChange={handleSearch}
+            {error}
-          sx={{
+          </Typography>
-            mb: 4,
+        ) : (
-          }}
+          <>
-        />
+            {/* Barre de recherche */}
+            <TextField
+              placeholder="Rechercher dans la FAQ..."
+              fullWidth
+              variant="outlined"
+              value={faqSearch}
+              onChange={handleSearch}
+              sx={{
+                mb: 4,
+              }}
+            />
 
-        {/* Liste des FAQs */}
+            {/* Liste des FAQs */}
-        <Box>
+            <Box>
-          {filteredFaqs.length > 0 ? (
+              {filteredFaqs.length > 0 ? (
-            filteredFaqs.map((faq, index) => (
+                filteredFaqs.map((faq, index) => (
-              <Box key={index} sx={{ mb: 3 }}>
+                  <Box key={index} sx={{ mb: 3 }}>
-                <Typography variant="h6" sx={{ fontWeight: "bold" }}>
+                    <Typography variant="h4" sx={{ fontWeight: "bold" }}>
-                  {faq.question}
+                      {faq.question}
+                    </Typography>
+                    <Typography
+                      variant="body1"
+                      sx={{ color: "#666" }}
+                      dangerouslySetInnerHTML={{ __html: faq.answer }} // Si la réponse contient du HTML
+                    />
+                  </Box>
+                ))
+              ) : (
+                <Typography
+                  variant="body1"
+                  sx={{ color: "#999", textAlign: "center" }}
+                >
+                  Aucun résultat trouvé. Essayez un autre mot-clé.
                 </Typography>
-                <Typography variant="body1" sx={{ color: "#666" }}>
+              )}
-                  {faq.answer}
+            </Box>
-                </Typography>
+          </>
-              </Box>
+        )}
-            ))
-          ) : (
-            <Typography
-              variant="body1"
-              sx={{ color: "#999", textAlign: "center" }}
-            >
-              Aucun résultat trouvé.
-            </Typography>
-          )}
-        </Box>
       </Box>
     </Collapse>
   );

frontend/src/components/Pages/Contact.jsx

@@ -156,7 +156,7 @@ const Contact = () => {
       >
         <Box>
           <Typography
-            variant="h2"
+            variant="h1"
             sx={{
               fontWeight: "bold",
               fontSize: { xs: "2rem", md: "3rem", lg: "4rem" },
@@ -166,13 +166,16 @@ const Contact = () => {
             Contactez-nous
           </Typography>
           <Typography
-            variant="h6"
+            variant="body2"
             sx={{
-              fontSize: { xs: "1rem", md: "1.5rem" },
+              fontSize: { xs: "1rem", md: "1rem" },
               maxWidth: "600px",
               mx: "auto",
             }}
           >
+            Notre bureau d’étude technique est, par essence, spécialisé. 
+            Vous pouvez donc faire appel à nous pour un diagnostic ponctuel portant sur tel ou tel équipement ou ouvrage du bâtiment 
+            (structures, chaufferie, ascenseur).<br></br> <br></br>
             Une question ? Une demande particulière ? Remplissez le formulaire
             ci-dessous ou consultez nos coordonnées.
           </Typography>
@@ -182,6 +185,7 @@ const Contact = () => {
       {/* Section Coordonnées et Horaires */}
       <Box sx={{ padding: "40px 20px", backgroundColor: "#f9f9f9" }}>
         <Grid container spacing={4}>
+
           {/* Coordonnées */}
           <Grid item xs={12} md={6}>
             <Card
@@ -197,8 +201,9 @@ const Contact = () => {
             >
               <Box>
                 <Typography
-                  variant="h4"
+                  variant="h2"
                   sx={{
+                    fontSize: { xs: "2rem", md: "2rem", lg: "3rem" },
                     fontWeight: "bold",
                     color: "#0e467f",
                     mb: 2,
@@ -206,6 +211,7 @@ const Contact = () => {
                 >
                   Nos coordonnées
                 </Typography>
+
                 <Typography variant="body1">
                   <strong>Adresse :</strong>67 Bd Winston Churchill, Le Mans,
                   France
@@ -217,6 +223,7 @@ const Contact = () => {
                   <strong>Email :</strong> contact@be-in3.com
                 </Typography>
               </Box>
+
               <Box
                 onClick={handleOpenLightbox}
                 sx={{
@@ -268,8 +275,9 @@ const Contact = () => {
             >
               <CardContent>
                 <Typography
-                  variant="h4"
+                  variant="h2"
                   sx={{
+                    fontSize: { xs: "2rem", md: "2rem", lg: "3rem" },
                     fontWeight: "bold",
                     color: "#0e467f",
                     mb: 2,
@@ -278,6 +286,7 @@ const Contact = () => {
                 >
                   Horaires d'ouverture
                 </Typography>
+
                 <Typography variant="body1">
                   <strong>Lundi - Mardi :</strong> 9h00 - 16h00
                 </Typography>
@@ -342,8 +351,9 @@ const Contact = () => {
         }}
       >
         <Typography
-          variant="h4"
+          variant="h2"
           sx={{
+            fontSize: { xs: "2rem", md: "2rem", lg: "3rem" }, // Responsive
             fontWeight: "bold",
             mb: 2,
             fontSize: { xs: "1.5rem", md: "2rem" },
@@ -381,7 +391,7 @@ const Contact = () => {
         }}
       >
         <Typography
-          variant="h4"
+          variant="h2"
           sx={{
             mb: 4,
             textAlign: "center",

server/wp-content/themes/hello-elementor-child/functions.php

@@ -6,9 +6,7 @@ if (!defined('ABSPATH')) exit;
 // Charger les styles du parent et de l'enfant
 if (!function_exists('child_theme_styles')) {
     function child_theme_styles() {
-        // Style du parent
         wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
-        // Style de l'enfant
         wp_enqueue_style('child-style', get_stylesheet_directory_uri() . '/style.css', ['parent-style']);
     }
 }
@@ -16,141 +14,132 @@ add_action('wp_enqueue_scripts', 'child_theme_styles');
 
 // Ajouter les champs ACF à l'API REST pour les pages
 add_action('rest_api_init', function () {
-	register_rest_field(
+    register_rest_field(
-			'page',
+        'page',
-			'acf',
+        'acf',
-			[
+        [
-					'get_callback' => function ($object) {
+            'get_callback' => function ($object) {
-							return get_fields($object['id']);
+                return get_fields($object['id']);
-					},
+            },
-					'schema' => null,
+            'schema' => null,
-			]
+        ]
-	);
+    );
 });
 
-// API RANK SEO
+// Gestion des menus ACF et sous-menus
-add_filter('rest_prepare_page', function ($response, $post) {
+function register_acf_dashboard_menus() {
-	$seo_data = [
+    // Menu principal : Page d'accueil
-			'rank_math_title' => get_post_meta($post->ID, 'rank_math_title', true),
-			'rank_math_description' => get_post_meta($post->ID, 'rank_math_description', true),
-	];
-
-	$response->data = array_merge($response->data, $seo_data);
-
-	return $response;
-}, 10, 2);
-
-add_action('rest_api_init', function () {
-	register_rest_route('custom/v1', '/contact', array(
-			'methods' => 'POST',
-			'callback' => 'handle_contact_form',
-			'permission_callback' => '__return_true', // Permet l'accès public
-	));
-});
-
-// Formulaire
-function register_contact_endpoint() {
-	register_rest_route('custom/v1', '/contact', [
-			'methods' => 'POST',
-			'callback' => 'handle_contact_form',
-			'permission_callback' => '__return_true',
-	]);
-}
-add_action('rest_api_init', 'register_contact_endpoint');
-
-function handle_contact_form($request) {
-	$params = $request->get_json_params();
-
-	$name = sanitize_text_field($params['name'] ?? '');
-	$email = sanitize_email($params['email'] ?? '');
-	$subject = sanitize_text_field($params['subject'] ?? '');
-	$message = sanitize_textarea_field($params['message'] ?? '');
-
-	if (empty($name) || empty($email) || empty($subject) || empty($message)) {
-			return new WP_Error(
-					'incomplete_fields',
-					'Tous les champs doivent être remplis.',
-					['status' => 400]
-			);
-	}
-
-	// Logique pour envoyer l'e-mail ou enregistrer les données
-	$to = get_option('admin_email'); // Adresse e-mail de l'administrateur WordPress
-	$headers = ['Content-Type: text/html; charset=UTF-8', 'From: ' . $name . ' <' . $email . '>'];
-
-	$mail_sent = wp_mail($to, $subject, nl2br($message), $headers);
-
-	if (!$mail_sent) {
-			return new WP_Error('email_not_sent', 'Le message n’a pas pu être envoyé.', ['status' => 500]);
-	}
-
-	return [
-			'success' => true,
-			'message' => 'Message envoyé avec succès.',
-	];
-}
-
-// Gestion des menus ACF
-function register_multiple_acf_dashboard_menus() {
-    // Menu principal
     add_menu_page(
-        'Gestion des Champs ACF', // Titre de la page principale
+        'Page d\'accueil',            // Titre de la page principale
-        'Page d\'accueil',           // Texte du menu
+        'Page d\'accueil',            // Texte du menu
-        'manage_options',        // Capacité requise
+        'manage_options',             // Capacité requise
-        'acf-manager',           // Slug du menu principal
+        'acf-homepage',               // Slug du menu principal
-        'acf_manager_main_page', // Fonction de rappel pour la page principale
+        'acf_manager_main_page',      // Fonction de rappel pour la page principale
-        'dashicons-admin-generic', // Icône du menu
+        'dashicons-admin-home',       // Icône du menu
-        2                         // Position dans le menu
+        2                             // Position dans le menu
     );
 
-    // Sous-menu pour le Groupe 1
+    // Sous-menus pour Page d'accueil
     add_submenu_page(
-        'acf-manager',           // Slug du menu parent
+        'acf-homepage',               // Slug du menu parent
-        'Groupe 1 ACF',          // Titre de la page
+        'Gérer Section Hero',         // Titre de la page
-        'Section Hero',              // Texte du sous-menu
+        'Section Hero',               // Texte du sous-menu
-        'manage_options',        // Capacité requise
+        'manage_options',             // Capacité requise
-        'acf-manager-group-1',   // Slug du sous-menu
+        'acf-homepage-hero',          // Slug du sous-menu
-        'acf_manager_group_1'    // Fonction de rappel pour afficher le contenu
+        'acf_manager_section_hero'    // Fonction de rappel
     );
 
-    // Sous-menu pour le Groupe 2
     add_submenu_page(
-        'acf-manager',
+        'acf-homepage',
-        'Groupe 3 ACF',
+        'Gérer Section Expertise',
-        'Section Construction',
-        'manage_options',
-        'acf-manager-group-3',
-        'acf_manager_group_3'
-    );
-
-    // Sous-menu pour le Groupe 2
-    add_submenu_page(
-        'acf-manager',
-        'Groupe 2 ACF',
         'Section Expertise',
         'manage_options',
-        'acf-manager-group-2',
+        'acf-homepage-expertise',
-        'acf_manager_group_2'
+        'acf_manager_section_expertise'
     );
-}
-add_action('admin_menu', 'register_multiple_acf_dashboard_menus');
 
-// Page principale (facultatif)
+    add_submenu_page(
+        'acf-homepage',
+        'Gérer Section Construction',
+        'Section Construction',
+        'manage_options',
+        'acf-homepage-construction',
+        'acf_manager_section_construction'
+    );
+
+    // Menu principal : Page Contact
+    add_menu_page(
+        'Page Contact',               // Titre de la page principale
+        'Page Contact',               // Texte du menu
+        'manage_options',             // Capacité requise
+        'acf-contact',                // Slug du menu principal
+        'acf_manager_contact_main',   // Fonction de rappel pour la page principale
+        'dashicons-email',            // Icône du menu
+        3                             // Position dans le menu
+    );
+
+    // Sous-menus pour Page Contact
+    add_submenu_page(
+        'acf-contact',
+        'Gérer Section Formulaire',
+        'Section FAQ',
+        'manage_options',
+        'acf-contact-form',
+        'acf_manager_contact_form'
+    );
+
+    // add_submenu_page(
+    //     'acf-contact',
+    //     'Gérer Section Coordonnées',
+    //     'Section Coordonnées',
+    //     'manage_options',
+    //     'acf-contact-coordinates',
+    //     'acf_manager_contact_coordinates'
+    // );
+}
+add_action('admin_menu', 'register_acf_dashboard_menus');
+
+// Fonction de rappel pour les pages principales
 function acf_manager_main_page() {
-    echo '<div class="wrap"><h1>Bienvenue dans le Gestionnaire ACF</h1><p>Choisissez un groupe dans le menu pour gérer ses champs.</p></div>';
+    echo '<div class="wrap"><h1>Bienvenue dans le Gestionnaire de la Page d\'accueil</h1><p>Choisissez une section pour gérer ses champs.</p></div>';
 }
 
-// Groupe 1 - Champs ACF
+function acf_manager_contact_main() {
-function acf_manager_group_1() {
+    echo '<div class="wrap"><h1>Bienvenue dans le Gestionnaire de la Page Contact</h1><p>Choisissez une section pour gérer ses champs.</p></div>';
+}
+
+// Fonctions de rappel pour les sous-menus
+function acf_manager_section_hero() {
+    render_acf_form('group_6774f26930ebd', '13'); // Remplacez par vos IDs ACF et Post ID
+}
+
+function acf_manager_section_expertise() {
+    render_acf_form('group_6779c41fcdc6d', '13');
+}
+
+function acf_manager_section_construction() {
+    render_acf_form('group_677d3294c3dfa', '13');
+}
+
+function acf_manager_contact_form() {
+    render_acf_form('group_677e8bf907253', '116'); // Remplacez par vos IDs ACF et Post ID
+}
+
+// function acf_manager_contact_coordinates() {
+//     render_acf_form('group_contact_coordinates', '116'); // Remplacez par vos IDs ACF et Post ID
+// }
+
+// Fonction générique pour afficher les formulaires ACF
+function render_acf_form($field_group, $post_id) {
     ?>
     <div class="wrap">
-        <h1>Groupe 1 - Champs ACF</h1>
+        <h1>Gestion des Champs</h1>
         <?php
         if (function_exists('acf_form')) {
             acf_form_head();
             acf_form(array(
-                'post_id'       => '13', // Remplacez par un ID de page si nécessaire
+                'post_id'       => $post_id, // ID de la page ou de l'article
-                'field_groups'  => array('group_6774f26930ebd'),
+                'field_groups'  => array($field_group), // ID du groupe ACF
                 'form'          => true,
                 'return'        => add_query_arg('updated', 'true', wp_get_referer()),
                 'submit_value'  => __('Enregistrer les modifications', 'acf'),
@@ -163,47 +152,13 @@ function acf_manager_group_1() {
     <?php
 }
 
-// Groupe 3 - Champs ACF
+register_rest_field(
-function acf_manager_group_3() {
+    'page',
-    ?>
+    'acf',
-    <div class="wrap">
+    [
-        <h1>Groupe 3 - Champs ACF</h1>
+        'get_callback' => function ($object) {
-        <?php
+            return get_fields($object['id']);
-        if (function_exists('acf_form')) {
+        },
-            acf_form_head();
+        'schema' => null,
-            acf_form(array(
+    ]
-                'post_id'       => '13', // Remplacez par un ID de page si nécessaire
+);
-                'field_groups'  => array('group_677d3294c3dfa'),
-                'form'          => true,
-                'return'        => add_query_arg('updated', 'true', wp_get_referer()),
-                'submit_value'  => __('Enregistrer les modifications', 'acf'),
-            ));
-        } else {
-            echo '<p>Le plugin ACF n\'est pas activé ou disponible.</p>';
-        }
-        ?>
-    </div>
-    <?php
-}
-// Groupe 2 - Champs ACF
-function acf_manager_group_2() {
-    ?>
-    <div class="wrap">
-        <h1>Groupe 2 - Champs ACF</h1>
-        <?php
-        if (function_exists('acf_form')) {
-            acf_form_head();
-            acf_form(array(
-                'post_id'       => '13', // Remplacez par un ID de page si nécessaire
-                'field_groups'  => array('group_6779c41fcdc6d'),
-                'form'          => true,
-                'return'        => add_query_arg('updated', 'true', wp_get_referer()),
-                'submit_value'  => __('Enregistrer les modifications', 'acf'),
-            ));
-        } else {
-            echo '<p>Le plugin ACF n\'est pas activé ou disponible.</p>';
-        }
-        ?>
-    </div>
-    <?php
-}