[Refactor] 링크 아이템 컴포넌트 개선

[dev-hamster]

📌 Feature Issues

현재 링크 컴포넌트의 문제점

• 강결합된 컴포넌트
  베이스가 되는 LinkItem 에 새로운 기능(버튼)이 추가되는 만큼 props 가 추가 되는 구조입니다. 그래서 props를 많이 내려주는 것이 아닌 합성 컴포넌트로 개선한다면 말랑말랑한 컴포넌트를 만들 수 있을 것 같습니다.

// LinkItemWithProfile
  return (
    <LinkItem
      Header={
        <Profile>
          // ...
        </Profile>
      }
      {...props}
    />

// LinkItem
// 중앙, 하단에 추가해야할 컴포넌트가 생기면 그 수만큼 props가 추가되어야 함
const LinkItem = ({ Header, queryKey, ...props }: LinkItemProps) => {
  return(
    <Wrapper>
      <article>
        {Header}
        <LinkItemInfoWrapper onClick={handleLinkClick}>
         // ...
        </LinkItemInfoWrapper>

        <UtilsWrapper>
          // ...
        </UtilsWrapper>
      </article>
    </Wrapper>
);
}

✨ To-do

• [ ]