Thomas Demirdjian
131 lines
4.2 KiB
JavaScript
131 lines
4.2 KiB
JavaScript
/* eslint-disable react/display-name */
|
||
import { BlurView } from "expo-blur";
|
||
import { useState } from "react";
|
||
import { Platform, Text, View } from "react-native";
|
||
import { responsiveHeight } from "react-native-responsive-dimensions";
|
||
import React, { useEffect, useGlobal } from "reactn";
|
||
import { background } from "../../assets";
|
||
import Switch from "../../components/Switch";
|
||
import firebase, { usersRef } from "../../config/firebase";
|
||
import { isWeb } from "../../hooks/useLayoutType";
|
||
import Page from "../../layouts/Page";
|
||
import { gutters, Palette, Style } from "../../styles";
|
||
import { FONT_FAMILY } from "../../styles/Fonts";
|
||
|
||
export default (props) => {
|
||
const [currentUID] = useGlobal("currentUID");
|
||
const [currentUserData] = useGlobal("currentUserData");
|
||
const [, setTooltip] = useGlobal("_tooltip");
|
||
|
||
const [isPushSwitch, setIsPushSwitch] = useState(false);
|
||
const [isEmailSwitch, setIsEmailSwitch] = useState(false);
|
||
|
||
useEffect(() => {
|
||
setIsPushSwitch(!!currentUserData?.notifications);
|
||
}, [currentUserData?.notifications]);
|
||
|
||
useEffect(() => {
|
||
setIsEmailSwitch(!!currentUserData?.emailNotifications);
|
||
}, [currentUserData?.emailNotifications]);
|
||
|
||
const updateNotificationPreference = async (next, field, setState) => {
|
||
try {
|
||
setState(next);
|
||
const uid = currentUID || firebase.auth().currentUser?.uid;
|
||
if (!uid) {
|
||
throw new Error("Utilisateur non connecté");
|
||
}
|
||
await usersRef.doc(uid).set({ [field]: next }, { merge: true });
|
||
setTooltip({ type: "success", text: "Préférence enregistrée" });
|
||
} catch (e) {
|
||
setState(!next);
|
||
setTooltip({
|
||
type: "error",
|
||
text: e?.message || "Enregistrement impossible",
|
||
});
|
||
}
|
||
};
|
||
|
||
const onTogglePush = (next) =>
|
||
updateNotificationPreference(next, "notifications", setIsPushSwitch);
|
||
|
||
const onToggleEmail = (next) =>
|
||
updateNotificationPreference(next, "emailNotifications", setIsEmailSwitch);
|
||
|
||
return (
|
||
<Page
|
||
headerType="NAVIGATE"
|
||
title="Paramètres"
|
||
backgroundImg={background.profileBG}
|
||
contentContainerStyle={{
|
||
paddingBottom: gutters * 4,
|
||
}}
|
||
containerStyle={{
|
||
backgroundColor: isWeb ? "transparent" : "#0000004D",
|
||
}}
|
||
>
|
||
<View style={{ flex: 1, marginTop: responsiveHeight(2) }}>
|
||
<BlurView
|
||
intensity={Platform.OS !== "ios" ? 10 : 20}
|
||
style={{
|
||
gap: 12,
|
||
paddingVertical: 15,
|
||
paddingHorizontal: 20,
|
||
borderRadius: 20,
|
||
overflow: "hidden",
|
||
backgroundColor: Palette.glass,
|
||
}}
|
||
// experimentalBlurMethod={
|
||
// Platform.OS !== "ios" ? "dimezisBlurView" : "none"
|
||
// }
|
||
>
|
||
<View style={Style.containerSpaceBetween}>
|
||
<Text
|
||
style={{
|
||
fontSize: 20,
|
||
color: Palette.white,
|
||
fontFamily: FONT_FAMILY.HelveticaNeueMedium,
|
||
}}
|
||
>
|
||
Notifications push
|
||
</Text>
|
||
<Switch value={isPushSwitch} setValue={onTogglePush} />
|
||
</View>
|
||
<Text
|
||
style={{
|
||
fontSize: 12,
|
||
color: Palette.white,
|
||
fontFamily: FONT_FAMILY.InterRegular,
|
||
}}
|
||
>
|
||
Nous t’encourageons à activer les notifications pour découvrir les
|
||
derniers classements, les nouveaux sons et les meilleurs playbacks.
|
||
</Text>
|
||
<View style={Style.containerSpaceBetween}>
|
||
<Text
|
||
style={{
|
||
fontSize: 20,
|
||
color: Palette.white,
|
||
fontFamily: FONT_FAMILY.HelveticaNeueMedium,
|
||
}}
|
||
>
|
||
Notifications par email
|
||
</Text>
|
||
<Switch value={isEmailSwitch} setValue={onToggleEmail} />
|
||
</View>
|
||
<Text
|
||
style={{
|
||
fontSize: 12,
|
||
color: Palette.white,
|
||
fontFamily: FONT_FAMILY.InterRegular,
|
||
}}
|
||
>
|
||
Reste informé en recevant nos nouveautés et rappels directement dans
|
||
ta boîte mail.
|
||
</Text>
|
||
</BlurView>
|
||
</View>
|
||
</Page>
|
||
);
|
||
};
|