chore: fix

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 */}

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;
+}

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>
+      )}
     </>
   );
 }