1+ import React from 'react' ;
2+ import { View , Text } from 'react-native' ;
3+ import { StyleSheet , Switch } from 'react-native' ;
4+ import { useEffect , useState } from 'react' ;
5+ import { User } from "../../utils/types" ;
6+ import { userGetUserInfo } from "../../actions/User" ;
7+ import { ErrorWrapper , endOfExecutionHandler } from "../../utils/error" ;
8+ import BaseOverlay from "../../components/Overlays/BaseOverlay" ;
9+ import ErrorBox from "../../components/ErrorBox" ;
10+ import IconButton from "../../components/IconButton" ;
11+ import { MaterialCommunityIcons } from '@expo/vector-icons' ;
12+ import { Screens } from '../../utils/types' ;
13+ import { userUpdateUser } from '../../actions/User' ;
14+
15+ export default function UserSettings ( props : any ) {
16+ const [ error , setError ] = useState < string > ( "" ) ;
17+ const [ userInfo , setUserInfo ] = useState < User | null > ( null ) ;
18+
19+ useEffect ( ( ) => {
20+ async function getUserInfo ( ) {
21+ try {
22+ const user : User = ( await ErrorWrapper ( {
23+ functionToExecute : userGetUserInfo ,
24+ errorHandler : setError ,
25+ } ) ) as User ;
26+ if ( user . unsubscribeEmail === undefined ) {
27+ user . unsubscribeEmail = false ;
28+ await userUpdateUser (
29+ user . roles ,
30+ user . birthday ,
31+ user . firstName ,
32+ user . lastName ,
33+ user . handlerType ,
34+ user . address ,
35+ user . annualPetVisitDay ,
36+ user . profileImage ,
37+ user . nextPrescriptionReminder ,
38+ false ,
39+ user . unsubscribeEmail ,
40+ ) ;
41+ }
42+ setUserInfo ( user ) ;
43+ } catch ( error ) {
44+ endOfExecutionHandler ( error as Error ) ;
45+ }
46+ }
47+ getUserInfo ( ) . catch ( ) ;
48+ } , [ ] ) ;
49+
50+
51+ const toggleSwitch = async ( ) => {
52+ // Change userInfo on this page and change in database
53+ const updatedUserInfo = {
54+ ...userInfo ,
55+ unsubscribeEmail : ! userInfo ?. unsubscribeEmail
56+ }
57+ setUserInfo ( updatedUserInfo as User ) ;
58+ await userUpdateUser (
59+ updatedUserInfo . roles ,
60+ updatedUserInfo . birthday ,
61+ updatedUserInfo . firstName ,
62+ updatedUserInfo . lastName ,
63+ updatedUserInfo . handlerType ,
64+ updatedUserInfo . address ,
65+ updatedUserInfo . annualPetVisitDay ,
66+ updatedUserInfo . profileImage ,
67+ updatedUserInfo . nextPrescriptionReminder ,
68+ false ,
69+ updatedUserInfo . unsubscribeEmail ,
70+ ) ;
71+ }
72+
73+ return (
74+ < BaseOverlay
75+ header = {
76+ < View style = { styles . header } >
77+ < Text > { /* This is just to align the text */ } </ Text >
78+ < Text style = { styles . headerText } > User Settings</ Text >
79+ < IconButton
80+ callbackFunction = { ( ) => {
81+ props . navigation . navigate ( Screens . USER_DASHBOARD_SCREEN ) ;
82+ } }
83+ icon = {
84+ < MaterialCommunityIcons name = "home" size = { 26 } color = "#3F3BED" />
85+ }
86+ />
87+ </ View >
88+ }
89+
90+ body = {
91+ < View style = { styles . container } >
92+ < View style = { styles . setting } >
93+ < Text style = { styles . settingText } > Unsubscribe from Emails?</ Text >
94+ < Switch
95+ trackColor = { { false : "#EBEBE4" , true : "#32CD32" } }
96+ thumbColor = { "#f4f3f4" }
97+ ios_backgroundColor = "#3e3e3e"
98+ onValueChange = { toggleSwitch }
99+ value = { userInfo ?. unsubscribeEmail }
100+ />
101+ </ View >
102+ </ View >
103+ }
104+
105+ footer = { < ErrorBox errorMessage = { error } /> }
106+ />
107+ ) ;
108+ }
109+
110+ const styles = StyleSheet . create ( {
111+ header : {
112+ flexDirection : 'row' ,
113+ justifyContent : 'space-between' ,
114+ alignItems : 'center' ,
115+ marginBottom : 30 ,
116+ } ,
117+ headerText : {
118+ fontSize : 24 ,
119+ fontWeight : 'bold' ,
120+ } ,
121+ container : {
122+ flex : 1 ,
123+ justifyContent : 'center' ,
124+ alignItems : 'center' ,
125+ } ,
126+ setting : {
127+ flexDirection : 'row' ,
128+ justifyContent : 'space-between' ,
129+ alignItems : 'center' ,
130+ marginBottom : 20 ,
131+ } ,
132+ settingText : {
133+ paddingRight : 15 ,
134+ }
135+ } ) ;
0 commit comments