From ad9ae008b68ce90758e7c671d9fb98a5c17d1d15 Mon Sep 17 00:00:00 2001 From: JH-anfseo <51734656+JH-anfseo@users.noreply.github.com> Date: Mon, 9 Jan 2023 13:04:58 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat:create=20login=20#1=20#4=20=EC=BD=94?= =?UTF-8?q?=EB=93=9C=20=EC=A0=95=EB=A6=AC=EA=B0=80=20=EB=94=B0=EB=A1=9C=20?= =?UTF-8?q?=ED=95=84=EC=9A=94=ED=95=9C=20=EC=83=81=ED=83=9C=EC=9E=85?= =?UTF-8?q?=EB=8B=88=EB=8B=A4.=20=EC=B6=94=ED=9B=84=EC=97=90=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=EB=90=A0=20=EC=88=98=20=EC=9E=88=EC=8A=B5=EB=8B=88?= =?UTF-8?q?=EB=8B=A4....?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/screen/LoginPage.jsx | 58 ++++++++++++++++++++++++++++++++++++---- src/shared/firebase.js | 1 + 2 files changed, 54 insertions(+), 5 deletions(-) diff --git a/src/screen/LoginPage.jsx b/src/screen/LoginPage.jsx index 32a96db..c5165cb 100644 --- a/src/screen/LoginPage.jsx +++ b/src/screen/LoginPage.jsx @@ -1,14 +1,62 @@ -import { TouchableOpacity, View, Text } from 'react-native'; +import { TouchableOpacity, View, Text, TextInput } from 'react-native'; +import { useState, useEffect, useRef } from 'react'; +import styled from '@emotion/native'; +import { authService, dbService } from '../shared/firebase'; +import { signInWithEmailAndPassword } from 'firebase/auth'; const LoginPage = ({ navigation: { navigate } }) => { + const checkPW = useRef(null); + const [email, setEmail] = useState(''); + const [pw, setPw] = useState(''); + + const handleLogin = () => { + if (!email) { + alert('email을 입력해주세요.'); + email.current.focus(); + return true; + } + if (!pw) { + alert('password를 입력해주세요.'); + pw.current.focus(); + return true; + } + + // 로그인 요청 + signInWithEmailAndPassword(authService, email, pw) + .then(() => { + setEmail(''); + setPw(''); + navigate('Tabs', { screen: '메인 페이지' }); + }) + .catch((err) => { + if (err.message.includes('user-not-found')) { + alert('회원이 아닙니다. 회원가입을 먼저 진행해 주세요.'); + } + if (err.message.includes('wrong-password')) { + alert('비밀번호가 틀렸습니다.'); + } + }); + }; return ( - navigate('Tabs', { screen: '메인 페이지' })} - > + setEmail(text)} + textContentType="emailAddress" + placeholder="아이디를 입력하세요" + /> + setPw(text)} + textContentType="password" + returnKeyType="send" + placeholder="비밀번호를 입력하세요" + /> + handleLogin()}> 로그인 - navigate('회원가입')}> + navigate('SignupPage')}> 회원가입 diff --git a/src/shared/firebase.js b/src/shared/firebase.js index abd5f3c..5be11c7 100644 --- a/src/shared/firebase.js +++ b/src/shared/firebase.js @@ -24,3 +24,4 @@ const firebaseConfig = { // Initialize Firebase export const app = initializeApp(firebaseConfig); export const dbService = getFirestore(app); +export const authService = getAuth(app); From 83b425a1a453ce91d4ec0e0e9a6b0963842156a7 Mon Sep 17 00:00:00 2001 From: JH-anfseo <51734656+JH-anfseo@users.noreply.github.com> Date: Mon, 9 Jan 2023 16:25:03 +0900 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8,?= =?UTF-8?q?=ED=9A=8C=EC=9B=90=EA=B0=80=EC=9E=85=20=EC=B6=A9=EB=8F=8C=20?= =?UTF-8?q?=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- App.js | 2 -- src/Hooks/useAuth.js | 34 +++++++++++++++++++--------------- src/Navigations/Stacks.js | 2 +- src/screen/Index.js | 2 +- src/screen/LoginPage.jsx | 3 +-- src/screen/MyPage.jsx | 2 +- src/screen/SignupPage.jsx | 13 ++++++++++--- 7 files changed, 33 insertions(+), 25 deletions(-) diff --git a/App.js b/App.js index 5b99ad5..1012493 100644 --- a/App.js +++ b/App.js @@ -5,8 +5,6 @@ import Root from './src/Navigations/Root'; const queryClient = new QueryClient(); export default function App() { - const Stack = createNativeStackNavigator(); - return ( diff --git a/src/Hooks/useAuth.js b/src/Hooks/useAuth.js index 6f52c79..9b55442 100644 --- a/src/Hooks/useAuth.js +++ b/src/Hooks/useAuth.js @@ -1,25 +1,29 @@ import { createUserWithEmailAndPassword } from 'firebase/auth'; import { Keyboard } from 'react-native'; import { useMutation, useQuery } from 'react-query'; -import { auth } from '../shared/firebase'; +import { authService } from '../shared/firebase'; -export const handleSignUp = async (email, password) => { +export const SignUp = async (payload) => { + const { email, password } = payload; Keyboard.dismiss(); // 버튼 클릭 시 키보드 접기 - return createUserWithEmailAndPassword(auth, email, password); + return createUserWithEmailAndPassword(authService, email, password); }; - -useMutation(() => handleSignUp(email, password), { - onError: (error) => { - if (error.message.includes('email-already-in-use')) { - alert( - '이미 가입된 이메일입니다. 로그인을 시도하거나 다른 이메일을 사용해 주세요.', - ); - } - }, -}); - +export const useSignup = () => { + return useMutation(SignUp, { + onError: (error) => { + if (error.message.includes('email-already-in-use')) { + alert( + '이미 가입된 이메일입니다. 로그인을 시도하거나 다른 이메일을 사용해 주세요.', + ); + } + }, + }); +}; +// export const useSignup = (email, password) => { +// return +// } const getUID = () => { - return auth; + return authService; }; export const useUID = () => { diff --git a/src/Navigations/Stacks.js b/src/Navigations/Stacks.js index af2660d..25a813f 100644 --- a/src/Navigations/Stacks.js +++ b/src/Navigations/Stacks.js @@ -6,7 +6,7 @@ const Stack = createNativeStackNavigator(); const Stacks = () => { return ( - + diff --git a/src/screen/Index.js b/src/screen/Index.js index f36952d..2aa2c6d 100644 --- a/src/screen/Index.js +++ b/src/screen/Index.js @@ -1,4 +1,4 @@ -import SignupPage from './SignupPage'; +import { SignupPage } from './SignupPage'; import MyPage from './MyPage'; import MainPage from './MainPage'; import LoginPage from './LoginPage'; diff --git a/src/screen/LoginPage.jsx b/src/screen/LoginPage.jsx index c5165cb..cbee71e 100644 --- a/src/screen/LoginPage.jsx +++ b/src/screen/LoginPage.jsx @@ -1,6 +1,5 @@ import { TouchableOpacity, View, Text, TextInput } from 'react-native'; import { useState, useEffect, useRef } from 'react'; -import styled from '@emotion/native'; import { authService, dbService } from '../shared/firebase'; import { signInWithEmailAndPassword } from 'firebase/auth'; @@ -56,7 +55,7 @@ const LoginPage = ({ navigation: { navigate } }) => { handleLogin()}> 로그인 - navigate('SignupPage')}> + navigate('회원가입')}> 회원가입 diff --git a/src/screen/MyPage.jsx b/src/screen/MyPage.jsx index 064a464..d374363 100644 --- a/src/screen/MyPage.jsx +++ b/src/screen/MyPage.jsx @@ -108,7 +108,7 @@ const MyPage = ({ navigation: { navigate } }) => { handleLogin()}> 임시 로그인 - console.log('약추가')}> + navigate('Stacks', { screen: '수정 페이지' })}> 약추가 {renderPillList} diff --git a/src/screen/SignupPage.jsx b/src/screen/SignupPage.jsx index 00f6d0d..7e36b00 100644 --- a/src/screen/SignupPage.jsx +++ b/src/screen/SignupPage.jsx @@ -6,7 +6,7 @@ import { TextInput, TouchableOpacity, } from 'react-native'; -import { handleSignUp } from '../Hooks/useAuth'; +import { useSignup } from '../Hooks/useAuth'; const regex = { email: new RegExp(/[a-z0-9]+@[a-z]+\.[a-z]{2,3}/), @@ -20,7 +20,7 @@ export const SignupPage = () => { const [password, setPassword] = useState(''); // 비밀번호 값 저장 const [correctEmail, setCorrectEmail] = useState(true); // 이메일 유효성 검사 const [correctPassword, setCorrectPassword] = useState(true); // 비밀번호 유효성 검사 - const [visablePassword, setVisablePassword] = useState(false); // 비밀번호 보이게 + const [visablePassword, setVisablePassword] = useState(true); // 비밀번호 보이게 const vaildEmail = (event) => { // 유효성 검사 후 false가 나오면 문구 띄우기 @@ -36,6 +36,8 @@ export const SignupPage = () => { : setCorrectPassword(false); }; + const { mutate: SignUp } = useSignup(); + const onClickSignUpButton = (email, password) => { //양식 제출 시, 빈값, 유효성 검사 틀린 값 잡아내서 리턴 후 오류 문구 띄우기 if ( @@ -52,7 +54,12 @@ export const SignupPage = () => { setCorrectPassword(false); return; } else { - handleSignUp(email, password); + //useSignup(email, password); + //handleSignUp(email, password); + SignUp({ email, password }); + // if(isError) { + + // } setEmail(''); setPassword(''); } From a9e7444578d3bc9b363f4e8a18a4d59a522de7d9 Mon Sep 17 00:00:00 2001 From: JH-anfseo <51734656+JH-anfseo@users.noreply.github.com> Date: Mon, 9 Jan 2023 16:34:40 +0900 Subject: [PATCH 3/3] =?UTF-8?q?fix:=20=EC=BD=94=EB=93=9C=20=ED=86=B5?= =?UTF-8?q?=EC=9D=BC,=20=EC=9D=BC=EB=B6=80=20=EB=B2=84=EA=B7=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Hooks/useAuth.js | 3 --- src/Navigations/Stacks.js | 2 +- src/screen/Index.js | 2 +- src/screen/LoginPage.jsx | 4 ++-- src/screen/SignupPage.jsx | 11 ++++------- 5 files changed, 8 insertions(+), 14 deletions(-) diff --git a/src/Hooks/useAuth.js b/src/Hooks/useAuth.js index 9b55442..2e4d1a6 100644 --- a/src/Hooks/useAuth.js +++ b/src/Hooks/useAuth.js @@ -19,9 +19,6 @@ export const useSignup = () => { }, }); }; -// export const useSignup = (email, password) => { -// return -// } const getUID = () => { return authService; }; diff --git a/src/Navigations/Stacks.js b/src/Navigations/Stacks.js index 25a813f..af2660d 100644 --- a/src/Navigations/Stacks.js +++ b/src/Navigations/Stacks.js @@ -6,7 +6,7 @@ const Stack = createNativeStackNavigator(); const Stacks = () => { return ( - + diff --git a/src/screen/Index.js b/src/screen/Index.js index 2aa2c6d..f36952d 100644 --- a/src/screen/Index.js +++ b/src/screen/Index.js @@ -1,4 +1,4 @@ -import { SignupPage } from './SignupPage'; +import SignupPage from './SignupPage'; import MyPage from './MyPage'; import MainPage from './MainPage'; import LoginPage from './LoginPage'; diff --git a/src/screen/LoginPage.jsx b/src/screen/LoginPage.jsx index cbee71e..38c3ac8 100644 --- a/src/screen/LoginPage.jsx +++ b/src/screen/LoginPage.jsx @@ -1,6 +1,6 @@ import { TouchableOpacity, View, Text, TextInput } from 'react-native'; -import { useState, useEffect, useRef } from 'react'; -import { authService, dbService } from '../shared/firebase'; +import { useState, useRef } from 'react'; +import { authService } from '../shared/firebase'; import { signInWithEmailAndPassword } from 'firebase/auth'; const LoginPage = ({ navigation: { navigate } }) => { diff --git a/src/screen/SignupPage.jsx b/src/screen/SignupPage.jsx index 7e36b00..7579d2a 100644 --- a/src/screen/SignupPage.jsx +++ b/src/screen/SignupPage.jsx @@ -15,12 +15,12 @@ const regex = { ), // 6자 이상, 14자 이하의 영어 대,소문자, 1개 이상의 숫자, 특수문자 조합 }; -export const SignupPage = () => { +const SignupPage = () => { const [email, setEmail] = useState(''); // 이메일 값 저장 const [password, setPassword] = useState(''); // 비밀번호 값 저장 const [correctEmail, setCorrectEmail] = useState(true); // 이메일 유효성 검사 const [correctPassword, setCorrectPassword] = useState(true); // 비밀번호 유효성 검사 - const [visablePassword, setVisablePassword] = useState(true); // 비밀번호 보이게 + const [visablePassword, setVisablePassword] = useState(false); // 비밀번호 보이게 const vaildEmail = (event) => { // 유효성 검사 후 false가 나오면 문구 띄우기 @@ -54,12 +54,7 @@ export const SignupPage = () => { setCorrectPassword(false); return; } else { - //useSignup(email, password); - //handleSignUp(email, password); SignUp({ email, password }); - // if(isError) { - - // } setEmail(''); setPassword(''); } @@ -111,3 +106,5 @@ export const SignupPage = () => { }; const styles = StyleSheet.create({}); + +export default SignupPage;