depromeet / ahmatda-web

아맞다 :white_check_mark: 이젠 까먹지 말고 챙기자
https://github.com/depromeet/ahmatda-web#download
7 stars 0 forks source link

API Response result 인터페이스 핸들링 #232

Open hyesungoh opened 1 year ago

hyesungoh commented 1 year ago

1안 api 함수에서 result 벗기기

const getRecommendItem = async (categoryId: Category['id']) => {
  const { result } = await get<Response>(`/recommend/items?category=${categoryId}`);

  return result;
}

const useGetRecommendItem = () => {
  const currentCategory = useRecoilValue(currentCategoryState);

  const query = useQuery({
    queryKey: [HOME_RECOMMEND_ITEM_QUERY_KEY, currentCategory?.id],
    queryFn: () => getRecommendItem((currentCategory as Category).id),
    enabled: Boolean(currentCategory),
  });

  return query;
};

2안 select 에서 result 벗기기

const getRecommendItem = (categoryId: Category['id']) => get<Response>(`/recommend/items?category=${categoryId}`);

const useGetRecommendItem = () => {
  const currentCategory = useRecoilValue(currentCategoryState);

  const query = useQuery({
    queryKey: [HOME_RECOMMEND_ITEM_QUERY_KEY, currentCategory?.id],
    queryFn: () => getRecommendItem((currentCategory as Category).id),
    enabled: Boolean(currentCategory),
    select: ({ result }) => result,
  });

  return query;
};

3안 select 공통으로 처리하기

아니면 queryClient로 select 공통으로 처리해도? _app.tsx

const [queryClient] = useState(
    () =>
      new QueryClient({
        defaultOptions: {
          queries: {
            retry: false,
            refetchOnWindowFocus: false,
            select: (data) => data?.result ?? data,
          },
        },
      }),
  );

4안

axios interceptor에서 result 풀어서 주는방법?

_Originally posted by @kooku0 in https://github.com/depromeet/ahmatda-web/pull/224#discussion_r1059285941_

hansol-FE commented 1 year ago

3안 간지