diff --git a/src/screen/SignInScreen.tsx b/src/screen/SignInScreen.tsx index af5b04d..135d837 100644 --- a/src/screen/SignInScreen.tsx +++ b/src/screen/SignInScreen.tsx @@ -14,6 +14,7 @@ import { authRouteNames, colors } from '@/constants'; import { TextMedium, TextSemiBold } from '@/entities/fonts'; import { AuthStackParams } from '@/navigations/stack/AuthStackNavigator'; import useNavigationStore from '@/store/stores/navigationStore'; +import useSignupStore from '@/store/stores/signupStore'; import { AuthAgent } from '@/types'; import { isIOS } from '@/utils/platform'; @@ -24,11 +25,13 @@ type SignInScreenProps = NativeStackScreenProps< function SignInScreen({ navigation }: SignInScreenProps) { const { navigate } = useNavigationStore(); + const { setOAuthProvider } = useSignupStore(); function handleSignIn(agent: AuthAgent) { - authorizeWithAgent(agent).then(() => - navigate(navigation, authRouteNames.JOIN1), - ); + authorizeWithAgent(agent).then(() => { + setOAuthProvider(agent); + navigate(navigation, authRouteNames.JOIN1); + }); } return ( diff --git a/src/screen/sign-up/Join1Screen.tsx b/src/screen/sign-up/Join1Screen.tsx index 785fe6e..fefe9d0 100644 --- a/src/screen/sign-up/Join1Screen.tsx +++ b/src/screen/sign-up/Join1Screen.tsx @@ -1,5 +1,5 @@ import { NativeStackScreenProps } from '@react-navigation/native-stack'; -import React from 'react'; +import React, { useState } from 'react'; import { Image, Pressable, StyleSheet, View } from 'react-native'; import { authRouteNames, colors } from '@/constants'; @@ -8,6 +8,7 @@ import { TextBold, TextRegular } from '@/entities/fonts'; import SafeScreenWithHeader from '@/entities/safeScreen/SafeScreenWithHeader'; import { AuthStackParams } from '@/navigations/stack/AuthStackNavigator'; import useNavigationStore from '@/store/stores/navigationStore'; +import useSignupStore from '@/store/stores/signupStore'; type Join1ScreenProps = NativeStackScreenProps< AuthStackParams, @@ -16,6 +17,16 @@ type Join1ScreenProps = NativeStackScreenProps< function Join1Screen({ navigation }: Join1ScreenProps) { const { navigate, goBack } = useNavigationStore(); + const { setInviteCode, inviteCode } = useSignupStore(); + + //TODO: inviteCode가 null이 아닌 경우 코드가 존재하는지 확인해야 함 + function handleJoin1(inputCode: string | null) { + setInviteCode(inputCode); + navigate(navigation, authRouteNames.JOIN2); + } + + const [code, setCode] = useState(inviteCode ?? ''); + const isCompleteCode = code.length === 8; return ( - + handleJoin1(code)}> 입력 완료 @@ -60,7 +77,7 @@ function Join1Screen({ navigation }: Join1ScreenProps) { navigate(navigation, authRouteNames.JOIN2)}> + onPress={() => handleJoin1(null)}> navigate(navigation, authRouteNames.JOIN3)}> + onPress={() => handleJoin2(name)}> 입력 완료 diff --git a/src/screen/sign-up/Join3Screen.tsx b/src/screen/sign-up/Join3Screen.tsx index 96d43a1..51b679f 100644 --- a/src/screen/sign-up/Join3Screen.tsx +++ b/src/screen/sign-up/Join3Screen.tsx @@ -8,6 +8,8 @@ import RoleSelector from '@/entities/RoleSelector'; import SafeScreenWithHeader from '@/entities/safeScreen/SafeScreenWithHeader'; import { AuthStackParams } from '@/navigations/stack/AuthStackNavigator'; import useNavigationStore from '@/store/stores/navigationStore'; +import useSignupStore from '@/store/stores/signupStore'; +import { FamilyRole } from '@/types'; type Join3ScreenProps = NativeStackScreenProps< AuthStackParams, @@ -15,9 +17,17 @@ type Join3ScreenProps = NativeStackScreenProps< >; function Join3Screen({ navigation }: Join3ScreenProps) { - const [selectedRole, setSelectedRole] = useState('아빠'); - const { navigate, goBack } = useNavigationStore(); + const { setFamilyRole, familyRole } = useSignupStore(); + + const [selectedRole, setSelectedRole] = useState( + familyRole, + ); + + function handleJoin3(inputRole: FamilyRole) { + setFamilyRole(inputRole); + navigate(navigation, authRouteNames.JOIN4); + } return ( navigate(navigation, authRouteNames.JOIN4)}> + className={`mb-2 mt-auto flex-row items-center justify-center rounded-xl px-9 py-3 ${selectedRole ? 'bg-primary-100' : 'bg-gray-300'}`} + disabled={!selectedRole} + onPress={() => selectedRole && handleJoin3(selectedRole)}> 입력 완료 diff --git a/src/screen/sign-up/Join4Screen.tsx b/src/screen/sign-up/Join4Screen.tsx index 8b6b298..a1571a6 100644 --- a/src/screen/sign-up/Join4Screen.tsx +++ b/src/screen/sign-up/Join4Screen.tsx @@ -3,12 +3,12 @@ import React, { useState } from 'react'; import { Image, Pressable, StyleSheet, View } from 'react-native'; import { colors, authRouteNames } from '@/constants'; -import SelectableText from '@/entities/common/SelectableText'; -import CustomInput from '@/entities/CustomInput'; +import { DatePicker, SelectableText } from '@/entities/common'; import { TextBold, TextRegular, TextSemiBold } from '@/entities/fonts'; import SafeScreenWithHeader from '@/entities/safeScreen/SafeScreenWithHeader'; import { AuthStackParams } from '@/navigations/stack/AuthStackNavigator'; import useNavigationStore from '@/store/stores/navigationStore'; +import useSignupStore from '@/store/stores/signupStore'; type Join2ScreenProps = NativeStackScreenProps< AuthStackParams, @@ -16,9 +16,17 @@ type Join2ScreenProps = NativeStackScreenProps< >; function Join4Screen({ navigation }: Join2ScreenProps) { + const { navigate, goBack } = useNavigationStore(); + const { setBirthday, birthday } = useSignupStore(); + const [isLuna, setIsLuna] = useState(false); + const [date, setDate] = useState(birthday); - const { navigate, goBack } = useNavigationStore(); + //TODO: 알림을 위한 token 등록을 위한 과정이 누락 됨 + function handleJoin4(inputDay: Date, inputBirthType: boolean) { + setBirthday(inputDay, inputBirthType ? 'SOLAR' : 'LUNA'); + navigate(navigation, authRouteNames.JOIN5); + } return ( 나의 정보를 입력해 주세요. - 생년월일 6자리를 입력해 주세요 + 생년월일을 입력해 주세요 - 생년월일 (6자리) + 생년월일 - + navigate(navigation, authRouteNames.JOIN5)}> + className={`my-2 mt-auto flex-row items-center justify-center rounded-xl px-9 py-3 ${date ? 'bg-primary-100' : 'bg-gray-300'}`} + onPress={() => date && handleJoin4(date, !isLuna)}> 입력 완료 diff --git a/src/store/stores/signupStore.ts b/src/store/stores/signupStore.ts new file mode 100644 index 0000000..886dc90 --- /dev/null +++ b/src/store/stores/signupStore.ts @@ -0,0 +1,46 @@ +import { create } from 'zustand'; + +import { AlertToken, BirthType, FamilyRole, AuthAgent } from '@/types'; + +type SignupState = Partial<{ + oAuthProvider: AuthAgent; + nickName: string; + inviteCode: string | null; + birthday: Date; + birthType: BirthType; + familyRole: FamilyRole; + registerAlertToken: AlertToken; +}>; +type SignupActions = { + removeAllState: () => void; + setNickName: (nickName: string) => void; + setInviteCode: (inviteCode: string | null) => void; + setOAuthProvider: (oAuthProvider: AuthAgent) => void; + setBirthday: (birthday: Date, birthType: BirthType) => void; + setFamilyRole: (familyRole: FamilyRole) => void; + setRegisterAlertToken: (registerAlertToken: AlertToken) => void; +}; +type Signup = SignupState & SignupActions; + +const initSignupState = { + oAuthProvider: undefined, + nickName: undefined, + inviteCode: undefined, + birthday: undefined, + birthType: undefined, + familyRole: undefined, + registerAlertToken: undefined, +}; + +const useSignupStore = create(set => ({ + ...initSignupState, + removeAllState: () => set(initSignupState), + setOAuthProvider: oAuthProvider => set({ oAuthProvider }), + setInviteCode: inviteCode => set({ inviteCode }), + setNickName: nickName => set({ nickName }), + setFamilyRole: familyRole => set({ familyRole }), + setBirthday: (birthday, birthType) => set({ birthday, birthType }), + setRegisterAlertToken: registerAlertToken => set({ registerAlertToken }), +})); + +export default useSignupStore;