Extracted duplicated code on creating visits reducers to a common helper function

This commit is contained in:
Alejandro Celaya
2022-11-12 20:37:04 +01:00
parent dac69daf03
commit 4b2c3d2db7
12 changed files with 137 additions and 239 deletions

View File

@@ -1,12 +1,9 @@
import { createSlice } from '@reduxjs/toolkit';
import { OrphanVisit, OrphanVisitType } from '../types';
import { ShlinkApiClientBuilder } from '../../api/services/ShlinkApiClientBuilder';
import { isOrphanVisit } from '../types/helpers';
import { isBetween } from '../../utils/helpers/date';
import { createVisitsAsyncThunk, lastVisitLoaderForLoader } from './common';
import { createNewVisits, CreateVisitsAction } from './visitCreation';
import { createVisitsAsyncThunk, createVisitsReducer, lastVisitLoaderForLoader } from './common';
import { LoadVisits, VisitsInfo } from './types';
import { parseApiError } from '../../api/utils';
const REDUCER_PREFIX = 'shlink/orphanVisits';
@@ -27,7 +24,7 @@ const matchesType = (visit: OrphanVisit, orphanVisitsType?: OrphanVisitType) =>
!orphanVisitsType || orphanVisitsType === visit.type;
export const getOrphanVisits = (buildShlinkApiClient: ShlinkApiClientBuilder) => createVisitsAsyncThunk({
actionsPrefix: `${REDUCER_PREFIX}/getOrphanVisits`,
name: `${REDUCER_PREFIX}/getOrphanVisits`,
createLoaders: ({ orphanVisitsType, query = {}, doIntervalFallback = false }: LoadOrphanVisits, getState) => {
const { getOrphanVisits: getVisits } = buildShlinkApiClient(getState);
const visitsLoader = async (page: number, itemsPerPage: number) => getVisits({ ...query, page, itemsPerPage })
@@ -45,41 +42,13 @@ export const getOrphanVisits = (buildShlinkApiClient: ShlinkApiClientBuilder) =>
});
export const orphanVisitsReducerCreator = (
{ asyncThunk, largeAction, progressChangedAction, fallbackToIntervalAction }: ReturnType<typeof getOrphanVisits>,
) => {
const { reducer, actions } = createSlice({
name: REDUCER_PREFIX,
initialState,
reducers: {
cancelGetOrphanVisits: (state) => ({ ...state, cancelLoad: true }),
},
extraReducers: (builder) => {
builder.addCase(asyncThunk.pending, () => ({ ...initialState, loading: true }));
builder.addCase(asyncThunk.rejected, (_, { error }) => (
{ ...initialState, error: true, errorData: parseApiError(error) }
));
builder.addCase(asyncThunk.fulfilled, (state, { payload }) => (
{ ...state, ...payload, loading: false, loadingLarge: false, error: false }
));
builder.addCase(largeAction, (state) => ({ ...state, loadingLarge: true }));
builder.addCase(progressChangedAction, (state, { payload: progress }) => ({ ...state, progress }));
builder.addCase(fallbackToIntervalAction, (state, { payload: fallbackInterval }) => (
{ ...state, fallbackInterval }
));
builder.addCase(createNewVisits, (state, { payload }: CreateVisitsAction) => {
const { visits, query = {} } = state;
const { startDate, endDate } = query;
const newVisits = payload.createdVisits
.filter(({ visit, shortUrl }) => !shortUrl && isBetween(visit.date, startDate, endDate))
.map(({ visit }) => visit);
return { ...state, visits: [...newVisits, ...visits] };
});
},
});
const { cancelGetOrphanVisits } = actions;
return { reducer, cancelGetOrphanVisits };
};
getVisitsCreator: ReturnType<typeof getOrphanVisits>,
) => createVisitsReducer(
REDUCER_PREFIX,
getVisitsCreator,
initialState,
({ query = {} }, createdVisits) => {
const { startDate, endDate } = query;
return createdVisits.filter(({ visit, shortUrl }) => !shortUrl && isBetween(visit.date, startDate, endDate));
},
);