From 1342e71a3f10df79a972b131ce835ea840708d94 Mon Sep 17 00:00:00 2001
From: Xor290 <free6nk33@gmail.com>
Date: Fri, 15 May 2026 13:48:19 +0200
Subject: [PATCH] chore: fix

---
 frontend-prep/src/components/Navbar.tsx      |   2 +-
 frontend-prep/src/pages/User/ProfilePage.css |  18 +++
 frontend-prep/src/pages/User/ProfilePage.tsx |  59 ++++++++-
 mobile/app.json                              |   2 +-
 mobile/src/screens/client/ProfileScreen.tsx  | 119 ++++++++++++++++---
 5 files changed, 178 insertions(+), 22 deletions(-)

diff --git a/frontend-prep/src/components/Navbar.tsx b/frontend-prep/src/components/Navbar.tsx
index ca30253e..f0f3477d 100644
--- a/frontend-prep/src/components/Navbar.tsx
+++ b/frontend-prep/src/components/Navbar.tsx
@@ -160,7 +160,7 @@ function Navbar() {
                     <FontAwesomeIcon icon={isMenuOpen ? faTimes : faBars} />
                 </button>
 
-                <span className="topbar-brand">Milieu‑Nantais</span>
+                <span className="topbar-brand">{shopName}</span>
 
                 <div className="topbar-actions">
                     {/* Theme toggle */}
diff --git a/frontend-prep/src/pages/User/ProfilePage.css b/frontend-prep/src/pages/User/ProfilePage.css
index bacc8b64..446f0d31 100644
--- a/frontend-prep/src/pages/User/ProfilePage.css
+++ b/frontend-prep/src/pages/User/ProfilePage.css
@@ -357,3 +357,21 @@
   border: 1px solid rgba(37, 99, 235, 0.27);
   color: #60a5fa;
 }
