From 877bbc582eec197980b78e0e77c77a4d06034a27 Mon Sep 17 00:00:00 2001 From: Hyang-Dan Date: Sun, 30 Nov 2025 18:20:47 +0900 Subject: [PATCH] =?UTF-8?q?issue=20#33=20-=20=EB=A1=9C=EA=B7=B8=EC=9D=B8?= =?UTF-8?q?=20=EB=B2=84=ED=8A=BC=20=EB=B9=84=ED=99=9C=EC=84=B1=ED=99=94=20?= =?UTF-8?q?=EC=98=A4=EB=A5=98=20=ED=95=B4=EA=B2=B0=20-=20=EB=A1=9C?= =?UTF-8?q?=EA=B7=B8=EC=9D=B8=20=EC=9A=94=EC=B9=AD=20=EB=B0=8F=20=EC=9D=91?= =?UTF-8?q?=EB=8B=B5=EC=97=90=20=EB=94=B0=EB=A5=B8=20=ED=86=A0=EC=8A=A4?= =?UTF-8?q?=ED=8A=B8=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + src/App.tsx | 3 -- src/data/response/account/LoginResponse.ts | 2 + src/hooks/{useModal.tsx => use-modal.tsx} | 0 src/hooks/use-toast.ts | 1 + src/layouts/Layout.tsx | 43 +++++++++++++------ src/main.tsx | 4 +- .env => src/ui/component/Toast.tsx | 0 src/ui/page/login/LoginPage.tsx | 48 ++++++++++++++-------- src/util/Validator.ts | 8 ++-- 10 files changed, 72 insertions(+), 38 deletions(-) rename src/hooks/{useModal.tsx => use-modal.tsx} (100%) create mode 100644 src/hooks/use-toast.ts rename .env => src/ui/component/Toast.tsx (100%) diff --git a/package.json b/package.json index 5ed11bf..6785f6c 100644 --- a/package.json +++ b/package.json @@ -4,6 +4,7 @@ "version": "0.0.0", "type": "module", "scripts": { + "local": "vite --mode local", "dev": "vite", "build": "vite build", "lint": "eslint .", diff --git a/src/App.tsx b/src/App.tsx index 42ebdfa..f87273a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,6 +1,3 @@ -import { useState } from 'react'; -import reactLogo from './assets/react.svg'; -import viteLogo from '/vite.svg'; import './App.css'; import SignUpPage from './ui/page/signup/SignUpPage'; import Layout from './layouts/Layout'; diff --git a/src/data/response/account/LoginResponse.ts b/src/data/response/account/LoginResponse.ts index 12f4bd8..2eacb89 100644 --- a/src/data/response/account/LoginResponse.ts +++ b/src/data/response/account/LoginResponse.ts @@ -2,4 +2,6 @@ import { BaseResponse } from "../BaseResponse"; export class LoginResponse extends BaseResponse { success!: boolean; + accessToken?: string; + refreshToken?: string; } \ No newline at end of file diff --git a/src/hooks/useModal.tsx b/src/hooks/use-modal.tsx similarity index 100% rename from src/hooks/useModal.tsx rename to src/hooks/use-modal.tsx diff --git a/src/hooks/use-toast.ts b/src/hooks/use-toast.ts new file mode 100644 index 0000000..4fec14d --- /dev/null +++ b/src/hooks/use-toast.ts @@ -0,0 +1 @@ +import { toast } from 'sonner'; \ No newline at end of file diff --git a/src/layouts/Layout.tsx b/src/layouts/Layout.tsx index 7a92732..a19551d 100644 --- a/src/layouts/Layout.tsx +++ b/src/layouts/Layout.tsx @@ -3,21 +3,40 @@ import { Outlet } from "react-router-dom"; import { SidebarProvider } from "@/components/ui/sidebar"; import Header from "@/ui/component/Header"; import { useAuthStore } from '@/store/authStore'; +import { Toaster, type ToasterProps } from "sonner"; +import { + CircleCheckIcon, + InfoIcon, + Loader2Icon, + OctagonXIcon, + TriangleAlertIcon, +} from "lucide-react"; export default function Layout() { const { authData } = useAuthStore(); - return ( - - -
- { authData?.isLogedIn ?
: null} - {/*
*/} - -
- + <> + , + error: , + info: , + warning: , + loading: + }} + /> + + +
+ { authData?.isLogedIn ?
: null} + {/*
*/} + +
+ + ); } \ No newline at end of file diff --git a/src/main.tsx b/src/main.tsx index bef5202..287939a 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -4,7 +4,7 @@ import './index.css' import App from './App.tsx' createRoot(document.getElementById('root')!).render( - + // - , + // , ) diff --git a/.env b/src/ui/component/Toast.tsx similarity index 100% rename from .env rename to src/ui/component/Toast.tsx diff --git a/src/ui/page/login/LoginPage.tsx b/src/ui/page/login/LoginPage.tsx index 6b72a05..20511db 100644 --- a/src/ui/page/login/LoginPage.tsx +++ b/src/ui/page/login/LoginPage.tsx @@ -14,6 +14,7 @@ import { Validator } from '@/util/Validator'; import { LoginRequest } from '@/data/request/account/LoginRequest'; import { AccountNetwork } from '@/network/AccountNetwork'; import { toast } from 'sonner'; +import { LoginResponse } from '@/data/response'; export default function LoginPage() { const [isLoading, setIsLoading] = useState(false); @@ -26,6 +27,7 @@ export default function LoginPage() { password: "" } }); + const { id, password } = { id: loginForm.watch('id'), password: loginForm.watch('password') }; const moveToSignUpPage = useCallback(() => { navigate(PageRouting["SIGN_UP"].path); @@ -42,28 +44,38 @@ export default function LoginPage() { // TODO 33 로그인 기능 구현 const login = async () => { if (isLoading) return; - - const { id, password } = loginForm.getValues(); const type = Validator.isEmail(id) ? 'email' : 'accountId'; const data: LoginRequest = new LoginRequest(type, id, password); const loginPromise = accountNetwork.login(data); - toast.promise( - loginPromise, + toast.promise<{ message?: string }>( + () => new Promise(async (resolve, reject) => { + try { + loginPromise.then((res) => { + if (res.data.success) { + resolve({message: ''}) + } else { + reject(res.data.message) + } + }) + } catch (err) { + reject ("서버 에러 발생"); + } + }), { loading: "로그인 중입니다.", - success: (res) => res.data.success ? "로그인이 완료되었습니다." : res.data.message, - error: "로그인에 실패하였습니다." + success: "로그인이 완료되었습니다.", + error: (err) => `${err}` } ); - loginPromise.then((res) => { - if (res.data.success) { - moveToMainPage(); - } - }); + // loginPromise.then((res) => { + // if (res.data.success) { + // moveToMainPage(); + // } + // }); } const TextSeparator = ({ text }: { text: string }) => { @@ -89,7 +101,7 @@ export default function LoginPage() { control={loginForm.control} render={({ field, fieldState }) => ( - 이메일 + 아이디 또는 이메일 비밀번호를 잊으셨습니까? @@ -133,17 +146,16 @@ export default function LoginPage() { >