Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Feat] 워크스페이스 삭제 api 연결 및 모달 구현 #378

Merged
merged 14 commits into from
Jan 13, 2025

Conversation

namdaeun
Copy link
Member

@namdaeun namdaeun commented Jan 8, 2025

해당 이슈 번호

closed #376


체크리스트

  • 🔀 PR 제목의 형식을 잘 작성했나요? e.g. [feat] PR을 등록한다.
  • 💯 테스트는 잘 통과했나요?
  • 🏗️ 빌드는 성공했나요?
  • 🧹 불필요한 코드는 제거했나요?
  • ✅ 컨벤션을 지켰나요?
  • 💭 이슈는 등록했나요?
  • 🏷️ 라벨은 등록했나요?
  • 💻 git rebase를 사용했나요?
  • 🙇‍♂️ 리뷰어를 지정했나요?

📌 내가 알게 된 부분

요건 그냥 다들 기억했으면 해서 ..!

openAPI Typescript의 QueryKey는 tanstack query tools에서도 볼 수 있지만 아래 코드와 같이 method와 path를 같이 적어줘야 합니다 ! 순서도 동일하게 !!

            queryClient.invalidateQueries({
              queryKey: ['get', '/api/v1/members/teams'],
            });

💎 PR Point

워크스페이스 삭제하면서 대시보드로 이동해야하는데, 로컬스토리지의 팀 아이디가 삭제되면서 라우팅 됐을 때 로컬스토리지의 팀 아이디가 제대로 세팅되지 않아서 에러페이지가 뜨는 이슈가 있었습니다.

  • 그래서 로컬 스토리지의 팀 아이디를 삭제하고, data에 있는 처음 값으로 설정하기 위해 navigate를 하면서 reload를 해줌으로써 useInitialTeamId가 다시 호출되도록 해줬습니다.

그리고 자꾸 invalidQueries가 동작하지 않아서 뭐지 했는데 제가 queryClient를 shared로 따로 뺴놓은 걸 사용하고 있어서 발생한 문제였어요..
저랑 같은 이슈를 겪을 사람이 있을까봐 해당 파일 지웠습니다. (쓰이는 곳도 없더라고요 !)

지금은 delete mutation이 성공했을 때 invalidQueries를 통해 SNB의 소속된 팀 정보를 불러오는 쿼리를 refetch해주고 있슴다


📌스크린샷 (선택)

2025-01-08.11.38.22.mov

Copy link

github-actions bot commented Jan 8, 2025

🚀 Storybook 확인하기 🚀

@namdaeun namdaeun changed the title [Feat] 삭제 modal 구현 [Feat] 워크스페이스 삭제 api 연결 및 모달 구현 Jan 8, 2025
Copy link
Contributor

@rtttr1 rtttr1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM~~!! 모달을 이렇게 뚝딱뚝딱 하다니 신기하네용


import { useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';

import { useQueryClient } from '@tanstack/react-query';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

저도 이걸로 합숙때 이틀을 날려먹었던 기억이 나네요.. 하하

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

헉 그랬구나 ...

},
});
};

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

제가 따로 브렌치 파서 하고 있었는데 가로채가기!!

Copy link
Contributor

@Bowoon1216 Bowoon1216 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

수고하셨습니다!! 일당백 당님 👍

Comment on lines +85 to +88
onSuccess: () => {
queryClient.invalidateQueries({
queryKey: ['get', '/api/v1/members/teams'],
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

요렇게 리패치해줄수도 있군용 하나 알아갑니다!

Copy link

🚀 Storybook 확인하기 🚀

@namdaeun namdaeun merged commit 96f7317 into develop Jan 13, 2025
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

워크스페이스 삭제 모달 구현
3 participants