헤더 구현

[handje]

Pull request

Related issue

Resolve #59 @handje

Motivation and context

• 고정 헤더 구현
• 로고 아바타와 사용자아바타 popover 포함

Solution

Header

• Avatar(로고용)
• Popover

ProfileContainer

• PopoverContainer 내부 콘텐츠
• 유저프로필의 기본 레이아웃 담당

ProfilePicture

• 유저프로필 담당
• 변경 로직도 담당할 예정

Nickname

• 유저닉네임 담당
• 변경 로직도 담당할 예정

추가 전달 내용

• 백엔드측에서 닉네임과 프로필 변경 로직을 분리해달라고 하셔서 컴포넌트를 분리하였습니다. 각각의 컴포넌트에 임시 변수를 state로 변경하여 사용할 예정입니다.
• shadcn 컴포넌트가 client 컴포넌트이기때문에 header태그를 서버컴포넌트인 layout에 분리하고, 내부의 코드만 Header에 남길 예정입니다. 해당 작업은 주식 상세 페이지 레이아웃 구성하기 #79 merge후 메인화면 레이아웃 이슈 메인화면(주식테이블) 레이아웃 구현 #61 에서 진행하겠습니다.
• 컴포넌트 분리에 대해 더 좋은 의견있으시다면 리뷰 남겨주세요! :)

How has this been tested

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist

• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have read the docs/CONTRIBUTING.md document.
• I have added tests to cover my changes.
• All new and existing tests passed.

[KimKyuHoi]

👍 👍