Feature/#268 사이드바api (#270)

* fix: api 변경

- #268

* feat: 유저 이름, 프로필 추가

- #268

src/app/api/member.ts

@@ -0,0 +1,13 @@
+/* eslint-disable import/prefer-default-export */
+import { fetcher } from '@/app/api/fetcher';
+
+const memberFetcher = fetcher();
+
+const getSidebarInfo = (token: string, memberId: number) =>
+  memberFetcher(`/members/${memberId}`, {
+    headers: {
+      Authorization: `Bearer ${token}`,
+    },
+  });
+
+export { getSidebarInfo };

src/app/api/team.ts

@@ -50,13 +50,6 @@ const getTeamMembers = (teamId: number) => teamFetcher(`/teams/${teamId}/members
 
 const getMyTeams = (memberId: number) => teamFetcher(`/teams/members/${memberId}`);
 
-const getMyTeamsWithStudy = (token: string, memberId: number) =>
-  teamFetcher(`/teams/members/${memberId}/studies`, {
-    headers: {
-      Authorization: `Bearer ${token}`,
-    },
-  });
-
 export {
   postCreateTeam,
   putEditTeam,
@@ -66,6 +59,5 @@ export {
   postJoinTeam,
   getTeams,
   getMyTeams,
-  getMyTeamsWithStudy,
   getTeamMembers,
 };

src/components/Sidebar/SidebarContent/index.tsx

@@ -6,7 +6,7 @@ import { BiBell, BiUser } from 'react-icons/bi';
 import { BsPlus, BsGrid } from 'react-icons/bs';
 import { MdOutlineLogout } from 'react-icons/md';
 
-import { getMyTeamsWithStudy } from '@/app/api/team';
+import { getSidebarInfo } from '@/app/api/member';
 import TeamModal from '@/containers/team/TeamModal';
 import { useGetFetchWithToken } from '@/hooks/useFetchWithToken';
 import useGetUser from '@/hooks/useGetUser';
@@ -18,7 +18,7 @@ import { SidebarContentProps, SidebarTeam } from '../type';
 const SidebarContent = ({ isOpen, setIsOpen }: SidebarContentProps) => {
   const [isTeamModalOpen, setIsTeamModalOpen] = useState<boolean>(false);
   const user = useGetUser();
-  const myTeams = useGetFetchWithToken(getMyTeamsWithStudy, [user?.memberId], user);
+  const sidebarInfo = useGetFetchWithToken(getSidebarInfo, [user?.memberId], user);
 
   return (
     <>
@@ -48,10 +48,10 @@ const SidebarContent = ({ isOpen, setIsOpen }: SidebarContentProps) => {
           />
         </Flex>
         <Flex align="center" direction="column" gap="4" mb="16">
-          <Avatar size={isOpen ? 'lg' : 'md'} src="" />
+          <Avatar size={isOpen ? 'lg' : 'md'} src={sidebarInfo?.imageUrl} />
           {isOpen && (
             <Text textStyle="bold_2xl" px="10" py="1" color="white" bg="green_dark" rounded="full">
-              {user?.isLogin ? '두레' : '비회원'}
+              {user?.isLogin ? sidebarInfo?.name : '비회원'}
             </Text>
           )}
           <Flex direction={isOpen ? 'row' : 'column'} gap="4">
@@ -87,7 +87,7 @@ const SidebarContent = ({ isOpen, setIsOpen }: SidebarContentProps) => {
               bg="green_dark"
               roundedBottom="2xl"
             >
-              {myTeams?.map((team: SidebarTeam) => (
+              {sidebarInfo?.myTeamsAndStudies?.map((team: SidebarTeam) => (
                 <Category
                   key={`team-${team.teamId}`}
                   id={team.teamId}