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

Rename pokeApi to pokeRestApi

graphql
Jason Zhu 2023-06-04 12:54:01 +10:00
parent cfd9301793
commit 9cb23006ed
8 changed files with 45 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/app/services/pokeApi.test.ts → src/app/services/pokeRestApi.test.ts
View File

@ -1,7 +1,7 @@
import { pokedexSlice } from 'features/Pokedex/pokedexSlice';
import { pokeApi } from 'app/services/pokeApi';
import { pokeRestApi } from 'app/services/pokeRestApi';
import { filterSlice } from 'features/Filters/filterSlice';
import { getIdFromUrl } from 'app/services/pokeApi';
import { getIdFromUrl } from 'app/services/pokeRestApi';
import { configureStore } from '@reduxjs/toolkit';
@ -15,25 +15,25 @@ import {
let store: AppStore;
describe('pokeApi', () => {
describe('pokeRestApi', () => {
beforeEach(() => {
store = configureStore({
reducer: {
pokedex: pokedexSlice.reducer,
filter: filterSlice.reducer,
[pokeApi.reducerPath]: pokeApi.reducer,
[pokeRestApi.reducerPath]: pokeRestApi.reducer,
},
middleware: getDefaultMiddleware =>
getDefaultMiddleware().concat(pokeApi.middleware),
getDefaultMiddleware().concat(pokeRestApi.middleware),
});
});
describe('JEST test against mock API', () => {
describe('test getPokemon query', () => {
test('visit https://pokeapi.co/api/v2/pokemon/85 returns Dodrio', async () => {
await store.dispatch(pokeApi.endpoints.getPokemon.initiate(85));
await store.dispatch(pokeRestApi.endpoints.getPokemon.initiate(85));
const pokemon = pokeApi.endpoints.getPokemon.select(85)(
const pokemon = pokeRestApi.endpoints.getPokemon.select(85)(
store.getState(),
).data as PokemonResponseData;
expect(pokemon?.name).toBe('dodrio');
@ -48,11 +48,13 @@ describe('pokeApi', () => {
describe('test getPokemonSpecies query', () => {
test('visit https://pokeapi.co/api/v2/pokemon-species/6/', async () => {
await store.dispatch(pokeApi.endpoints.getPokemonSpecies.initiate(6));
await store.dispatch(
pokeRestApi.endpoints.getPokemonSpecies.initiate(6),
);
const pokemonSpecies = pokeApi.endpoints.getPokemonSpecies.select(6)(
store.getState(),
).data as PokemonSpeciesResponseData;
const pokemonSpecies = pokeRestApi.endpoints.getPokemonSpecies.select(
6,
)(store.getState()).data as PokemonSpeciesResponseData;
expect(pokemonSpecies?.evolution_chain.url).toBe(
'https://pokeapi.co/api/v2/evolution-chain/2/',
);
@ -62,13 +64,13 @@ describe('pokeApi', () => {
describe('test getPokemonSpecies query', () => {
test('visit https://pokeapi.co/api/v2/pokemon-species/6/', async () => {
await store.dispatch(
pokeApi.endpoints.getPokemonSpeciesFromUrl.initiate(
pokeRestApi.endpoints.getPokemonSpeciesFromUrl.initiate(
'https://pokeapi.co/api/v2/pokemon-species/6/',
),
);
const pokemonSpecies =
pokeApi.endpoints.getPokemonSpeciesFromUrl.select(
pokeRestApi.endpoints.getPokemonSpeciesFromUrl.select(
'https://pokeapi.co/api/v2/pokemon-species/6/',
)(store.getState()).data as PokemonSpeciesResponseData;
expect(pokemonSpecies?.evolution_chain.url).toBe(
@ -79,9 +81,9 @@ describe('pokeApi', () => {
describe('test getTypeList query', () => {
test('visit https://pokeapi.co/api/v2/type should return correct data in list', async () => {
await store.dispatch(pokeApi.endpoints.getTypeList.initiate());
await store.dispatch(pokeRestApi.endpoints.getTypeList.initiate());
const typeListData = pokeApi.endpoints.getTypeList.select()(
const typeListData = pokeRestApi.endpoints.getTypeList.select()(
store.getState(),
).data as TypeListResponseData;
expect(typeListData?.results).toHaveLength(typeListData.count + 1);
@ -90,11 +92,13 @@ describe('pokeApi', () => {
describe('test getEvolutionChain query', () => {
test('visit https://pokeapi.co/api/v2/evolution-chain/2/', async () => {
await store.dispatch(pokeApi.endpoints.getEvolutionChain.initiate(2));
await store.dispatch(
pokeRestApi.endpoints.getEvolutionChain.initiate(2),
);
const evolutionChainData = pokeApi.endpoints.getEvolutionChain.select(
2,
)(store.getState()).data as EvolutionChainResponseData;
const evolutionChainData =
pokeRestApi.endpoints.getEvolutionChain.select(2)(store.getState())
.data as EvolutionChainResponseData;
expect(evolutionChainData?.chain.species.url).toBe(
'https://pokeapi.co/api/v2/pokemon-species/4/',
);
@ -110,13 +114,13 @@ describe('pokeApi', () => {
describe('test getEvolutionChainFromUrl query', () => {
test('visit https://pokeapi.co/api/v2/evolution-chain/2/', async () => {
await store.dispatch(
pokeApi.endpoints.getEvolutionChainFromUrl.initiate(
pokeRestApi.endpoints.getEvolutionChainFromUrl.initiate(
'https://pokeapi.co/api/v2/evolution-chain/2/',
),
);
const evolutionChainData =
pokeApi.endpoints.getEvolutionChainFromUrl.select(
pokeRestApi.endpoints.getEvolutionChainFromUrl.select(
'https://pokeapi.co/api/v2/evolution-chain/2/',
)(store.getState()).data as EvolutionChainResponseData;
expect(evolutionChainData?.chain.species.url).toBe(

6
src/app/services/pokeApi.ts → src/app/services/pokeRestApi.ts
View File

@ -12,8 +12,8 @@ export const getIdFromUrl = (url: string) => {
return parseInt(urlParts[urlParts.length - 2]);
};
export const pokeApi = createApi({
reducerPath: 'pokeApi',
export const pokeRestApi = createApi({
reducerPath: 'pokeRestApi',
baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
endpoints: builder => ({
getTypeList: builder.query<TypeListResponseData, void>({
@ -54,4 +54,4 @@ export const {
useGetPokemonSpeciesFromUrlQuery,
useGetEvolutionChainQuery,
useGetEvolutionChainFromUrlQuery,
} = pokeApi;
} = pokeRestApi;

6
src/app/store.ts
View File

@ -2,7 +2,7 @@ import { configureStore } from '@reduxjs/toolkit';
import { pokedexSlice } from 'features/Pokedex/pokedexSlice';
import { filterSlice } from 'features/Filters/filterSlice';
import { infoDialogSlice } from 'features/InfoDialog/infoDialogSlice';
import { pokeApi } from './services/pokeApi';
import { pokeRestApi } from './services/pokeRestApi';
export const store = configureStore({
reducer: {
@ -12,10 +12,10 @@ export const store = configureStore({
infoDialog: infoDialogSlice.reducer,
// api slices
[pokeApi.reducerPath]: pokeApi.reducer,
[pokeRestApi.reducerPath]: pokeRestApi.reducer,
},
middleware: getDefaultMiddleware =>
getDefaultMiddleware().concat(pokeApi.middleware),
getDefaultMiddleware().concat(pokeRestApi.middleware),
devTools: true,
});

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

@ -8,7 +8,7 @@ import {
setSearchInput,
initializeFilterSlice,
} from './filterSlice';
import { useGetTypeListQuery } from 'app/services/pokeApi';
import { useGetTypeListQuery } from 'app/services/pokeRestApi';
import { RegionPokemonRange } from './types/slice';
import './Filters.css';

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

@ -6,7 +6,7 @@ import {
} from '@reduxjs/toolkit';
import { FilterState } from './types/slice';
import { RegionPokemonRange } from './types/slice';
import { pokeApi } from 'app/services/pokeApi';
import { pokeRestApi } from 'app/services/pokeRestApi';
import { fetchPokemonsInTheRegion } from 'features/Pokedex/pokedexSlice';
const initialState: FilterState = {
@ -35,7 +35,7 @@ export const initializeFilterSlice = createAsyncThunk(
{ region: 'galar', startId: 810, endId: 898 },
];
dispatch(pokeApi.endpoints.getTypeList.initiate());
dispatch(pokeRestApi.endpoints.getTypeList.initiate());
const sortOptions = [
{ name: 'ID', value: 'id' },
@ -87,7 +87,7 @@ export const filterSlice: Slice<FilterState> = createSlice({
}
});
builder.addMatcher(
pokeApi.endpoints.getTypeList.matchFulfilled,
pokeRestApi.endpoints.getTypeList.matchFulfilled,
(state, action) => {
if (action.payload && action.payload.results.length > 0) {
const regionListResults = action.payload.results;

10
src/features/InfoDialog/infoDialogSlice.ts
View File

@ -1,7 +1,7 @@
import { createAsyncThunk, createSlice } from '@reduxjs/toolkit';
import type { Slice, PayloadAction } from '@reduxjs/toolkit';
import { pokeApi } from 'app/services/pokeApi';
import { pokeRestApi } from 'app/services/pokeRestApi';
import { EvolutionSpeciesProps } from 'components/EvolutionSpecies';
import { Stat } from 'components/InfoDialogComponent';
import {
@ -119,19 +119,19 @@ export const fetchSelectedPokemonInfo = createAsyncThunk(
try {
const selectedPokemon = await dispatch(
pokeApi.endpoints.getPokemon.initiate(pokemonIdOrName),
pokeRestApi.endpoints.getPokemon.initiate(pokemonIdOrName),
);
if (selectedPokemon.data) {
const selectedPokemonSpecies = await dispatch(
pokeApi.endpoints.getPokemonSpeciesFromUrl.initiate(
pokeRestApi.endpoints.getPokemonSpeciesFromUrl.initiate(
selectedPokemon.data.species.url,
),
);
if (selectedPokemonSpecies.data) {
const selectedPokemonEvolutionChain = await dispatch(
pokeApi.endpoints.getEvolutionChainFromUrl.initiate(
pokeRestApi.endpoints.getEvolutionChainFromUrl.initiate(
selectedPokemonSpecies.data.evolution_chain.url,
),
);
@ -146,7 +146,7 @@ export const fetchSelectedPokemonInfo = createAsyncThunk(
await Promise.all(
evolutionChainName.map(async name => {
const evolutionChainPokemon = await dispatch(
pokeApi.endpoints.getPokemon.initiate(name),
pokeRestApi.endpoints.getPokemon.initiate(name),
);
if (evolutionChainPokemon.data) {
evolutionChain.push({

6
src/features/Pokedex/__test__/pokedex.test.ts
View File

@ -10,7 +10,7 @@ import { AppStore } from 'app/store';
import { configureStore } from '@reduxjs/toolkit';
import { pokedexSlice } from 'features/Pokedex/pokedexSlice';
import { filterSlice } from 'features/Filters/filterSlice';
import { pokeApi } from 'app/services/pokeApi';
import { pokeRestApi } from 'app/services/pokeRestApi';
let store: AppStore;
@ -20,10 +20,10 @@ describe('pokedex Component', () => {
reducer: {
pokedex: pokedexSlice.reducer,
filter: filterSlice.reducer,
[pokeApi.reducerPath]: pokeApi.reducer,
[pokeRestApi.reducerPath]: pokeRestApi.reducer,
},
middleware: getDefaultMiddleware =>
getDefaultMiddleware().concat(pokeApi.middleware),
getDefaultMiddleware().concat(pokeRestApi.middleware),
});
});

4
src/features/Pokedex/pokedexSlice.ts
View File

@ -5,7 +5,7 @@ import { PokedexStateProps } from 'features/Pokedex/types/slice';
import { getStartAndEndIdsForRegion } from './utils';
import { PokemonResponseData } from 'types/api';
import { pokeApi } from 'app/services/pokeApi';
import { pokeRestApi } from 'app/services/pokeRestApi';
import { RootState } from 'app/store';
export const fetchPokemonsInTheRegion = createAsyncThunk<
@ -25,7 +25,7 @@ export const fetchPokemonsInTheRegion = createAsyncThunk<
);
const pokemonList = pokemonIds.map(id =>
dispatch(pokeApi.endpoints.getPokemon.initiate(id))
dispatch(pokeRestApi.endpoints.getPokemon.initiate(id))
.unwrap()
.then(data => data),
);