newsletter field working

site/config/config.php

@@ -37,6 +37,7 @@ return [
     require_once(__DIR__ . '/routes/month-dates.php'),
     require_once(__DIR__ . '/routes/update-mapado-event.php'),
     require_once(__DIR__ . '/routes/mapado-fetch.php'),
+    require_once(__DIR__ . '/routes/brevo-create-contact.php'),
   ],
   'hooks' => [
     'page.update:after' => require_once(__DIR__ . '/hooks/update-mapado-event.php')

site/config/routes/brevo-create-contact.php

@@ -0,0 +1,45 @@
+
+<?php
+
+require_once(__DIR__ . '/../../../vendor/autoload.php');
+
+return [
+  'pattern' => '/brevo-create-contact.json',
+  'method' => 'POST',
+  'action' => function () {
+    $jsonRequest = file_get_contents("php://input");
+    $request = json_decode($jsonRequest, true);
+
+    $email = $request['email'];
+
+    $apiKey = site()->brevoApiKey()->value();
+
+    // Configure API key authorization: api-key
+    $config = Brevo\Client\Configuration::getDefaultConfiguration()->setApiKey('api-key', $apiKey);
+    // Uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+    // $config = Brevo\Client\Configuration::getDefaultConfiguration()->setApiKeyPrefix('api-key', 'Bearer');
+    // Configure API key authorization: partner-key
+    $config = Brevo\Client\Configuration::getDefaultConfiguration()->setApiKey('partner-key', $apiKey);
+    // Uncomment below to setup prefix (e.g. Bearer) for API key, if needed
+    // $config = Brevo\Client\Configuration::getDefaultConfiguration()->setApiKeyPrefix('partner-key', 'Bearer');
+
+    $apiInstance = new Brevo\Client\Api\ContactsApi(
+        // If you want use custom http client, pass your client which implements `GuzzleHttp\ClientInterface`.
+        // This is optional, `GuzzleHttp\Client` will be used as default.
+        new GuzzleHttp\Client(),
+        $config
+    );
+
+    $createContact = new \Brevo\Client\Model\CreateContact([
+      'email' => $email,
+      'updateEnabled' => true,
+    ]);
+
+    try {
+        $result = $apiInstance->createContact($createContact);
+        return json_encode($email . ' correctement ajouté à Brevo.');
+    } catch (Exception $e) {
+        return json_encode('Exception when calling ContactsApi->createContact: ' . $e->getMessage());
+    }
+  }
+];

site/snippets/newsletter-section.php

@@ -1,10 +1,44 @@
 <section class="newsletter">
   <h2>Newsletter</h2>
-  <div class="grid">
+  <div 
+    x-data="{
+      btnMsg: 's\'inscrire',
+      submit(event) {
+        event.preventDefault()
+        
+        const email = this.$refs.emailInput.value;
+        const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+        
+        if (emailRegex.test(email)) {
+          const options = {
+            method: 'POST',
+            body: JSON.stringify({
+              email
+            })
+          }
+
+          fetch('/brevo-create-contact.json', options)
+            .then(res => res.json())
+            .then(json => {
+              console.log(json)
+              this.$refs.emailInput.value = 'Vous êtes inscrit !'
+              this.$refs.emailSubmit.setAttribute('disabled', 'true')
+            })
+        } else {
+          this.btnMsg = 'email invalide'
+          this.$refs.emailInput.value = ''
+          setTimeout(() => {
+            this.btnMsg = 'réessayer'
+          }, 2000)
+        } 
+      }
+    }"
+    class="grid"
+  >
     <p class="grid__item" style="--span: 6;">Inscrivez-vous à notre newsletter pour être tenue informé·e·s de nos dernières actualités !</p>
     <form class="grid__item" action="" style="--span: 6;">
-      <input placeholder="e-mail" type="email" name="email" autocomplete="email" id="email">
-      <button type="submit">s'inscrire</button>
+      <input placeholder="e-mail" type="email" name="email" autocomplete="email" id="email" x-ref="emailInput">
+      <button type="submit" @click="submit" x-text="btnMsg" x-ref="emailSubmit"></button>
     </form>
   </div>
 </section>