chore: fix
This commit is contained in:
@@ -160,7 +160,7 @@ function Navbar() {
|
|||||||
<FontAwesomeIcon icon={isMenuOpen ? faTimes : faBars} />
|
<FontAwesomeIcon icon={isMenuOpen ? faTimes : faBars} />
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<span className="topbar-brand">Milieu‑Nantais</span>
|
<span className="topbar-brand">{shopName}</span>
|
||||||
|
|
||||||
<div className="topbar-actions">
|
<div className="topbar-actions">
|
||||||
{/* Theme toggle */}
|
{/* Theme toggle */}
|
||||||
|
|||||||
@@ -357,3 +357,21 @@
|
|||||||
border: 1px solid rgba(37, 99, 235, 0.27);
|
border: 1px solid rgba(37, 99, 235, 0.27);
|
||||||
color: #60a5fa;
|
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;
|
||||||
|
}
|
||||||
|
|||||||
@@ -44,6 +44,8 @@ export default function ProfilePage() {
|
|||||||
|
|
||||||
// Modal confirmation infos par défaut
|
// Modal confirmation infos par défaut
|
||||||
const [showSaveModal, setShowSaveModal] = useState(false);
|
const [showSaveModal, setShowSaveModal] = useState(false);
|
||||||
|
const [showUnlinkModal, setShowUnlinkModal] = useState(false);
|
||||||
|
const [showUnlinkSuccessModal, setShowUnlinkSuccessModal] = useState(false);
|
||||||
|
|
||||||
const username = extractUsernameFromToken() ?? '';
|
const username = extractUsernameFromToken() ?? '';
|
||||||
|
|
||||||
@@ -111,12 +113,16 @@ export default function ProfilePage() {
|
|||||||
window.open(res.link_url, '_blank');
|
window.open(res.link_url, '_blank');
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleUnlinkTelegram = async () => {
|
const handleUnlinkTelegram = () => {
|
||||||
if (!window.confirm('Délier votre compte Telegram ? Vous ne recevrez plus de notifications.')) return;
|
setShowUnlinkModal(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
const confirmUnlinkTelegram = async () => {
|
||||||
|
setShowUnlinkModal(false);
|
||||||
await unlinkTelegram();
|
await unlinkTelegram();
|
||||||
setTgLinked(false);
|
setTgLinked(false);
|
||||||
setTwoFAEnabled(false);
|
setTwoFAEnabled(false);
|
||||||
showSuccess('Compte Telegram délié');
|
setShowUnlinkSuccessModal(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleToggle2FA = async () => {
|
const handleToggle2FA = async () => {
|
||||||
@@ -371,6 +377,53 @@ export default function ProfilePage() {
|
|||||||
</div>
|
</div>
|
||||||
</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>
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-1
@@ -2,7 +2,7 @@
|
|||||||
"expo": {
|
"expo": {
|
||||||
"name": "Milieu Nantais",
|
"name": "Milieu Nantais",
|
||||||
"slug": "frontend-client",
|
"slug": "frontend-client",
|
||||||
"version": "1.0.0",
|
"version": "1.0.1",
|
||||||
"orientation": "portrait",
|
"orientation": "portrait",
|
||||||
"icon": "./assets/icon.png",
|
"icon": "./assets/icon.png",
|
||||||
"userInterfaceStyle": "dark",
|
"userInterfaceStyle": "dark",
|
||||||
|
|||||||
@@ -60,6 +60,10 @@ export default function ProfileScreen() {
|
|||||||
|
|
||||||
// Modal changement de mot de passe
|
// Modal changement de mot de passe
|
||||||
const [showPasswordModal, setShowPasswordModal] = useState(false);
|
const [showPasswordModal, setShowPasswordModal] = useState(false);
|
||||||
|
|
||||||
|
// Modals Telegram unlink
|
||||||
|
const [showTelegramUnlinkModal, setShowTelegramUnlinkModal] = useState(false);
|
||||||
|
const [showTelegramSuccessModal, setShowTelegramSuccessModal] = useState(false);
|
||||||
const [currentPwd, setCurrentPwd] = useState("");
|
const [currentPwd, setCurrentPwd] = useState("");
|
||||||
const [newPwd, setNewPwd] = useState("");
|
const [newPwd, setNewPwd] = useState("");
|
||||||
const [confirmPwd, setConfirmPwd] = useState("");
|
const [confirmPwd, setConfirmPwd] = useState("");
|
||||||
@@ -116,6 +120,11 @@ export default function ProfileScreen() {
|
|||||||
Alert.alert("Enregistré", "Informations par défaut sauvegardées");
|
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 () => {
|
const handleLinkTelegram = async () => {
|
||||||
setTelegramLoading(true);
|
setTelegramLoading(true);
|
||||||
const res = await generateTelegramLinkToken();
|
const res = await generateTelegramLinkToken();
|
||||||
@@ -134,23 +143,16 @@ export default function ProfileScreen() {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleUnlinkTelegram = async () => {
|
const handleUnlinkTelegram = () => {
|
||||||
Alert.alert(
|
setShowTelegramUnlinkModal(true);
|
||||||
"Délier Telegram",
|
};
|
||||||
"Vous ne recevrez plus de notifications Telegram. Continuer ?",
|
|
||||||
[
|
const confirmUnlinkTelegram = async () => {
|
||||||
{ text: "Annuler", style: "cancel" },
|
setShowTelegramUnlinkModal(false);
|
||||||
{
|
await unlinkTelegram();
|
||||||
text: "Délier",
|
setTelegramLinked(false);
|
||||||
style: "destructive",
|
setTwoFAEnabled(false);
|
||||||
onPress: async () => {
|
setShowTelegramSuccessModal(true);
|
||||||
await unlinkTelegram();
|
|
||||||
setTelegramLinked(false);
|
|
||||||
setTwoFAEnabled(false);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleChangePassword = async () => {
|
const handleChangePassword = async () => {
|
||||||
@@ -447,6 +449,15 @@ export default function ProfileScreen() {
|
|||||||
multiline
|
multiline
|
||||||
numberOfLines={2}
|
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>
|
</View>
|
||||||
|
|
||||||
{/* Carte contact livraison */}
|
{/* Carte contact livraison */}
|
||||||
@@ -712,6 +723,80 @@ export default function ProfileScreen() {
|
|||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
</Modal>
|
</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>
|
</KeyboardAvoidingView>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user