From 0f78f9bde17556d4be145d36a2f0a798a921b1e8 Mon Sep 17 00:00:00 2001 From: Stephanie Wong Date: Wed, 3 May 2023 22:52:43 -0700 Subject: [PATCH 1/5] language prog --- src/context/AuthContext.tsx | 8 +- src/firebase/auth.ts | 22 +++- src/firebase/firestore/user.ts | 2 + .../AdminSignin/AdminSignin.tsx | 6 +- .../EmailPasswordRegister.tsx | 12 +- .../VerificationCode/VerificationCode.tsx | 10 +- .../Authentication/Welcome/Welcome.tsx | 65 +++++++--- src/screens/Authentication/Welcome/styles.ts | 120 +++++++++++++----- src/translation/languages.tsx | 3 + 9 files changed, 182 insertions(+), 66 deletions(-) diff --git a/src/context/AuthContext.tsx b/src/context/AuthContext.tsx index 3c0c29ee..688dd21b 100644 --- a/src/context/AuthContext.tsx +++ b/src/context/AuthContext.tsx @@ -2,7 +2,7 @@ import { getAuth } from 'firebase/auth'; import React, { createContext, useEffect, useMemo, useReducer } from 'react'; import firebaseApp from '../firebase/firebaseApp'; import { getUser } from '../firebase/firestore/user'; -import { langToDictMap } from '../translation/languages'; +import { dictionaryList, langToDictMap } from '../translation/languages'; import { Dictionary, RegularUser } from '../types/types'; export type AuthDispatch = React.Dispatch; @@ -13,7 +13,7 @@ export interface AuthState { isLoading: boolean; userObject: RegularUser | null; dispatch: AuthDispatch; - langState: Dictionary | null; + langState: Dictionary; langUpdate: React.Dispatch>; } @@ -70,7 +70,7 @@ export const useAuthReducer = () => isLoading: true, userObject: null, dispatch: () => null, - langState: null, + langState: dictionaryList.EN, langUpdate: () => null, }, ); @@ -93,7 +93,7 @@ export function AuthContextProvider({ children: React.ReactNode; }) { const [authState, dispatch] = useAuthReducer(); - const [langState, langUpdate] = React.useState(); // set this state in the useAuthReducer switch statement --> a dictionary + const [langState, langUpdate] = React.useState(dictionaryList.EN); // set this state in the useAuthReducer switch statement --> a dictionary // Subscribe to auth state changes and restore the user if they're already signed in useEffect(() => { diff --git a/src/firebase/auth.ts b/src/firebase/auth.ts index 998c73e2..11697722 100644 --- a/src/firebase/auth.ts +++ b/src/firebase/auth.ts @@ -90,12 +90,18 @@ export const signUpEmail = async ( password: string; phoneNumber: string; userType: string; + language: string; }, ) => { createUserWithEmailAndPassword(auth, params.email, params.password) .then(async userCredential => { const { user } = userCredential; - await checkAndAddUser(user, params.userType, params.phoneNumber); + await checkAndAddUser( + user, + params.userType, + params.phoneNumber, + params.language, + ); console.log('Email sign up successful', user.email); await activateUser(params.phoneNumber); const UserObject = await getUser(user.uid); @@ -108,13 +114,17 @@ export const signUpEmail = async ( export const signInEmail = async ( dispatch: AuthDispatch, - params: { email: string; password: string }, + params: { email: string; password: string; language: string }, ) => { signInWithEmailAndPassword(auth, params.email, params.password) .then(async userCredential => { const { user } = userCredential; console.log('Email sign in successful', user.email); const UserObject = await getUser(user.uid); + // if uswe obj + const map: Map = new Map([['language', params.language]]); + updateUser(UserObject.id, map, UserObject?.access); // TODO: userobject vs user + console.log(UserObject?.language); dispatch({ type: 'SIGN_IN', userObject: UserObject }); }) .catch(error => { @@ -124,7 +134,11 @@ export const signInEmail = async ( export const signInPhone = async ( dispatch: AuthDispatch, - params: { verificationId: string; verificationCode: string }, + params: { + verificationId: string; + verificationCode: string; + language: string; + }, ) => { try { const credential = await PhoneAuthProvider.credential( @@ -132,7 +146,7 @@ export const signInPhone = async ( params.verificationCode, ); const result = await signInWithCredential(auth, credential); - await checkAndAddUser(result.user, 'regularUser', null); + await checkAndAddUser(result.user, 'regularUser', null, params.language); console.log('Phone authentication successful', result.user.phoneNumber); const UserObject = await getUser(result.user.uid); dispatch({ type: 'SIGN_IN', userObject: UserObject }); diff --git a/src/firebase/firestore/user.ts b/src/firebase/firestore/user.ts index 9d343114..5ae17a91 100644 --- a/src/firebase/firestore/user.ts +++ b/src/firebase/firestore/user.ts @@ -101,6 +101,7 @@ export const checkAndAddUser = async ( user: UserCredential['user'], accessLevel: string, phoneNumber: string | null, + language: string, ) => { const userObject = await getUser(user.uid); if (userObject !== null) { @@ -124,6 +125,7 @@ export const checkAndAddUser = async ( name: 'test phone', phoneNumber: assignPhoneNumber, verified: true, + language, }); } }; diff --git a/src/screens/Authentication/AdminSignin/AdminSignin.tsx b/src/screens/Authentication/AdminSignin/AdminSignin.tsx index c28a5a50..5fa6a1ad 100644 --- a/src/screens/Authentication/AdminSignin/AdminSignin.tsx +++ b/src/screens/Authentication/AdminSignin/AdminSignin.tsx @@ -12,6 +12,7 @@ import AuthInput from '../../../components/AuthInput/AuthInput'; import StyledButton from '../../../components/StyledButton/StyledButton'; import { AuthContext } from '../../../context/AuthContext'; import { signInEmail } from '../../../firebase/auth'; +import { dictToLang } from '../../../translation/languages'; import { AuthStackScreenProps } from '../../../types/navigation'; import styles from './styles'; @@ -31,12 +32,13 @@ function AdminSigninScreen({ const [password, setPassword] = useState(''); const [emailError, setEmailError] = useState(''); const [signInError, setSignInError] = useState(''); - const { dispatch } = useContext(AuthContext); + const { dispatch, langState } = useContext(AuthContext); + const language = dictToLang(langState); const onSubmit: SubmitHandler = async data => { try { emailSchema.parse(email); - await signInEmail(dispatch, { email, password }); + await signInEmail(dispatch, { email, password, language }); } catch (e) { if (e instanceof z.ZodError) { setEmailError('Oops! Invalid email. Try again.'); diff --git a/src/screens/Authentication/EmailPasswordRegister/EmailPasswordRegister.tsx b/src/screens/Authentication/EmailPasswordRegister/EmailPasswordRegister.tsx index 06e248d1..7627bf12 100644 --- a/src/screens/Authentication/EmailPasswordRegister/EmailPasswordRegister.tsx +++ b/src/screens/Authentication/EmailPasswordRegister/EmailPasswordRegister.tsx @@ -12,6 +12,7 @@ import AuthInput from '../../../components/AuthInput/AuthInput'; import StyledButton from '../../../components/StyledButton/StyledButton'; import { AuthContext } from '../../../context/AuthContext'; import { signUpEmail } from '../../../firebase/auth'; +import { dictToLang } from '../../../translation/languages'; import { AuthStackScreenProps } from '../../../types/navigation'; import styles from './styles'; @@ -33,7 +34,8 @@ function EmailPasswordRegisterScreen({ const [passwordError, setPasswordError] = useState(''); const [confirmPass, setConfirmPass] = useState(''); const [confirmError, setConfirmError] = useState(''); - const { dispatch } = useContext(AuthContext); + const { dispatch, langState } = useContext(AuthContext); + const language = dictToLang(langState); const onSubmit: SubmitHandler = async data => { if (confirmPass !== password) { @@ -41,7 +43,13 @@ function EmailPasswordRegisterScreen({ } try { emailSchema.parse(email); - await signUpEmail(dispatch, { email, password, phoneNumber, userType }); + await signUpEmail(dispatch, { + email, + password, + phoneNumber, + userType, + language, + }); } catch (e) { if (e instanceof z.ZodError) { setEmailError('Oops! Invalid email. Try again.'); diff --git a/src/screens/Authentication/VerificationCode/VerificationCode.tsx b/src/screens/Authentication/VerificationCode/VerificationCode.tsx index 35f88d9f..c36ddaae 100644 --- a/src/screens/Authentication/VerificationCode/VerificationCode.tsx +++ b/src/screens/Authentication/VerificationCode/VerificationCode.tsx @@ -12,6 +12,7 @@ import StyledButton from '../../../components/StyledButton/StyledButton'; import { AuthContext } from '../../../context/AuthContext'; import { signInPhone, signUpPhoneAdmin } from '../../../firebase/auth'; import { getAccess } from '../../../firebase/firestore/access'; +import { dictToLang } from '../../../translation/languages'; import { AuthStackScreenProps } from '../../../types/navigation'; import styles from './styles'; @@ -26,7 +27,8 @@ function VerificationScreen({ const { ...methods } = useForm(); const [verificationCode, setVerificationCode] = useState(''); const { verificationId, phoneNumber, userType } = route.params; - const { dispatch } = useContext(AuthContext); + const { dispatch, langState } = useContext(AuthContext); + const language = dictToLang(langState); const onSubmit: SubmitHandler = async () => { try { @@ -38,7 +40,11 @@ function VerificationScreen({ navigation.navigate('EmployerRegisterScreen', { phoneNumber }); } if (userType === 'jobSeeker') { - await signInPhone(dispatch, { verificationId, verificationCode }); + await signInPhone(dispatch, { + verificationId, + verificationCode, + language, + }); } } else { // check type of doc, if employer then nav to error diff --git a/src/screens/Authentication/Welcome/Welcome.tsx b/src/screens/Authentication/Welcome/Welcome.tsx index 07f4a69c..ca30cf75 100644 --- a/src/screens/Authentication/Welcome/Welcome.tsx +++ b/src/screens/Authentication/Welcome/Welcome.tsx @@ -1,16 +1,19 @@ import { FirebaseRecaptchaVerifierModal } from 'expo-firebase-recaptcha'; -import React, { useRef } from 'react'; -import { Image, Text, View } from 'react-native'; +import React, { useContext, useRef } from 'react'; +import { Image, Modal, Text, TouchableOpacity, View } from 'react-native'; import logo from '../../../assets/cnsc-logo.png'; -import StyledButton from '../../../components/StyledButton/StyledButton'; +import { AuthContext } from '../../../context/AuthContext'; import { firebaseApp } from '../../../firebase/firebaseApp'; -import '../../../translation/languages'; +import { checkAndGetLang } from '../../../translation/languages'; import { AuthStackScreenProps } from '../../../types/navigation'; import styles from './styles'; function WelcomeScreen({ navigation }: AuthStackScreenProps<'WelcomeScreen'>) { const recaptchaVerifier = useRef(null); + const [langModalVisibile, setLangModalVisible] = React.useState(true); + const { langUpdate } = useContext(AuthContext); + return ( @@ -23,26 +26,54 @@ function WelcomeScreen({ navigation }: AuthStackScreenProps<'WelcomeScreen'>) { - navigation.navigate('UserTypeScreen')} - buttonStyle={{}} - textStyle={{}} - /> - - OR - - + SIGN UP + + navigation.navigate('SigninScreen')} - buttonStyle={{ backgroundColor: '#FFFFFF', borderColor: '#CC433C' }} - textStyle={{ color: '#CC433C' }} - /> + > + + LOG IN + + + + + + + Select Language + + + { + setLangModalVisible(false); + langUpdate(checkAndGetLang('english')); + }} + > + English + + { + setLangModalVisible(false); + langUpdate(checkAndGetLang('chinese')); + }} + > + 中文 + + + + + ); } diff --git a/src/screens/Authentication/Welcome/styles.ts b/src/screens/Authentication/Welcome/styles.ts index 3127b5ba..b9a1598d 100644 --- a/src/screens/Authentication/Welcome/styles.ts +++ b/src/screens/Authentication/Welcome/styles.ts @@ -1,12 +1,7 @@ -import { StyleSheet, Dimensions, PixelRatio } from 'react-native'; +import { Dimensions, StyleSheet } from 'react-native'; +import globalStyles from '../../../styles/theme'; const windowWidth = Dimensions.get('window').width; -const windowHeight = Dimensions.get('window').height; -const scale = windowWidth / 390; -console.log(windowWidth); -console.log(scale); -console.log(windowHeight); -const leftMargin = '9%'; export default StyleSheet.create({ container: { @@ -17,47 +12,102 @@ export default StyleSheet.create({ flexDirection: 'column', }, logoContainer: { - width: '100%', - height: '13%', - justifyContent: 'flex-start', - marginLeft: leftMargin, - marginTop: '8%', + alignItems: 'center', + marginTop: 130, }, logo: { resizeMode: 'contain', - height: '100%', - width: '22%', + height: 130, + width: 130, }, textContainer: { - width: '76%', - height: '25%', - justifyContent: 'space-between', - marginLeft: leftMargin, - marginTop: '35%', + width: 340, + height: 170, + display: 'flex', + alignSelf: 'center', + justifyContent: 'space-evenly', + marginTop: 20, }, buttonContainer: { - flexDirection: 'column', - justifyContent: 'flex-start', - height: '38%', alignItems: 'center', - marginTop: '22%', + marginTop: 90, + justifyContent: 'space-around', + height: 200, }, welcomeText: { - fontFamily: 'DMSans_500Medium', - color: '#49260C', - fontSize: Math.round(PixelRatio.roundToNearestPixel(30 * scale)), - fontWeight: '500', + ...globalStyles.textVariants.h1, + color: '#CC433C', + fontSize: 45, letterSpacing: 0.5, + textAlign: 'center', }, subText: { - fontFamily: 'DMSans_500Medium', - color: '#94613D', - fontSize: Math.round(PixelRatio.roundToNearestPixel(16 * scale)), - fontWeight: '400', + ...globalStyles.textVariants.h2, + color: '#49260C', + fontSize: 25, + textAlign: 'center', + lineHeight: 35, }, - orText: { - color: '#CC433C', - fontSize: Math.round(PixelRatio.roundToNearestPixel(18 * scale)), - fontWeight: '500', + welcomeButtons: { + backgroundColor: '#CC433C', + width: 300, + height: 59, + borderRadius: 7, + borderColor: '#D82D1F', + borderWidth: 1.5, + alignItems: 'center', + justifyContent: 'center', + }, + welcomeButtonText: { + ...globalStyles.textVariants.h3, + color: globalStyles.colors.background, + fontSize: 18, + }, + centeredView: { + flex: 1, + justifyContent: 'center', + alignItems: 'center', + marginTop: 22, + }, + modalView: { + marginTop: 480, + height: 350, + width: windowWidth, + backgroundColor: 'white', + alignItems: 'center', + shadowColor: '#000', + borderRadius: 20, + borderColor: globalStyles.colors.background, + borderWidth: 2, + shadowOpacity: 0.25, + elevation: 5, + }, + modalHeader: { + marginTop: 50, + width: windowWidth, + alignItems: 'center', + }, + modalChooseLang: { + ...globalStyles.textVariants.h3, + fontSize: 28, + }, + modalButtonsContainer: { + height: 170, + width: 280, + alignItems: 'center', + marginTop: 32, + justifyContent: 'space-around', + }, + modalButtons: { + backgroundColor: '#CC433C', + width: 230, + height: 57, + borderRadius: 7, + alignItems: 'center', + justifyContent: 'center', + }, + modalButtonsText: { + ...globalStyles.textVariants.h3, + color: globalStyles.colors.background, }, }); diff --git a/src/translation/languages.tsx b/src/translation/languages.tsx index f9488dd4..bf8583f5 100644 --- a/src/translation/languages.tsx +++ b/src/translation/languages.tsx @@ -16,3 +16,6 @@ export const langToDictMap: Map = new Map([ export const checkAndGetLang = (language: string): Dictionary => langToDictMap.has(language) ? langToDictMap.get(language) : dictionaryList.EN; + +export const dictToLang = (langMap: Dictionary | null): string => + langMap === CN ? 'chinese' : 'english'; From 88b529cc39b61f9303bf515b2e2e1e8fa82a1d3b Mon Sep 17 00:00:00 2001 From: Stephanie Wong Date: Wed, 3 May 2023 22:58:07 -0700 Subject: [PATCH 2/5] done but only tested on admin: --- src/firebase/auth.ts | 24 +++++++++++++++--------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/src/firebase/auth.ts b/src/firebase/auth.ts index 11697722..caf70e26 100644 --- a/src/firebase/auth.ts +++ b/src/firebase/auth.ts @@ -121,10 +121,12 @@ export const signInEmail = async ( const { user } = userCredential; console.log('Email sign in successful', user.email); const UserObject = await getUser(user.uid); - // if uswe obj - const map: Map = new Map([['language', params.language]]); - updateUser(UserObject.id, map, UserObject?.access); // TODO: userobject vs user - console.log(UserObject?.language); + if (UserObject) { + const map: Map = new Map([ + ['language', params.language], + ]); + updateUser(UserObject.id, map, UserObject?.access); + } dispatch({ type: 'SIGN_IN', userObject: UserObject }); }) .catch(error => { @@ -171,9 +173,13 @@ export const updateLanguage = async ( langUpdate: React.Dispatch>, params: { language: string }, ) => { - const user = await getUser(auth.currentUser.uid); - const map: Map = new Map([['language', params.language]]); - updateUser(user?.id, map, user?.access); - langUpdate(checkAndGetLang(params.language)); - dispatch({ type: 'UPDATE_LANGUAGE', language: params.language }); + if (auth.currentUser) { + const user = await getUser(auth.currentUser.uid); + if (user) { + const map: Map = new Map([['language', params.language]]); + updateUser(user.id, map, user.access); + langUpdate(checkAndGetLang(params.language)); + dispatch({ type: 'UPDATE_LANGUAGE', language: params.language }); + } + } }; From ea21b9c60c748168e1b5627a022f1b8b651b15be Mon Sep 17 00:00:00 2001 From: Stephanie Wong Date: Wed, 3 May 2023 23:18:48 -0700 Subject: [PATCH 3/5] use Translate instaed of GetText --- src/context/AuthContext.tsx | 24 +++++++++---- src/navigation/stacks/FeedStackNavigator.tsx | 7 ++-- src/screens/Drafting/Draft.tsx | 38 +++++++++++--------- src/translation/chinese.json | 3 +- src/translation/english.json | 2 ++ src/translation/languages.tsx | 2 +- 6 files changed, 49 insertions(+), 27 deletions(-) diff --git a/src/context/AuthContext.tsx b/src/context/AuthContext.tsx index 688dd21b..323f03af 100644 --- a/src/context/AuthContext.tsx +++ b/src/context/AuthContext.tsx @@ -1,5 +1,11 @@ import { getAuth } from 'firebase/auth'; -import React, { createContext, useEffect, useMemo, useReducer } from 'react'; +import React, { + createContext, + useContext, + useEffect, + useMemo, + useReducer, +} from 'react'; import firebaseApp from '../firebase/firebaseApp'; import { getUser } from '../firebase/firestore/user'; import { dictionaryList, langToDictMap } from '../translation/languages'; @@ -76,16 +82,22 @@ export const useAuthReducer = () => ); // get translated string function -const I18n = ({ str }) => { - const dict = React.useContext(AuthContext).langState; +// export const I18n = ({ str }) => { +// const dict = useContext(AuthContext).langState; +// const translated = dict && dict[str] ? dict[str] : str; +// return translated; +// }; + +export const Translate = (str: string) => { + const dict = useContext(AuthContext).langState; const translated = dict && dict[str] ? dict[str] : str; return translated; }; // wrapper function for I18n -export function GetText(str: string) { - return ; -} +// export function GetText(str: string) { +// return ; +// } export function AuthContextProvider({ children, diff --git a/src/navigation/stacks/FeedStackNavigator.tsx b/src/navigation/stacks/FeedStackNavigator.tsx index 83aebefc..af18945b 100644 --- a/src/navigation/stacks/FeedStackNavigator.tsx +++ b/src/navigation/stacks/FeedStackNavigator.tsx @@ -1,14 +1,15 @@ import { createStackNavigator } from '@react-navigation/stack'; import React from 'react'; -import FeedScreen from '../../screens/Feed/FeedScreen'; -import { FeedStackParamList } from '../../types/navigation'; import Header from '../../components/Header/Header'; import styles from '../../components/Header/styles'; +import { Translate } from '../../context/AuthContext'; +import FeedScreen from '../../screens/Feed/FeedScreen'; +import { FeedStackParamList } from '../../types/navigation'; const FeedStack = createStackNavigator(); function FeedHeader() { - return
; + return
; } export default function FeedStackNavigator() { diff --git a/src/screens/Drafting/Draft.tsx b/src/screens/Drafting/Draft.tsx index 10694570..d00a51c4 100644 --- a/src/screens/Drafting/Draft.tsx +++ b/src/screens/Drafting/Draft.tsx @@ -6,7 +6,7 @@ import DropDownPicker from 'react-native-dropdown-picker'; import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view'; import FormInput from '../../components/JobPostFormInput/JobPostFormInput'; import StyledButton from '../../components/StyledButton/StyledButton'; -import { GetText } from '../../context/AuthContext'; +import { Translate } from '../../context/AuthContext'; import { createJob } from '../../firebase/firestore/job'; import { DraftStackScreenProps } from '../../types/navigation'; import { Job } from '../../types/types'; @@ -118,7 +118,7 @@ function DraftScreen({ - {GetText('Toggles determine what information is displayed')} + {Translate('Toggles determine what information is displayed')} @@ -148,7 +148,7 @@ function DraftScreen({ value={jobPositionIsEnabled} trackColor={{ false: '#767577', true: '#000000' }} /> - {GetText('Job Position')} + {Translate('Job Position')} - {GetText('Phone')} + {Translate('Phone')} - {GetText('Address/Location')} + + {Translate('Address/Location')} + - {GetText('Language Requirement')} + {Translate('Language Requirement')} - {GetText('Company Name')} + {Translate('Company Name')} - {GetText('Contact Person')} + {Translate('Contact Person')} - {GetText('Working hours/day')} + {Translate('Working hours/day')} - {GetText('Working days/week')} + {Translate('Working days/week')} - {GetText('Salary')} + {Translate('Salary')} @@ -296,7 +298,9 @@ function DraftScreen({ value={probationPeriodIsEnabled} trackColor={{ false: '#767577', true: '#000000' }} /> - {GetText('Probation Period')} + + {Translate('Probation Period')} + - {GetText('Employee Benefit')} + + {Translate('Employee Benefit')} + - {GetText('Other Information')} + {Translate('Other Information')} - {GetText('Save Draft')} + {Translate('Save Draft')} - {GetText('Post Job')} + {Translate('Post Job')} diff --git a/src/translation/chinese.json b/src/translation/chinese.json index da827b6d..8601ea6c 100644 --- a/src/translation/chinese.json +++ b/src/translation/chinese.json @@ -14,5 +14,6 @@ "Other Information": "其他信息", "Save Draft": "保存草稿", "Post Job": "发布工作", - "Make sure to fill out all required fields at the top of the screen!": "确保填写屏幕顶部的所有必填字段！" + "Make sure to fill out all required fields at the top of the screen!": "确保填写屏幕顶部的所有必填字段", + "Jobs": "Jobs chinese" } diff --git a/src/translation/english.json b/src/translation/english.json index fe55ecec..136e3943 100644 --- a/src/translation/english.json +++ b/src/translation/english.json @@ -12,6 +12,8 @@ "Enter phone": "Enter your phone number:", "We'll send you a six digit verification code": "We'll send a six-digit verification code to you via text.", + "Jobs": "Jobs", + "Toggles determine what information is displayed": "Toggles determine what information is displayed in your public job posting.", "Job Position": "Job Position*", "Phone": "Phone*", diff --git a/src/translation/languages.tsx b/src/translation/languages.tsx index bf8583f5..4ce2d73a 100644 --- a/src/translation/languages.tsx +++ b/src/translation/languages.tsx @@ -17,5 +17,5 @@ export const langToDictMap: Map = new Map([ export const checkAndGetLang = (language: string): Dictionary => langToDictMap.has(language) ? langToDictMap.get(language) : dictionaryList.EN; -export const dictToLang = (langMap: Dictionary | null): string => +export const dictToLang = (langMap: Dictionary): string => langMap === CN ? 'chinese' : 'english'; From 71b78e14f98c53e809b6378fa3f4e3323c729724 Mon Sep 17 00:00:00 2001 From: Stephanie Wong Date: Thu, 4 May 2023 00:13:17 -0700 Subject: [PATCH 4/5] fixed --- src/context/AuthContext.tsx | 17 ++--------------- src/firebase/auth.ts | 13 +++++++++++-- .../Authentication/AdminSignin/AdminSignin.tsx | 6 ++++-- .../VerificationCode/VerificationCode.tsx | 4 ++-- src/screens/Authentication/Welcome/styles.ts | 9 +++++++-- 5 files changed, 26 insertions(+), 23 deletions(-) diff --git a/src/context/AuthContext.tsx b/src/context/AuthContext.tsx index 323f03af..5e2ad71e 100644 --- a/src/context/AuthContext.tsx +++ b/src/context/AuthContext.tsx @@ -8,7 +8,7 @@ import React, { } from 'react'; import firebaseApp from '../firebase/firebaseApp'; import { getUser } from '../firebase/firestore/user'; -import { dictionaryList, langToDictMap } from '../translation/languages'; +import { checkAndGetLang, dictionaryList } from '../translation/languages'; import { Dictionary, RegularUser } from '../types/types'; export type AuthDispatch = React.Dispatch; @@ -81,24 +81,12 @@ export const useAuthReducer = () => }, ); -// get translated string function -// export const I18n = ({ str }) => { -// const dict = useContext(AuthContext).langState; -// const translated = dict && dict[str] ? dict[str] : str; -// return translated; -// }; - export const Translate = (str: string) => { const dict = useContext(AuthContext).langState; const translated = dict && dict[str] ? dict[str] : str; return translated; }; -// wrapper function for I18n -// export function GetText(str: string) { -// return ; -// } - export function AuthContextProvider({ children, }: { @@ -114,8 +102,7 @@ export function AuthContextProvider({ if (user) { UserObject = await getUser(user.uid); if (UserObject?.language) { - const val = langToDictMap.get(UserObject?.language); - langUpdate(val); + langUpdate(checkAndGetLang(UserObject.language)); } } dispatch({ diff --git a/src/firebase/auth.ts b/src/firebase/auth.ts index caf70e26..d0519c2e 100644 --- a/src/firebase/auth.ts +++ b/src/firebase/auth.ts @@ -8,6 +8,7 @@ import { signOut, User, } from 'firebase/auth'; +import { SetStateAction } from 'react'; import { AuthDispatch } from '../context/AuthContext'; import { checkAndGetLang } from '../translation/languages'; import { Dictionary } from '../types/types'; @@ -114,6 +115,7 @@ export const signUpEmail = async ( export const signInEmail = async ( dispatch: AuthDispatch, + langUpdate: React.Dispatch>, params: { email: string; password: string; language: string }, ) => { signInWithEmailAndPassword(auth, params.email, params.password) @@ -121,11 +123,16 @@ export const signInEmail = async ( const { user } = userCredential; console.log('Email sign in successful', user.email); const UserObject = await getUser(user.uid); + console.log(UserObject); if (UserObject) { + console.log(params.language); const map: Map = new Map([ ['language', params.language], ]); - updateUser(UserObject.id, map, UserObject?.access); + await updateUser(UserObject.id, map, UserObject.access); + UserObject.language = params.language; + langUpdate(checkAndGetLang(params.language)); + console.log(UserObject); } dispatch({ type: 'SIGN_IN', userObject: UserObject }); }) @@ -136,6 +143,7 @@ export const signInEmail = async ( export const signInPhone = async ( dispatch: AuthDispatch, + langUpdate: React.Dispatch>, params: { verificationId: string; verificationCode: string; @@ -149,6 +157,7 @@ export const signInPhone = async ( ); const result = await signInWithCredential(auth, credential); await checkAndAddUser(result.user, 'regularUser', null, params.language); + langUpdate(checkAndGetLang(params.language)); console.log('Phone authentication successful', result.user.phoneNumber); const UserObject = await getUser(result.user.uid); dispatch({ type: 'SIGN_IN', userObject: UserObject }); @@ -177,7 +186,7 @@ export const updateLanguage = async ( const user = await getUser(auth.currentUser.uid); if (user) { const map: Map = new Map([['language', params.language]]); - updateUser(user.id, map, user.access); + await updateUser(user.id, map, user.access); langUpdate(checkAndGetLang(params.language)); dispatch({ type: 'UPDATE_LANGUAGE', language: params.language }); } diff --git a/src/screens/Authentication/AdminSignin/AdminSignin.tsx b/src/screens/Authentication/AdminSignin/AdminSignin.tsx index 5fa6a1ad..597eea67 100644 --- a/src/screens/Authentication/AdminSignin/AdminSignin.tsx +++ b/src/screens/Authentication/AdminSignin/AdminSignin.tsx @@ -32,13 +32,15 @@ function AdminSigninScreen({ const [password, setPassword] = useState(''); const [emailError, setEmailError] = useState(''); const [signInError, setSignInError] = useState(''); - const { dispatch, langState } = useContext(AuthContext); + const { dispatch, langState, langUpdate } = useContext(AuthContext); + // const [language, setLanguage] = useState(''); + const language = dictToLang(langState); const onSubmit: SubmitHandler = async data => { try { emailSchema.parse(email); - await signInEmail(dispatch, { email, password, language }); + await signInEmail(dispatch, langUpdate, { email, password, language }); } catch (e) { if (e instanceof z.ZodError) { setEmailError('Oops! Invalid email. Try again.'); diff --git a/src/screens/Authentication/VerificationCode/VerificationCode.tsx b/src/screens/Authentication/VerificationCode/VerificationCode.tsx index c36ddaae..a0f9458f 100644 --- a/src/screens/Authentication/VerificationCode/VerificationCode.tsx +++ b/src/screens/Authentication/VerificationCode/VerificationCode.tsx @@ -27,7 +27,7 @@ function VerificationScreen({ const { ...methods } = useForm(); const [verificationCode, setVerificationCode] = useState(''); const { verificationId, phoneNumber, userType } = route.params; - const { dispatch, langState } = useContext(AuthContext); + const { dispatch, langState, langUpdate } = useContext(AuthContext); const language = dictToLang(langState); const onSubmit: SubmitHandler = async () => { @@ -40,7 +40,7 @@ function VerificationScreen({ navigation.navigate('EmployerRegisterScreen', { phoneNumber }); } if (userType === 'jobSeeker') { - await signInPhone(dispatch, { + await signInPhone(dispatch, langUpdate, { verificationId, verificationCode, language, diff --git a/src/screens/Authentication/Welcome/styles.ts b/src/screens/Authentication/Welcome/styles.ts index b9a1598d..d424c6ab 100644 --- a/src/screens/Authentication/Welcome/styles.ts +++ b/src/screens/Authentication/Welcome/styles.ts @@ -79,8 +79,13 @@ export default StyleSheet.create({ borderRadius: 20, borderColor: globalStyles.colors.background, borderWidth: 2, - shadowOpacity: 0.25, - elevation: 5, + shadowOpacity: 0.95, + elevation: 50, + shadowOffset: { + width: 0, + height: 5, + }, + shadowRadius: 200, }, modalHeader: { marginTop: 50, From 37cd2731fa48c2fa8f8f2e71d3ef2527a421b9a9 Mon Sep 17 00:00:00 2001 From: Stephanie Wong Date: Sun, 7 May 2023 15:34:53 -0700 Subject: [PATCH 5/5] done --- src/firebase/auth.ts | 3 +-- src/firebase/firestore/user.ts | 3 +++ 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/firebase/auth.ts b/src/firebase/auth.ts index d0519c2e..ecf2431b 100644 --- a/src/firebase/auth.ts +++ b/src/firebase/auth.ts @@ -123,9 +123,7 @@ export const signInEmail = async ( const { user } = userCredential; console.log('Email sign in successful', user.email); const UserObject = await getUser(user.uid); - console.log(UserObject); if (UserObject) { - console.log(params.language); const map: Map = new Map([ ['language', params.language], ]); @@ -156,6 +154,7 @@ export const signInPhone = async ( params.verificationCode, ); const result = await signInWithCredential(auth, credential); + console.log(params.language); await checkAndAddUser(result.user, 'regularUser', null, params.language); langUpdate(checkAndGetLang(params.language)); console.log('Phone authentication successful', result.user.phoneNumber); diff --git a/src/firebase/firestore/user.ts b/src/firebase/firestore/user.ts index 5ae17a91..b5934c06 100644 --- a/src/firebase/firestore/user.ts +++ b/src/firebase/firestore/user.ts @@ -106,6 +106,9 @@ export const checkAndAddUser = async ( const userObject = await getUser(user.uid); if (userObject !== null) { console.log('Got user from users collection'); + const map: Map = new Map([['language', language]]); + await updateUser(userObject.id, map, userObject.access); + userObject.language = language; } else { console.log('Create new user flow'); let assignPhoneNumber = null;