title: Middleware for RTK-Query API at reducerPath "api" has not been added to the store
body: <p>I am creating a react native app and I am getting this warning.
  Middleware for RTK-Query API at reducerPath &quot;api&quot; has not been added to the store.
  Features like automatic cache collection, automatic refetching etc. will not be available.</p>
  <p>I see my api is not been refetching.</p>
  <p><em>This is my rootReducer.ts file</em></p>
  <pre><code>import {combineReducers} from '@reduxjs/toolkit';
  import { storiesApi } from 'src/services/storiesService'
  
  const appReducer = combineReducers({
    [storiesApi.reducerPath]: storiesApi.reducer,
  });
  
  const rootReducer = (state, action) =&gt; {
    if (action.type === 'RESET_APP') {
      state = undefined;
    }
    return appReducer(state, action);
  };
  
  export const resetAppAction = () =&gt; dispatch =&gt; {
    console.log('Reset Redux Store');
    dispatch({type: 'RESET_APP'});
  };
  
  export default rootReducer;
  </code></pre>
  <p><em>This is my store.ts file</em></p>
  <pre><code>import { useDispatch as useReduxDispatch, useSelector as useReduxSelector } from 'react-redux';
  import type { TypedUseSelectorHook } from 'react-redux';
  import type { ThunkAction } from 'redux-thunk';
  import type { Action } from '@reduxjs/toolkit';
  import { configureStore } from '@reduxjs/toolkit';
  import { setupListeners } from '@reduxjs/toolkit/query/react';
  import AsyncStorage from '@react-native-async-storage/async-storage';
  import {
    persistStore,
    persistReducer,
    FLUSH,
    REHYDRATE,
    PAUSE,
    PERSIST,
    PURGE,
    REGISTER,
  } from &quot;redux-persist&quot;
  import { encryptTransform } from 'redux-persist-transform-encrypt';
  import thunk from 'redux-thunk';
  import { ENABLE_REDUX_DEV_TOOLS } from 'src/constants';
  import rootReducer from './rootReducer';
  import { storiesApi } from 'src/services/storiesService'
  
  const encryptor = encryptTransform({
    secretKey: 'my-super-secret-key-jrtec-soyaig',
    onError: function (error) {
      // Handle the error.
    },
  });
  
  const persistConfig = {
    // Root
    key: 'root',
    // Storage Method (React Native)
    storage: AsyncStorage,
    timeout: null,
    transforms: [encryptor],
  };
  const persistedReducer = persistReducer(persistConfig, rootReducer);
  
  export const store = configureStore({
    reducer: persistedReducer,
    devTools: ENABLE_REDUX_DEV_TOOLS,
    middleware: (getDefaultMiddleware) =&gt;
      getDefaultMiddleware({
        serializableCheck: {
          ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
        },
      }).concat(
        thunk,
        storiesApi.middleware
      ),
  });
  
  // optional, but required for refetchOnFocus/refetchOnReconnect behaviors
  // see `setupListeners` docs - takes an optional callback as the 2nd arg for customization
  setupListeners(store.dispatch)
  
  export const persistor = persistStore(store);
  
  export type RootState = ReturnType&lt;typeof store.getState&gt;;
  
  export type AppDispatch = typeof store.dispatch;
  
  export type AppThunk = ThunkAction&lt;void, RootState, null, Action&lt;string&gt;&gt;;
  
  export const useSelector: TypedUseSelectorHook&lt;RootState&gt; = useReduxSelector;
  
  export const useDispatch = () =&gt; useReduxDispatch&lt;AppDispatch&gt;();
  </code></pre>
  <p><em>This is my service I am using axios storiesService.ts</em></p>
  <pre><code>import { createApi, BaseQueryFn } from '@reduxjs/toolkit/query/react'
  import { AxiosRequestConfig, AxiosError } from 'axios'
  import responseCamelizerAxios from 'src/lib/axiosInstance';
  const API_STORIES = '/api/stories/users/';
  
  export interface IPost {
    createdAt: string;
    department: string;
    description: string;
    image: string[];
    likeStatus: boolean;
    likes: number;
    logo: string;
    organization: string;
    pk: string
    title: string
  }
  
  interface IListResponse {
    currentPage: number;
    pageSizeNews: number;
    results: IPost[]
    totalNews: number;
    totalPages: number;
  }
  
  export interface IChangeLikesResponse {
    data: {
      stories: {
        pk: number;
        like_active: boolean;
      },
    }
  }
  
  export interface IBodyChangeLikes {
    postId: number;
    likeStatus: boolean;
  }
  
  const axiosBaseQuery = (
    { baseUrl }: { baseUrl: string } = { baseUrl: '' }
  ): BaseQueryFn&lt;
    {
      url?: string
      method: AxiosRequestConfig['method']
      body?: AxiosRequestConfig['data']
    },
    unknown,
    unknown
  &gt; =&gt;
    async ({ url='', method, body }) =&gt; {
      try {
        const result = await responseCamelizerAxios({ url: baseUrl + url, method, data: body })
        console.log('result', result);
        return { data: result.data }
      } catch (axiosError) {
        // console.log('axiosError', axiosError);
        // console.log('axiosError', axiosError.response?.status);      
        let err = axiosError as AxiosError      
        return {
          error: { status: err.response?.status, data: err.response?.data },
        }
      }
    }
  
  export const storiesApi = createApi({
    baseQuery: axiosBaseQuery({ baseUrl: API_STORIES }),
    endpoints: (build) =&gt; ({
      getStories: build.query&lt;IListResponse, number | void&gt;({
        query: (page = 1) =&gt; ({ url: `?page=${page}`, method: 'get' }),
      }),
      changeLikes: build.mutation&lt;IChangeLikesResponse, IBodyChangeLikes&gt;({
        query: ({postId, likeStatus}: IBodyChangeLikes ) =&gt; ({ 
          method: 'post', 
          body: {
            data: {
              stories: {
                pk: postId,
                like_active: likeStatus,
              },
            },
          }
        }),
      }),
    }),
  })
  
  export const { useGetStoriesQuery, useChangeLikesMutation } = storiesApi
  </code></pre>
  <p>I am using on my page this hook to get data</p>
  <pre><code>  const { data, error, isLoading: isLoadingGetStories } = useGetStoriesQuery(page);
  </code></pre>
  <p>This is the message I have. Can you please tell me what is wrong with my code?</p>
  <p><a href="https://i.stack.imgur.com/mPkbC.png" rel="nofollow noreferrer">enter image description here</a></p>