feat: add privacy setting in me page

src/main/webapp/src/pages/MePage.jsx

@@ -12,6 +12,10 @@ import {
     faUserGroup,
     faVenus
 } from "@fortawesome/free-solid-svg-icons";
+import {CheckField} from "../components/MemberCustomFiels.jsx";
+import {toast} from "react-toastify";
+import {apiAxios} from "../utils/Tools.js";
+import {useEffect, useState} from "react";
 
 const vite_url = import.meta.env.VITE_URL;
 
@@ -30,6 +34,7 @@ export function MePage() {
                     </div>
                     <div className="col-lg-8">
                         <InformationForm data={data}/>
+                        <SettingsCard data={data}/>
                         <div className="row">
                             <div className="col-md-6">
                                 <LoadingProvider><LicenceCard userData={data}/></LoadingProvider>
@@ -96,8 +101,47 @@ function SelectCard() {
     </div>;
 }
 
+function SettingsCard({data}) {
+    const [privacy, setPrivacy] = useState("PUBLIC");
 
-export function InformationForm({data}) {
+    useEffect(() => {
+        if (data?.resultPrivacy) {
+            setPrivacy(data.resultPrivacy);
+        }
+    }, [data]);
+
+    const handleChange = (e) => {
+        const formData = new FormData();
+        formData.append("resultPrivacy", e.target.value);
+        toast.promise(apiAxios.put(`/member/me/setting`, formData),
+            {
+                pending: 'Mise à jours des paramètres en cours...',
+                success: 'Paramètres mis à jours avec succès 🎉',
+                error: 'Échec de la mise à jours des paramètres 😕'
+            })
+            .then(() => {
+                setPrivacy(String(formData.get("resultPrivacy")));
+            });
+    }
+
+    return <div className="card mb-4">
+        <div className="card-header">Paramètres du compte</div>
+        <div className="card-body">
+            <div className="input-group mb-3">
+                <label className="input-group-text" htmlFor="email_notifications">Visibilité des résultats</label>
+                <select className="form-select" id="result_visibility" name="result_visibility" required value={privacy} onChange={handleChange}>
+                    <option value="PUBLIC">Public (visible par tous)</option>
+                    <option value="REGISTERED_ONLY">Membres connectés (visibles par les membres de la fédération)</option>
+                    <option value="REGISTERED_ONLY_NO_DETAILS">Membres connectés - masquer les détails (visibles par les membres de la fédération)
+                    </option>
+                    <option value="PRIVATE">Privé (visible uniquement par moi)</option>
+                </select>
+            </div>
+        </div>
+    </div>;
+}
+
+function InformationForm({data}) {
     const style = {marginRight: '0.7em'}
 
     return <div className="card mb-4">
@@ -127,4 +171,4 @@ export function InformationForm({data}) {
             </div>
         </div>
     </div>;
-}
+}