diff --git a/src/main/java/fr/titionfire/ffsaf/utils/Contact.java b/src/main/java/fr/titionfire/ffsaf/utils/Contact.java
index ea49228..2ff0a5e 100644
--- a/src/main/java/fr/titionfire/ffsaf/utils/Contact.java
+++ b/src/main/java/fr/titionfire/ffsaf/utils/Contact.java
@@ -2,7 +2,6 @@ package fr.titionfire.ffsaf.utils;
 
 import io.quarkus.runtime.annotations.RegisterForReflection;
 
-import javax.naming.ldap.HasControls;
 import java.util.HashMap;
 
 @RegisterForReflection
@@ -11,7 +10,8 @@ public enum Contact {
     TELEPHONE("Téléphone"),
     SITE("Site web"),
     FACEBOOK("Facebook"),
-    INSTAGRAM("Instagram");
+    INSTAGRAM("Instagram"),
+    AUTRE("Autre");
 
     public String name;
 
diff --git a/src/main/webapp/src/components/Club/ContactEditor.jsx b/src/main/webapp/src/components/Club/ContactEditor.jsx
index 33582fe..6b39e20 100644
--- a/src/main/webapp/src/components/Club/ContactEditor.jsx
+++ b/src/main/webapp/src/components/Club/ContactEditor.jsx
@@ -8,16 +8,18 @@ export function ContactEditor({data}) {
     const [out_data, setOutData] = useState({})
 
     useEffect(() => {
+        let i = 0;
         for (const key in data.contact) {
-            dispatch({type: 'UPDATE_OR_ADD', payload: {id: key, data: data.contact[key]}})
+            dispatch({type: 'UPDATE_OR_ADD', payload: {id: i, data: {type: key, value: data.contact[key]}}})
+            i = i + 1
         }
     }, [data.contact]);
 
     useEffect(() => {
         let out_data2 = {}
         state.forEach(d => {
-            if (d.data !== undefined)
-                out_data2[d.id] = d.data
+            if (d.data !== undefined && d.data.value !== undefined)
+                out_data2[d.data.type] = d.data.value
         })
         setOutData(out_data2)
     }, [state]);
@@ -27,26 +29,25 @@ export function ContactEditor({data}) {
         <span className="input-group-text">Contacts</span>
         <ul className="list-group form-control">
             {state.map((d, index) => {
-                if (d.data === undefined)
+                if (d.data === undefined || d.data.value === undefined)
                     return;
 
                 return <div key={index} className="input-group">
-                    <select className="form-select" aria-label="type" defaultValue={d.id}
+                    <select className="form-select" aria-label="type" value={d.data.type}
                             onChange={(e) => {
-                                dispatch({type: 'UPDATE_OR_ADD', payload: {id: d.id, data: undefined}})
-                                dispatch({type: 'UPDATE_OR_ADD', payload: {id: e.target.value, data: d.data}})
+                                dispatch({type: 'UPDATE_OR_ADD', payload: {id: d.id, data: {type: e.target.value, value: d.data.value}}})
                             }}>
                         {Object.keys(data.contactMap).map((key, _) => {
                             let b = false;
                             for (let s of state) {
-                                if (s.id === key && s.data !== undefined) b = true;
+                                if (s.data.type === key && s.data.value !== undefined) b = true;
                             }
                             return (<option key={key} value={key} disabled={b}>{data.contactMap[key]}</option>)
                         })}
                     </select>
-                    <input type="text" className="form-control" defaultValue={d.data} required
+                    <input type="text" className="form-control" value={d.data.value} required
                            onChange={(e) => {
-                               dispatch({type: 'UPDATE_OR_ADD', payload: {id: d.id, data: e.target.value}})
+                               dispatch({type: 'UPDATE_OR_ADD', payload: {id: d.id, data: {type: d.data.type, value: e.target.value}}})
                            }}/>
                     <button className="btn btn-danger" type="button"
                             onClick={() => dispatch({type: 'REMOVE', payload: d.id})}><FontAwesomeIcon
@@ -61,15 +62,21 @@ export function ContactEditor({data}) {
                             for (let key in data.contactMap) {
                                 let b = false;
                                 for (let s of state) {
-                                    if (s.id === key && s.data !== undefined) b = true;
+                                    if (s.data.type === key && s.data.value !== undefined) b = true;
                                 }
                                 if (!b) {
                                     id = key
                                     break
                                 }
                             }
-                            if (id !== null)
-                                dispatch({type: 'UPDATE_OR_ADD', payload: {id: id, data: ''}})
+                            if (id !== null) {
+                                let maxId = 0;
+                                state.forEach((d) => {
+                                    if (d.id > maxId)
+                                        maxId = d.id;
+                                })
+                                dispatch({type: 'UPDATE_OR_ADD', payload: {id: maxId + 1, data: {type: id, value: ''}}})
+                            }
                         }}>
                     <FontAwesomeIcon icon={faAdd}/>
                 </button>