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.

Sign up for GitHub

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

개설자 본인은 공동 모임장 검색이 되지 않도록 구현 #949

Merged
merged 3 commits into from
Nov 13, 2024
Merged

개설자 본인은 공동 모임장 검색이 되지 않도록 구현 #949

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7339b45
feat: 본인은 공동 모임장 검색이 되지 않도록 구현
ocahs9 Nov 11, 2024
a5afc76
fix: 빌드 에러 해결
ocahs9 Nov 12, 2024
c4af492
feat: 멘션 유저 타입 정의(any 삭제)
ocahs9 Nov 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/api/API_LEGACY/meeting/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -258,7 +258,6 @@ export const createMeeting = async (formData: FormType) => {

export const updateMeeting = async (meetingId: string, formData: FormType) => {
const response = await api.put(`/meeting/v2/${meetingId}`, serializeFormData(formData));

return response;
};

Expand Down
8 changes: 6 additions & 2 deletions src/components/form/Presentation/CoLeader/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { IconXCircle } from '@sopt-makers/icons';
import { useQueryGetMentionUsers } from '@api/user/hooks';
import { fontsObject } from '@sopt-makers/fonts';
import { IconXClose } from '@sopt-makers/icons';
import { useQueryMyProfile } from '@api/API_LEGACY/user/hooks';

interface CoLeaderFieldProps {
value: mentionableDataType[];
Expand All @@ -28,7 +29,10 @@ interface mentionableDataType {
}

const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps) => {
const { data: user } = useQueryMyProfile();
const { data: mentionUserList } = useQueryGetMentionUsers();
//API 연결에서 타입을 지정해두지 않았기 때문에 any 이용
const filteredMeList = mentionUserList?.filter((mentionUser: any) => mentionUser.userId !== user?.id);
Copy link
Contributor

Choose a reason for hiding this comment

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

any 가 있네요! any는 코드를 작성하는 때에는 문제가 없을지 몰라도.. 코드 수정 시에는 큰 문제가 될 수 있어요. 예를 들어, 만약 mentionUserList 에서 userId가 아닌 다른 값을 사용한다고 바뀌었다고 했을 때 타입에러가 발생하지 않으므로, 여기에서 userId 가 쓰인다는 사실을 모르게 되고, 이는 렌더링 시점에서 발생하는 에러이기 때문에, 사이트 전체가 터지게 되어요. (에러 바운더리를 쓰고 있다면, 가장 가까운 에러 바운더리에서 잡히게 되겠지만, 크루는 에러 바운더리조차 쓰고 있지 않기 때문에, 한 군데에서 문제가 터지면 사이트 전체가 터지게 됩니다..)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

image

any 정말 쓰고 싶진 않았는데 ㅠㅠ 지금 사용하고 있는 api에서 딱히 타입을 정의 안해줘서 any를 사용하긴 했어요!
api에서 타입을 정의해두지 않았던데, 이런 경우에는어떻게 해결하는게 좋을거라고 생각하시나요?

Copy link
Contributor

Choose a reason for hiding this comment

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

mentionUser 에 대한 인터페이스를 api 응답값 참고해서 직접 만들어주면 어떨까요~!
참고로 저기에서 타입 지정하지 않은 이유는, 스웨거로 만든 타입에는 id, display 가 없는데 멘션 유저 타입에는 id, display 가 추가로 있어서 그런 거였어요. (이 두 개는 멘션 라이브러리에서 필요한 필드들)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

감사합니다 반영해두겠습니다 ~!


const handleUserSelect = (user: mentionableDataType) => {
if (coLeaders.length < 3 && !coLeaders.some(leader => leader.id === user.id)) {
Expand Down Expand Up @@ -87,7 +91,7 @@ const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps
<CommentInput onClick={e => e.stopPropagation()}>
<InputBox isActive={comment !== ''}>
<SearchMention
mentionUserList={mentionUserList}
mentionUserList={filteredMeList}
inputRef={inputRef}
value={comment}
setValue={setComment}
Expand All @@ -112,7 +116,7 @@ const CoLeader = ({ value: coLeaders = [], onChange, error }: CoLeaderFieldProps
<CommentInput onClick={e => e.stopPropagation()}>
<InputBox isActive={comment !== ''}>
<SearchMention
mentionUserList={mentionUserList}
mentionUserList={filteredMeList}
inputRef={inputRef}
value={comment}
setValue={setComment}
Expand Down
Loading