fetchUser

설명

모임 검색

경로

src/pages/MainPage/SideBar/SearchBox.tsx

개선 사항

설계 되어있는 API 특성 상, 모임 제목과 작성자 명을 동시에 가져올 수 없음. 때문에 모임 제목을 검색하고, 또 해당 모임 제목을 작성한 유저 이름을 가져와야 하는 상황. 이를 아래와 같이 개선

상태


const [searchedResults, setSearchedResults] = useState<IUser[] | IPost[]>([]);
const [refineResults, setRefineResults] = useState<IUser[]>([]);

  const fetchUser = async (id: string) => {
    try {
      const { data } = await getApi<IUser>(`/users/${id}`);
      return data;
    } catch (err) {
      console.error('Failed to fetch user:', err);
    }
  };
  
useEffect(() => {
  const fetchUsersForPosts = async () => {
    const userPromises = searchedResults
      .filter(
        (v): v is IPost => 'author' in v && typeof v.author === 'string',
      )
      .map((v) => fetchUser(v.author as string));

    const users = await Promise.all(userPromises);

    const newTest = [
      ...searchedResults.filter((v): v is IUser => 'fullName' in v),
      ...users.filter((user): user is IUser => Boolean(user)),
    ];

    setRefineResults(newTest);
  };

  void fetchUsersForPosts();
}, [searchedResults]);