reduxjs/redux-toolkit

No response and no errors for one endpoint

bob-devereux opened this issue · 6 comments

The endpoint is defined with this code:

import { API_URL } from '@shared/constants/api-url';
import { baseApi } from '@shared/redux/base-api';
import { GetMyTasksDaoModel, GetMyTasksRequestDto } from '@shared/types/api.types';
import { HttpMethods } from '@shared/types/http.types';

export const tasksApi = baseApi.injectEndpoints({
  endpoints: (builder) => ({
    getMyTasks: builder.query<GetMyTasksDaoModel, GetMyTasksRequestDto>({
      query: (body: GetMyTasksRequestDto) => ({
        url: API_URL.task,
        method: HttpMethods.post,
        body,
        params: body,
      }),
      providesTags: ['TASK'],
    }),
  }),
});

export const { useGetMyTasksQuery } = tasksApi;

I'm calling invoking it with this code:

  const { data, error, isLoading, isFetching, isSuccess, isUninitialized } = useGetMyTasksQuery(requestDto);

  console.log('isUninitialized', isUninitialized);
  console.log('isLoading: ', isLoading);
  console.log('isFetching: ', isFetching);
  console.log('isSuccess: ', isSuccess);
  console.log('data: ', data);
  console.log('error: ', error);
  console.log();

and get the following:

 LOG  isUninitialized false
 LOG  isLoading:  true
 LOG  isFetching:  true
 LOG  isSuccess:  false
 LOG  data:  undefined
 LOG  error:  undefined

I added a fetchFN to the base query:

export const baseQuery = retry(
  fetchBaseQuery({
    timeout: 500,
    baseUrl: process.env.EXPO_PUBLIC_API_URL || '',
    prepareHeaders: ...
    fetchFn(input, init) {
      console.log('fetchFn input:', JSON.stringify(input));
      console.log('fetchFn init:', JSON.stringify(init));
      return fetch(input, init);
    },
  }),
  {
    retryCondition: (...
    },
  },
);

and fetchFn doesn't print anything out for the call to useGetMyTasksQuery, but prints out for other calls.

Looking for help on why fetchFn is never getting invoked for useGetMyTasksQuery and there are no errors raised either.

Hmm. Just to check, does it work if you don't wrap it in retry()?

Removing retry didn't fix it. When I dynamically set the parameters for requestDto it started executing. Maybe things were working as expected, and the problem is that I don't understand the caching/persistence logic.

What do you mean by "dynamically set the parameters"?

I had the key parameter to fetch data hard-coded. My guess is that the query had fired at some point, and cached or persisted an empty result at since the input hadn't changed, it wasn't firing again. But I'm not confident. I was changing too much code to be sure it was not some other issue I fixed.

Gotcha. I'll close this for now - if you see a similar issue in the future, comment and let us know.

Happy to close it. I'm still a little confused why it would get into a state of isLoading: true and never exit that state with new results or an error. That seemed like odd behavior.