Merge pull request #289 from TripInfoWeb/dev_header

fix: 상단 헤더 프로필 이미지 남자 이미지만 나오는 문제 수정
TripInfoWeb · Sep 11, 2024 · 672b5d7 · 672b5d7
2 parents b1887ff + 058f71a
commit 672b5d7
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx
@@ -2,6 +2,7 @@ import HeaderSidebarContainer from "@/containers/common/HeaderSidebarContainer";
 import Image from "next/image";
 import Link from "next/link";
 import { MdOutlineMenu } from "react-icons/md";
+import UserImage from "../auth/UserImage";
 import ReactToastifyComponent from "./ReactToastifyComponent";
 
 interface Props {
@@ -12,6 +13,8 @@ interface Props {
   onClose: () => void;
   logoutHandler: () => void;
   userId: number;
+  userSex: string;
+  userProfile: string;
 }
 
 const Header = ({
@@ -22,6 +25,8 @@ const Header = ({
   onClose,
   userId,
   logoutHandler,
+  userSex,
+  userProfile,
 }: Props) => {
   return (
     <header className="flex w-full flex-row justify-center">
@@ -147,12 +152,10 @@ const Header = ({
                   href={"/mypage?mainCategory=정보&category=owner"}
                   className={"relative rounded-[50%]"}
                 >
-                  <Image
-                    className="rounded-full border-[0.03125rem] border-[#B8EDD9] bg-[#F2FAF7]"
-                    src="/user_sex_man_default_image.svg"
-                    alt="user_sex_man_default_image"
-                    width={30}
-                    height={30}
+                  <UserImage
+                    userImageAddress={`${userProfile}`}
+                    userSex={`${userSex}`}
+                    size={30}
                   />
                 </Link>
 

diff --git a/src/containers/common/HeaderContainer.tsx b/src/containers/common/HeaderContainer.tsx
@@ -87,6 +87,8 @@ const HeaderContainer = () => {
       onMenuClicked={onMenuClicked}
       onClose={onClose}
       userId={authStore.id}
+      userSex={authStore.sex}
+      userProfile={authStore.userImage.address}
       logoutHandler={logoutHandler}
     />
   );