I am using @redux/toolkit
with redux-persist
in a react native application with TypeScript
.
store.ts
import { configureStore } from '@reduxjs/toolkit';
import { combineReducers } from 'redux';
import { persistReducer, persistStore } from 'redux-persist';
import thunk from 'redux-thunk';
import AsyncStorage from '@react-native-async-storage/async-storage';
import calenderReducer from './reducer/calender';
const reducers = combineReducers({
graph: calenderReducer,
});
const persistConfig = {
key: 'root',
storage: AsyncStorage,
};
const persistedReducer = persistReducer(persistConfig, reducers);
export const store = configureStore({
reducer: persistedReducer,
devTools: process.env.NODE_ENV !== 'production',
middleware: [thunk],
});
// Infer the `RootState` and `AppDispatch` types from the store itself
export type RootState = ReturnType<typeof store.getState>;
// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
export type AppDispatch = typeof store.dispatch;
export const persistor = persistStore(store);
App.tsx
return (
<ApolloProvider client={client}>
<Provider store={store}>
<PersistGate loading={null} persistor={persistor}>
<View style={styles.container}>
<Text>Hello World</Text>
<StatusBar style='auto' />
</View>
</PersistGate>
</Provider>
</ApolloProvider>
);
This PersistGate Showing an Error Like this
Do you have any idea to resolve the issue??