forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-08-02 00:51:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Migrated domainVisits reducer to RTK

Browse Source
This commit is contained in:
Alejandro Celaya
2022-11-12 17:51:37 +01:00
parent a3cc3d5fc2
commit ab7c52d049
7 changed files with 200 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
src/visits/reducers/domainVisits.ts
View File

@@ -1,30 +1,13 @@
import { createAction } from '@reduxjs/toolkit';
import { Dispatch } from 'redux';
import { buildReducer } from '../../utils/helpers/redux';
import { createSlice } from '@reduxjs/toolkit';
import { ShlinkApiClientBuilder } from '../../api/services/ShlinkApiClientBuilder';
import { GetState } from '../../container/types';
import { ApiErrorAction } from '../../api/types/actions';
import { isBetween } from '../../utils/helpers/date';
import { getVisitsWithLoader, lastVisitLoaderForLoader } from './common';
import { createNewVisits, CreateVisitsAction } from './visitCreation';
import { createVisitsAsyncThunk, lastVisitLoaderForLoader } from './common';
import { createNewVisits } from './visitCreation';
import { domainMatches } from '../../short-urls/helpers';
import {
LoadVisits,
VisitsFallbackIntervalAction,
VisitsInfo,
VisitsLoaded,
VisitsLoadedAction,
VisitsLoadProgressChangedAction,
} from './types';
import { LoadVisits, VisitsInfo } from './types';
import { parseApiError } from '../../api/utils';
const REDUCER_PREFIX = 'shlink/domainVisits';
export const GET_DOMAIN_VISITS_START = `${REDUCER_PREFIX}/getDomainVisits/pending`;
export const GET_DOMAIN_VISITS_ERROR = `${REDUCER_PREFIX}/getDomainVisits/rejected`;
export const GET_DOMAIN_VISITS = `${REDUCER_PREFIX}/getDomainVisits/fulfilled`;
export const GET_DOMAIN_VISITS_LARGE = `${REDUCER_PREFIX}/getDomainVisits/large`;
export const GET_DOMAIN_VISITS_CANCEL = `${REDUCER_PREFIX}/getDomainVisits/cancel`;
export const GET_DOMAIN_VISITS_PROGRESS_CHANGED = `${REDUCER_PREFIX}/getDomainVisits/progressChanged`;
export const GET_DOMAIN_VISITS_FALLBACK_TO_INTERVAL = `${REDUCER_PREFIX}/getDomainVisits/fallbackToInterval`;
export const DEFAULT_DOMAIN = 'DEFAULT';
@@ -36,14 +19,6 @@ export interface DomainVisits extends VisitsInfo, WithDomain {}
export interface LoadDomainVisits extends LoadVisits, WithDomain {}
type DomainVisitsAction = VisitsLoadedAction<WithDomain>;
type DomainVisitsCombinedAction = DomainVisitsAction
& VisitsLoadProgressChangedAction
& VisitsFallbackIntervalAction
& CreateVisitsAction
& ApiErrorAction;
const initialState: DomainVisits = {
visits: [],
domain: '',
@@ -54,44 +29,61 @@ const initialState: DomainVisits = {
progress: 0,
};
export default buildReducer<DomainVisits, DomainVisitsCombinedAction>({
[`${REDUCER_PREFIX}/getDomainVisits/pending`]: () => ({ ...initialState, loading: true }),
[`${REDUCER_PREFIX}/getDomainVisits/rejected`]: (_, { errorData }) => ({ ...initialState, error: true, errorData }),
[`${REDUCER_PREFIX}/getDomainVisits/fulfilled`]: (state, { payload }: DomainVisitsAction) => (
{ ...state, ...payload, loading: false, loadingLarge: false, error: false }
),
[`${REDUCER_PREFIX}/getDomainVisits/large`]: (state) => ({ ...state, loadingLarge: true }),
[`${REDUCER_PREFIX}/getDomainVisits/cancel`]: (state) => ({ ...state, cancelLoad: true }),
[`${REDUCER_PREFIX}/getDomainVisits/progressChanged`]: (state, { payload: progress }) => ({ ...state, progress }),
[`${REDUCER_PREFIX}/getDomainVisits/fallbackToInterval`]: (state, { payload: fallbackInterval }) => (
{ ...state, fallbackInterval }
),
[createNewVisits.toString()]: (state, { payload }: CreateVisitsAction) => {
const { domain, visits, query = {} } = state;
const { startDate, endDate } = query;
const newVisits = payload.createdVisits
.filter(({ shortUrl, visit }) =>
shortUrl && domainMatches(shortUrl, domain) && isBetween(visit.date, startDate, endDate))
.map(({ visit }) => visit);
export const getDomainVisits = (buildShlinkApiClient: ShlinkApiClientBuilder) => createVisitsAsyncThunk({
actionsPrefix: `${REDUCER_PREFIX}/getDomainVisits`,
createLoaders: ({ domain, query = {}, doIntervalFallback = false }: LoadDomainVisits, getState) => {
const { getDomainVisits: getVisits } = buildShlinkApiClient(getState);
const visitsLoader = async (page: number, itemsPerPage: number) => getVisits(
domain,
{ ...query, page, itemsPerPage },
);
const lastVisitLoader = lastVisitLoaderForLoader(doIntervalFallback, async (params) => getVisits(domain, params));
return { ...state, visits: [...newVisits, ...visits] };
return [visitsLoader, lastVisitLoader];
},
}, initialState);
getExtraFulfilledPayload: ({ domain, query = {} }: LoadDomainVisits) => ({ domain, query }),
shouldCancel: (getState) => getState().domainVisits.cancelLoad,
});
export const getDomainVisits = (buildShlinkApiClient: ShlinkApiClientBuilder) => (
{ domain, query = {}, doIntervalFallback = false }: LoadDomainVisits,
) => async (dispatch: Dispatch, getState: GetState) => {
const { getDomainVisits: getVisits } = buildShlinkApiClient(getState);
const visitsLoader = async (page: number, itemsPerPage: number) => getVisits(
domain,
{ ...query, page, itemsPerPage },
);
const lastVisitLoader = lastVisitLoaderForLoader(doIntervalFallback, async (params) => getVisits(domain, params));
const shouldCancel = () => getState().domainVisits.cancelLoad;
const extraFinishActionData: Partial<VisitsLoaded<WithDomain>> = { domain, query };
const prefix = `${REDUCER_PREFIX}/getDomainVisits`;
export const domainVisitsReducerCreator = (
{ asyncThunk, largeAction, progressChangedAction, fallbackToIntervalAction }: ReturnType<typeof getDomainVisits>,
) => {
const { reducer, actions } = createSlice({
name: REDUCER_PREFIX,
initialState,
reducers: {
cancelGetDomainVisits: (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 }
));
return getVisitsWithLoader(visitsLoader, lastVisitLoader, extraFinishActionData, prefix, dispatch, shouldCancel);
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 }) => {
const { domain, visits, query = {} } = state;
const { startDate, endDate } = query;
const newVisits = payload.createdVisits
.filter(({ shortUrl, visit }) =>
shortUrl && domainMatches(shortUrl, domain) && isBetween(visit.date, startDate, endDate))
.map(({ visit }) => visit);
return { ...state, visits: [...newVisits, ...visits] };
});
},
});
const { cancelGetDomainVisits } = actions;
return { reducer, cancelGetDomainVisits };
};
export const cancelGetDomainVisits = createAction<void>(`${REDUCER_PREFIX}/getDomainVisits/cancel`);