From 5b7eb8eb7aeb96138f2d69b9cb15f6e05a06bada Mon Sep 17 00:00:00 2001 From: Sonjieun Date: Mon, 10 Feb 2025 21:29:26 +0900 Subject: [PATCH 1/4] =?UTF-8?q?#173=20fix(fe):=ED=97=A4=EB=8D=94=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EC=9C=84=EC=B9=98=20=EC=88=98=EC=A0=95=20?= =?UTF-8?q?=EB=B0=8F=20=EB=8F=99=EC=A0=81=EB=A0=8C=EB=8D=94=EB=A7=81=20?= =?UTF-8?q?=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/apps/web/app/(main)/layout.tsx | 6 ++-- .../user/ui/profile-nickname.tsx} | 4 +-- .../user/ui}/profile-picture.tsx | 0 .../user/ui/profile-popover-content.tsx} | 8 ++--- .../src/features/user/ui/profile-popover.tsx | 35 +++++++++++++++++++ .../src/shared/components/header/header.tsx | 34 ++---------------- 6 files changed, 48 insertions(+), 39 deletions(-) rename src/frontend/apps/web/src/{shared/components/header/nickname.tsx => features/user/ui/profile-nickname.tsx} (90%) rename src/frontend/apps/web/src/{shared/components/header => features/user/ui}/profile-picture.tsx (100%) rename src/frontend/apps/web/src/{shared/components/header/profile-container.tsx => features/user/ui/profile-popover-content.tsx} (75%) create mode 100644 src/frontend/apps/web/src/features/user/ui/profile-popover.tsx diff --git a/src/frontend/apps/web/app/(main)/layout.tsx b/src/frontend/apps/web/app/(main)/layout.tsx index 3e7fc59f..401979d8 100644 --- a/src/frontend/apps/web/app/(main)/layout.tsx +++ b/src/frontend/apps/web/app/(main)/layout.tsx @@ -13,9 +13,11 @@ export default function RootLayout({ >
-
+
login

} />
-
{children}
+
+ {children} +
); diff --git a/src/frontend/apps/web/src/shared/components/header/nickname.tsx b/src/frontend/apps/web/src/features/user/ui/profile-nickname.tsx similarity index 90% rename from src/frontend/apps/web/src/shared/components/header/nickname.tsx rename to src/frontend/apps/web/src/features/user/ui/profile-nickname.tsx index b9b8487e..0dfae0c7 100644 --- a/src/frontend/apps/web/src/shared/components/header/nickname.tsx +++ b/src/frontend/apps/web/src/features/user/ui/profile-nickname.tsx @@ -3,7 +3,7 @@ import { Button, Input, Label } from '@workspace/ui/components'; import { Pencil } from 'lucide-react'; -const Nickname = () => { +const ProfileNickname = () => { //임시변수 const isNameEditMode = false; const name = '공작새'; @@ -26,4 +26,4 @@ const Nickname = () => { ); }; -export default Nickname; +export default ProfileNickname; diff --git a/src/frontend/apps/web/src/shared/components/header/profile-picture.tsx b/src/frontend/apps/web/src/features/user/ui/profile-picture.tsx similarity index 100% rename from src/frontend/apps/web/src/shared/components/header/profile-picture.tsx rename to src/frontend/apps/web/src/features/user/ui/profile-picture.tsx diff --git a/src/frontend/apps/web/src/shared/components/header/profile-container.tsx b/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx similarity index 75% rename from src/frontend/apps/web/src/shared/components/header/profile-container.tsx rename to src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx index d86482ce..000469f8 100644 --- a/src/frontend/apps/web/src/shared/components/header/profile-container.tsx +++ b/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx @@ -1,14 +1,14 @@ import { Button } from '@workspace/ui/components'; import ProfilePicture from './profile-picture'; -import Nickname from './nickname'; +import ProfileNickname from './profile-nickname'; -const ProfileContainer = () => { +const ProfilePopoverContent = () => { return (

My Account

- +
); }; -export default ProfileContainer; +export default ProfilePopoverContent; diff --git a/src/frontend/apps/web/src/features/user/ui/profile-popover.tsx b/src/frontend/apps/web/src/features/user/ui/profile-popover.tsx new file mode 100644 index 00000000..fc54377b --- /dev/null +++ b/src/frontend/apps/web/src/features/user/ui/profile-popover.tsx @@ -0,0 +1,35 @@ +import { + Avatar, + AvatarFallback, + AvatarImage, + Popover, + PopoverContent, + PopoverTrigger, +} from '@workspace/ui/components'; +import { CircleUserRound } from 'lucide-react'; +import ProfilePopoverContent from './profile-popover-content'; + +const ProfilePopover = () => { + return ( + + + + + + + + + + + + + + ); +}; +export default ProfilePopover; diff --git a/src/frontend/apps/web/src/shared/components/header/header.tsx b/src/frontend/apps/web/src/shared/components/header/header.tsx index 244cbb49..c2d2ab98 100644 --- a/src/frontend/apps/web/src/shared/components/header/header.tsx +++ b/src/frontend/apps/web/src/shared/components/header/header.tsx @@ -1,19 +1,10 @@ 'use client'; -import { - Avatar, - AvatarFallback, - AvatarImage, - Popover, - PopoverContent, - PopoverTrigger, -} from '@workspace/ui/components'; -import ProfileContainer from './profile-container'; -import { CircleUserRound } from 'lucide-react'; +import { Avatar, AvatarFallback, AvatarImage } from '@workspace/ui/components'; import Link from 'next/link'; //로고 이미지 경로 변경 필요 -const Header = () => { +const Header = ({ authContent }: { authContent: React.ReactNode }) => { return ( <> @@ -24,26 +15,7 @@ const Header = () => { - - - - - - - - - - - - - - + {authContent} ); }; From 912790146979f65d7ac912cd5513c3a89066c953 Mon Sep 17 00:00:00 2001 From: Sonjieun Date: Mon, 10 Feb 2025 21:50:40 +0900 Subject: [PATCH 2/4] =?UTF-8?q?#173=20feat(fe):=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8,=EB=A1=9C=EA=B7=B8=EC=95=84=EC=9B=83=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=EB=A0=88=EC=9D=B4=EC=95=84=EC=9B=83=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/apps/web/app/(main)/layout.tsx | 5 ++++- src/frontend/apps/web/src/features/auth/index.ts | 1 + .../apps/web/src/features/auth/ui/index.ts | 2 ++ .../apps/web/src/features/auth/ui/login-button.tsx | 13 +++++++++++++ .../web/src/features/auth/ui/logout-button.tsx | 14 ++++++++++++++ .../features/user/ui/profile-popover-content.tsx | 10 ++-------- 6 files changed, 36 insertions(+), 9 deletions(-) create mode 100644 src/frontend/apps/web/src/features/auth/index.ts create mode 100644 src/frontend/apps/web/src/features/auth/ui/index.ts create mode 100644 src/frontend/apps/web/src/features/auth/ui/login-button.tsx create mode 100644 src/frontend/apps/web/src/features/auth/ui/logout-button.tsx diff --git a/src/frontend/apps/web/app/(main)/layout.tsx b/src/frontend/apps/web/app/(main)/layout.tsx index 401979d8..9a06bfdc 100644 --- a/src/frontend/apps/web/app/(main)/layout.tsx +++ b/src/frontend/apps/web/app/(main)/layout.tsx @@ -1,3 +1,5 @@ +import { LoginButton } from '@/src/features/auth'; +import ProfilePopover from '@/src/features/user/ui/profile-popover'; import { Header } from '@/src/shared'; import '@workspace/ui/globals.css'; @@ -6,6 +8,7 @@ export default function RootLayout({ }: Readonly<{ children: React.ReactNode; }>) { + const user = null; return (
-
login

} /> +
: } />
{children} diff --git a/src/frontend/apps/web/src/features/auth/index.ts b/src/frontend/apps/web/src/features/auth/index.ts new file mode 100644 index 00000000..76d11bda --- /dev/null +++ b/src/frontend/apps/web/src/features/auth/index.ts @@ -0,0 +1 @@ +export { LoginButton, LogoutButton } from './ui'; diff --git a/src/frontend/apps/web/src/features/auth/ui/index.ts b/src/frontend/apps/web/src/features/auth/ui/index.ts new file mode 100644 index 00000000..d494e92a --- /dev/null +++ b/src/frontend/apps/web/src/features/auth/ui/index.ts @@ -0,0 +1,2 @@ +export { default as LoginButton } from './login-button'; +export { default as LogoutButton } from './logout-button'; diff --git a/src/frontend/apps/web/src/features/auth/ui/login-button.tsx b/src/frontend/apps/web/src/features/auth/ui/login-button.tsx new file mode 100644 index 00000000..3c831b7b --- /dev/null +++ b/src/frontend/apps/web/src/features/auth/ui/login-button.tsx @@ -0,0 +1,13 @@ +import { Button } from '@workspace/ui/components'; + +const LoginButton = () => { + return ( + + ); +}; +export default LoginButton; diff --git a/src/frontend/apps/web/src/features/auth/ui/logout-button.tsx b/src/frontend/apps/web/src/features/auth/ui/logout-button.tsx new file mode 100644 index 00000000..c9cf3329 --- /dev/null +++ b/src/frontend/apps/web/src/features/auth/ui/logout-button.tsx @@ -0,0 +1,14 @@ +import { Button } from '@workspace/ui/components'; + +const LogoutButton = () => { + return ( + + ); +}; +export default LogoutButton; diff --git a/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx b/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx index 000469f8..d51aaaed 100644 --- a/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx +++ b/src/frontend/apps/web/src/features/user/ui/profile-popover-content.tsx @@ -1,6 +1,6 @@ -import { Button } from '@workspace/ui/components'; import ProfilePicture from './profile-picture'; import ProfileNickname from './profile-nickname'; +import { LogoutButton } from '../../auth'; const ProfilePopoverContent = () => { return ( @@ -10,13 +10,7 @@ const ProfilePopoverContent = () => {
- + ); }; From 48b484f9e8375560ff2089c96a74ea82c0659b97 Mon Sep 17 00:00:00 2001 From: Sonjieun Date: Mon, 10 Feb 2025 22:22:13 +0900 Subject: [PATCH 3/4] =?UTF-8?q?#173=20feat(fe):=20auth=20wrapper=20?= =?UTF-8?q?=EB=A3=A8=ED=8A=B8=20=EB=A0=88=EC=9D=B4=EC=95=84=EC=9B=83=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/apps/web/app/(main)/layout.tsx | 3 ++- .../web/src/features/auth/ui/auth-wrapper.tsx | 20 +++++++++++++++++++ 2 files changed, 22 insertions(+), 1 deletion(-) create mode 100644 src/frontend/apps/web/src/features/auth/ui/auth-wrapper.tsx diff --git a/src/frontend/apps/web/app/(main)/layout.tsx b/src/frontend/apps/web/app/(main)/layout.tsx index 9a06bfdc..17cda3be 100644 --- a/src/frontend/apps/web/app/(main)/layout.tsx +++ b/src/frontend/apps/web/app/(main)/layout.tsx @@ -1,4 +1,5 @@ import { LoginButton } from '@/src/features/auth'; +import AuthWrapper from '@/src/features/auth/ui/auth-wrapper'; import ProfilePopover from '@/src/features/user/ui/profile-popover'; import { Header } from '@/src/shared'; import '@workspace/ui/globals.css'; @@ -19,7 +20,7 @@ export default function RootLayout({
: } />
- {children} + {children}
diff --git a/src/frontend/apps/web/src/features/auth/ui/auth-wrapper.tsx b/src/frontend/apps/web/src/features/auth/ui/auth-wrapper.tsx new file mode 100644 index 00000000..27ba598a --- /dev/null +++ b/src/frontend/apps/web/src/features/auth/ui/auth-wrapper.tsx @@ -0,0 +1,20 @@ +'use client'; + +import { usePathname, useRouter } from 'next/navigation'; +import { useEffect } from 'react'; + +//로그인이 안 되었을 경우 리디렉트용 wrapper +const AuthWrapper = ({ children }: { children: React.ReactNode }) => { + const pathname = usePathname(); + const router = useRouter(); + const user = {}; + + useEffect(() => { + if (!user && pathname !== '/') { + router.push('/'); + } + }, [user, pathname]); + + return <>{children}; +}; +export default AuthWrapper; From 1d43bacfcd621c6e22bf6008ac3405f4be1a17e3 Mon Sep 17 00:00:00 2001 From: Sonjieun Date: Mon, 10 Feb 2025 22:29:50 +0900 Subject: [PATCH 4/4] =?UTF-8?q?#173=20refactor(fe):=20popover=20import?= =?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/frontend/apps/web/app/(main)/layout.tsx | 2 +- src/frontend/apps/web/src/features/user/index.ts | 1 + src/frontend/apps/web/src/features/user/ui/index.ts | 1 + 3 files changed, 3 insertions(+), 1 deletion(-) create mode 100644 src/frontend/apps/web/src/features/user/index.ts create mode 100644 src/frontend/apps/web/src/features/user/ui/index.ts diff --git a/src/frontend/apps/web/app/(main)/layout.tsx b/src/frontend/apps/web/app/(main)/layout.tsx index 17cda3be..a4ac6147 100644 --- a/src/frontend/apps/web/app/(main)/layout.tsx +++ b/src/frontend/apps/web/app/(main)/layout.tsx @@ -1,6 +1,6 @@ import { LoginButton } from '@/src/features/auth'; import AuthWrapper from '@/src/features/auth/ui/auth-wrapper'; -import ProfilePopover from '@/src/features/user/ui/profile-popover'; +import { ProfilePopover } from '@/src/features/user'; import { Header } from '@/src/shared'; import '@workspace/ui/globals.css'; diff --git a/src/frontend/apps/web/src/features/user/index.ts b/src/frontend/apps/web/src/features/user/index.ts new file mode 100644 index 00000000..a467180e --- /dev/null +++ b/src/frontend/apps/web/src/features/user/index.ts @@ -0,0 +1 @@ +export { ProfilePopover } from './ui'; diff --git a/src/frontend/apps/web/src/features/user/ui/index.ts b/src/frontend/apps/web/src/features/user/ui/index.ts new file mode 100644 index 00000000..71e3f08b --- /dev/null +++ b/src/frontend/apps/web/src/features/user/ui/index.ts @@ -0,0 +1 @@ +export { default as ProfilePopover } from './profile-popover';