+
+.profile-modal-btn--danger {
+  background: rgba(239, 68, 68, 0.1);
+  border: 1px solid rgba(239, 68, 68, 0.35);
+  color: #ef4444;
+}
+
+.profile-modal-icon--danger {
+  background: rgba(239, 68, 68, 0.1);
+  border-color: rgba(239, 68, 68, 0.3);
+  color: #ef4444;
+}
+
+.profile-modal-icon--success {
+  background: rgba(16, 185, 129, 0.1);
+  border-color: rgba(16, 185, 129, 0.3);
+  color: #10b981;
+}
diff --git a/frontend-prep/src/pages/User/ProfilePage.tsx b/frontend-prep/src/pages/User/ProfilePage.tsx
index e9f167f0..eb2f6c40 100644
--- a/frontend-prep/src/pages/User/ProfilePage.tsx
+++ b/frontend-prep/src/pages/User/ProfilePage.tsx
@@ -44,6 +44,8 @@ export default function ProfilePage() {
 
   // Modal confirmation infos par défaut
   const [showSaveModal, setShowSaveModal] = useState(false);
+  const [showUnlinkModal, setShowUnlinkModal] = useState(false);
+  const [showUnlinkSuccessModal, setShowUnlinkSuccessModal] = useState(false);
 
   const username = extractUsernameFromToken() ?? '';
 
@@ -111,12 +113,16 @@ export default function ProfilePage() {
     window.open(res.link_url, '_blank');
   };
 
-  const handleUnlinkTelegram = async () => {
-    if (!window.confirm('Délier votre compte Telegram ? Vous ne recevrez plus de notifications.')) return;
+  const handleUnlinkTelegram = () => {
+    setShowUnlinkModal(true);
+  };
+
+  const confirmUnlinkTelegram = async () => {
+    setShowUnlinkModal(false);
     await unlinkTelegram();
     setTgLinked(false);
     setTwoFAEnabled(false);
-    showSuccess('Compte Telegram délié');
+    setShowUnlinkSuccessModal(true);
   };
 
   const handleToggle2FA = async () => {
@@ -371,6 +377,53 @@ export default function ProfilePage() {
           </div>
         </div>
       )}
+
+      {showUnlinkModal && (
+        <div className="profile-modal-overlay" onClick={() => setShowUnlinkModal(false)}>
+          <div className="profile-modal" onClick={(e) => e.stopPropagation()}>
+            <button className="profile-modal-close" onClick={() => setShowUnlinkModal(false)}>
+              <FontAwesomeIcon icon={faTimes} />
+            </button>
+            <div className="profile-modal-icon profile-modal-icon--danger">
+              <FontAwesomeIcon icon={faUnlink} />
+            </div>
+            <h3 className="profile-modal-title">Délier Telegram ?</h3>
+            <p className="profile-modal-body">
+              Vous ne recevrez plus de notifications Telegram. La double authentification sera également désactivée.
+            </p>
+            <div className="profile-modal-actions">
+              <button className="profile-modal-btn profile-modal-btn--cancel" onClick={() => setShowUnlinkModal(false)}>
+                Annuler
+              </button>
+              <button className="profile-modal-btn profile-modal-btn--danger" onClick={confirmUnlinkTelegram}>
+                <FontAwesomeIcon icon={faUnlink} /> Délier
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {showUnlinkSuccessModal && (
+        <div className="profile-modal-overlay" onClick={() => setShowUnlinkSuccessModal(false)}>
+          <div className="profile-modal" onClick={(e) => e.stopPropagation()}>
+            <button className="profile-modal-close" onClick={() => setShowUnlinkSuccessModal(false)}>
+              <FontAwesomeIcon icon={faTimes} />
+            </button>
+            <div className="profile-modal-icon profile-modal-icon--success">
+              <FontAwesomeIcon icon={faCheckCircle} />
+            </div>
+            <h3 className="profile-modal-title">Compte délié</h3>
+            <p className="profile-modal-body">
+              Votre compte Telegram a été délié avec succès. Vous ne recevrez plus de notifications via Telegram.
+            </p>
+            <div className="profile-modal-actions">
+              <button className="profile-modal-btn profile-modal-btn--confirm" onClick={() => setShowUnlinkSuccessModal(false)}>
+                <FontAwesomeIcon icon={faCheckCircle} /> Fermer
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
     </>
   );
 }
diff --git a/mobile/app.json b/mobile/app.json
index 7ed673a5..b5734121 100644
--- a/mobile/app.json
+++ b/mobile/app.json
@@ -2,7 +2,7 @@
     "expo": {
         "name": "Milieu Nantais",
         "slug": "frontend-client",
-        "version": "1.0.0",
+        "version": "1.0.1",
         "orientation": "portrait",
         "icon": "./assets/icon.png",
         "userInterfaceStyle": "dark",
diff --git a/mobile/src/screens/client/ProfileScreen.tsx b/mobile/src/screens/client/ProfileScreen.tsx
index f20fb1e4..cde530fc 100644
--- a/mobile/src/screens/client/ProfileScreen.tsx
+++ b/mobile/src/screens/client/ProfileScreen.tsx
@@ -60,6 +60,10 @@ export default function ProfileScreen() {
 
     // Modal changement de mot de passe
     const [showPasswordModal, setShowPasswordModal] = useState(false);
+
+    // Modals Telegram unlink
+    const [showTelegramUnlinkModal, setShowTelegramUnlinkModal] = useState(false);
+    const [showTelegramSuccessModal, setShowTelegramSuccessModal] = useState(false);
     const [currentPwd, setCurrentPwd] = useState("");
     const [newPwd, setNewPwd] = useState("");
     const [confirmPwd, setConfirmPwd] = useState("");
@@ -116,6 +120,11 @@ export default function ProfileScreen() {
         Alert.alert("Enregistré", "Informations par défaut sauvegardées");
     };
 
+    const saveAddress = async () => {
+        await AsyncStorage.setItem(STORAGE_ADDRESS, defaultAddress.trim());
+        Alert.alert("Enregistré", "Adresse par défaut sauvegardée");
+    };
+
     const handleLinkTelegram = async () => {
         setTelegramLoading(true);
         const res = await generateTelegramLinkToken();
@@ -134,23 +143,16 @@ export default function ProfileScreen() {
         );
     };
 
-    const handleUnlinkTelegram = async () => {
-        Alert.alert(
-            "Délier Telegram",
-            "Vous ne recevrez plus de notifications Telegram. Continuer ?",
-            [
-                { text: "Annuler", style: "cancel" },
-                {
-                    text: "Délier",
-                    style: "destructive",
-                    onPress: async () => {
-                        await unlinkTelegram();
-                        setTelegramLinked(false);
-                        setTwoFAEnabled(false);
-                    },
-                },
-            ],
-        );
+    const handleUnlinkTelegram = () => {
+        setShowTelegramUnlinkModal(true);
+    };
+
+    const confirmUnlinkTelegram = async () => {
+        setShowTelegramUnlinkModal(false);
+        await unlinkTelegram();
+        setTelegramLinked(false);
+        setTwoFAEnabled(false);
+        setShowTelegramSuccessModal(true);
     };
 
     const handleChangePassword = async () => {
@@ -447,6 +449,15 @@ export default function ProfileScreen() {
                         multiline
                         numberOfLines={2}
                     />
+                    <TouchableOpacity
+                        style={[styles.saveBtn, styles.saveBtnSecondary, { marginTop: spacing.m }]}
+                        onPress={saveAddress}
+                    >
+                        <Ionicons name="save-outline" size={16} color={colors.accent} />
+                        <Text style={[styles.saveBtnText, styles.saveBtnTextSecondary]}>
+                            Enregistrer l'adresse
+                        </Text>
+                    </TouchableOpacity>
                 </View>
 
                 {/* Carte contact livraison */}
@@ -712,6 +723,80 @@ export default function ProfileScreen() {
                 </TouchableOpacity>
             </Modal>
 
+            {/* Modal confirmation déliaison Telegram */}
+            <Modal
+                visible={showTelegramUnlinkModal}
+                transparent
+                animationType="fade"
+                onRequestClose={() => setShowTelegramUnlinkModal(false)}
+            >
+                <TouchableOpacity
+                    style={styles.modalOverlay}
+                    activeOpacity={1}
+                    onPress={() => setShowTelegramUnlinkModal(false)}
+                >
+                    <TouchableOpacity activeOpacity={1} onPress={() => {}}>
+                        <View style={styles.modalBox}>
+                            <View style={[styles.modalIconWrap, { borderColor: "#ef444433", backgroundColor: "#ef444411" }]}>
+                                <Ionicons name="unlink-outline" size={24} color="#ef4444" />
+                            </View>
+                            <Text style={styles.modalTitle}>Délier Telegram ?</Text>
+                            <Text style={styles.modalBody}>
+                                Vous ne recevrez plus de notifications Telegram. La double authentification sera également désactivée.
+                            </Text>
+                            <View style={styles.modalActions}>
+                                <TouchableOpacity
+                                    style={styles.modalBtnCancel}
+                                    onPress={() => setShowTelegramUnlinkModal(false)}
+                                >
+                                    <Text style={styles.modalBtnCancelText}>Annuler</Text>
+                                </TouchableOpacity>
+                                <TouchableOpacity
+                                    style={[styles.modalBtnConfirm, { backgroundColor: "#ef444422", borderColor: "#ef444466" }]}
+                                    onPress={confirmUnlinkTelegram}
+                                >
+                                    <Text style={[styles.modalBtnConfirmText, { color: "#ef4444" }]}>Délier</Text>
+                                </TouchableOpacity>
+                            </View>
+                        </View>
+                    </TouchableOpacity>
+                </TouchableOpacity>
+            </Modal>
+
+            {/* Modal succès déliaison Telegram */}
+            <Modal
+                visible={showTelegramSuccessModal}
+                transparent
+                animationType="fade"
+                onRequestClose={() => setShowTelegramSuccessModal(false)}
+            >
+                <TouchableOpacity
+                    style={styles.modalOverlay}
+                    activeOpacity={1}
+                    onPress={() => setShowTelegramSuccessModal(false)}
+                >
+                    <TouchableOpacity activeOpacity={1} onPress={() => {}}>
+                        <View style={styles.modalBox}>
+                            <View style={[styles.modalIconWrap, { borderColor: "#10b98133", backgroundColor: "#10b98111" }]}>
+                                <Ionicons name="checkmark-circle-outline" size={24} color="#10b981" />
+                            </View>
+                            <Text style={styles.modalTitle}>Compte délié</Text>
+                            <Text style={styles.modalBody}>
+                                Votre compte Telegram a été délié avec succès. Vous ne recevrez plus de notifications via Telegram.
+                            </Text>
+                            <View style={styles.modalActions}>
+                                <TouchableOpacity
+                                    style={[styles.modalBtnConfirm, { flex: 1, borderColor: "#10b98166" }]}
+                                    onPress={() => setShowTelegramSuccessModal(false)}
+                                >
+                                    <Text style={[styles.modalBtnConfirmText, { color: "#10b981" }]}>Fermer</Text>
+                                </TouchableOpacity>
+                            </View>
+                        </View>
+                    </TouchableOpacity>
+                </TouchableOpacity>
+            </Modal>
+
         </KeyboardAvoidingView>
     );
 }