Jason
/
pokertk
1
0
Fork 0
Code Issues Pull Requests Projects 1 Releases Wiki Activity

Remove calling async thunk from Filter component using dispatch, but call it directly in slice

graphql
Jason Zhu 2023-06-04 12:18:41 +10:00
parent 3faf494bd0
commit 4cfc08448b
2 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/features/Filters/Filters.tsx
View File

@ -1,6 +1,5 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { useAppDispatch, useAppSelector } from 'app/hooks'; import { useAppDispatch, useAppSelector } from 'app/hooks';
import { fetchPokemonsInTheRegion } from 'features/Pokedex/pokedexSlice';
import { import {
setSelectedRegion, setSelectedRegion,
@ -56,7 +55,6 @@ const Filters = () => {
name="regionSelect" name="regionSelect"
onChange={e => { onChange={e => {
dispatch(setSelectedRegion(e.target.value)); dispatch(setSelectedRegion(e.target.value));
dispatch(fetchPokemonsInTheRegion(e.target.value));
}} }}
value={selectedRegion} value={selectedRegion}
> >

2
src/features/Filters/filterSlice.ts
View File

@ -7,6 +7,7 @@ import {
import { FilterState } from './types/slice'; import { FilterState } from './types/slice';
import { RegionPokemonRange } from './types/slice'; import { RegionPokemonRange } from './types/slice';
import { pokeApi } from 'app/services/pokeApi'; import { pokeApi } from 'app/services/pokeApi';
import { fetchPokemonsInTheRegion } from 'features/Pokedex/pokedexSlice';
pokeApi.endpoints.getTypeList.initiate(); // initialize type list fetching pokeApi.endpoints.getTypeList.initiate(); // initialize type list fetching
@ -53,6 +54,7 @@ export const filterSlice: Slice<FilterState> = createSlice({
reducers: { reducers: {
setSelectedRegion: (state, action: PayloadAction<string>) => { setSelectedRegion: (state, action: PayloadAction<string>) => {
state.selectedRegion = action.payload; state.selectedRegion = action.payload;
fetchPokemonsInTheRegion(state.selectedRegion);
}, },
setSelectedType: (state, action: PayloadAction<string>) => { setSelectedType: (state, action: PayloadAction<string>) => {
state.selectedType = action.payload; state.selectedType = action.payload;