Created page for tag visit stats

src/visits/reducers/common.js

@@ -0,0 +1,56 @@
+import { flatten, prop, range, splitEvery } from 'ramda';
+
+const ITEMS_PER_PAGE = 5000;
+const isLastPage = ({ currentPage, pagesCount }) => currentPage >= pagesCount;
+
+export const getVisitsWithLoader = async (visitsLoader, extraFinishActionData, actionMap, dispatch, getState) => {
+  dispatch({ type: actionMap.start });
+
+  const loadVisits = async (page = 1) => {
+    const { pagination, data } = await visitsLoader(page, ITEMS_PER_PAGE);
+
+    // If pagination was not returned, then this is an old shlink version. Just return data
+    if (!pagination || isLastPage(pagination)) {
+      return data;
+    }
+
+    // If there are more pages, make requests in blocks of 4
+    const parallelRequestsCount = 4;
+    const parallelStartingPage = 2;
+    const pagesRange = range(parallelStartingPage, pagination.pagesCount + 1);
+    const pagesBlocks = splitEvery(parallelRequestsCount, pagesRange);
+
+    if (pagination.pagesCount - 1 > parallelRequestsCount) {
+      dispatch({ type: actionMap.large });
+    }
+
+    return data.concat(await loadPagesBlocks(pagesBlocks));
+  };
+
+  const loadPagesBlocks = async (pagesBlocks, index = 0) => {
+    const { shortUrlVisits: { cancelLoad } } = getState();
+
+    if (cancelLoad) {
+      return [];
+    }
+
+    const data = await loadVisitsInParallel(pagesBlocks[index]);
+
+    if (index < pagesBlocks.length - 1) {
+      return data.concat(await loadPagesBlocks(pagesBlocks, index + 1));
+    }
+
+    return data;
+  };
+
+  const loadVisitsInParallel = (pages) =>
+    Promise.all(pages.map((page) => visitsLoader(page, ITEMS_PER_PAGE).then(prop('data')))).then(flatten);
+
+  try {
+    const visits = await loadVisits();
+
+    dispatch({ ...extraFinishActionData, visits, type: actionMap.finish });
+  } catch (e) {
+    dispatch({ type: actionMap.error });
+  }
+};

src/visits/reducers/shortUrlVisits.js

@@ -1,8 +1,9 @@
 import { createAction, handleActions } from 'redux-actions';
 import PropTypes from 'prop-types';
-import { flatten, prop, range, splitEvery } from 'ramda';
 import { shortUrlMatches } from '../../short-urls/helpers';
 import { VisitType } from '../types';
+import { getVisitsWithLoader } from './common';
+import { CREATE_VISIT } from './visitCreation';
 
 /* eslint-disable padding-line-between-statements */
 export const GET_SHORT_URL_VISITS_START = 'shlink/shortUrlVisits/GET_SHORT_URL_VISITS_START';
@@ -10,7 +11,6 @@ export const GET_SHORT_URL_VISITS_ERROR = 'shlink/shortUrlVisits/GET_SHORT_URL_V
 export const GET_SHORT_URL_VISITS = 'shlink/shortUrlVisits/GET_SHORT_URL_VISITS';
 export const GET_SHORT_URL_VISITS_LARGE = 'shlink/shortUrlVisits/GET_SHORT_URL_VISITS_LARGE';
 export const GET_SHORT_URL_VISITS_CANCEL = 'shlink/shortUrlVisits/GET_SHORT_URL_VISITS_CANCEL';
-export const CREATE_SHORT_URL_VISIT = 'shlink/shortUrlVisits/CREATE_SHORT_URL_VISIT';
 /* eslint-enable padding-line-between-statements */
 
 export const shortUrlVisitsType = PropTypes.shape({ // TODO Should extend from VisitInfoType
@@ -18,6 +18,7 @@ export const shortUrlVisitsType = PropTypes.shape({ // TODO Should extend from V
   shortCode: PropTypes.string,
   domain: PropTypes.string,
   loading: PropTypes.bool,
+  loadingLarge: PropTypes.bool,
   error: PropTypes.bool,
 });
 
@@ -56,7 +57,7 @@ export default handleActions({
   }),
   [GET_SHORT_URL_VISITS_LARGE]: (state) => ({ ...state, loadingLarge: true }),
   [GET_SHORT_URL_VISITS_CANCEL]: (state) => ({ ...state, cancelLoad: true }),
-  [CREATE_SHORT_URL_VISIT]: (state, { shortUrl, visit }) => { // eslint-disable-line object-shorthand
+  [CREATE_VISIT]: (state, { shortUrl, visit }) => { // eslint-disable-line object-shorthand
     const { shortCode, domain, visits } = state;
 
     if (!shortUrlMatches(shortUrl, shortCode, domain)) {
@@ -67,65 +68,18 @@ export default handleActions({
   },
 }, initialState);
 
-export const getShortUrlVisits = (buildShlinkApiClient) => (shortCode, query = {}) => async (dispatch, getState) => {
-  dispatch({ type: GET_SHORT_URL_VISITS_START });
+export const getShortUrlVisits = (buildShlinkApiClient) => (shortCode, query = {}) => (dispatch, getState) => {
   const { getShortUrlVisits } = buildShlinkApiClient(getState);
-  const itemsPerPage = 5000;
-  const isLastPage = ({ currentPage, pagesCount }) => currentPage >= pagesCount;
-
-  const loadVisits = async (page = 1) => {
-    const { pagination, data } = await getShortUrlVisits(shortCode, { ...query, page, itemsPerPage });
-
-    // If pagination was not returned, then this is an older shlink version. Just return data
-    if (!pagination || isLastPage(pagination)) {
-      return data;
-    }
-
-    // If there are more pages, make requests in blocks of 4
-    const parallelRequestsCount = 4;
-    const parallelStartingPage = 2;
-    const pagesRange = range(parallelStartingPage, pagination.pagesCount + 1);
-    const pagesBlocks = splitEvery(parallelRequestsCount, pagesRange);
-
-    if (pagination.pagesCount - 1 > parallelRequestsCount) {
-      dispatch({ type: GET_SHORT_URL_VISITS_LARGE });
-    }
-
-    return data.concat(await loadPagesBlocks(pagesBlocks));
+  const visitsLoader = (page, itemsPerPage) => getShortUrlVisits(shortCode, { ...query, page, itemsPerPage });
+  const extraFinishActionData = { shortCode, domain: query.domain };
+  const actionMap = {
+    start: GET_SHORT_URL_VISITS_START,
+    large: GET_SHORT_URL_VISITS_LARGE,
+    finish: GET_SHORT_URL_VISITS,
+    error: GET_SHORT_URL_VISITS_ERROR,
   };
 
-  const loadPagesBlocks = async (pagesBlocks, index = 0) => {
-    const { shortUrlVisits: { cancelLoad } } = getState();
-
-    if (cancelLoad) {
-      return [];
-    }
-
-    const data = await loadVisitsInParallel(pagesBlocks[index]);
-
-    if (index < pagesBlocks.length - 1) {
-      return data.concat(await loadPagesBlocks(pagesBlocks, index + 1));
-    }
-
-    return data;
-  };
-
-  const loadVisitsInParallel = (pages) =>
-    Promise.all(pages.map(
-      (page) =>
-        getShortUrlVisits(shortCode, { ...query, page, itemsPerPage })
-          .then(prop('data'))
-    )).then(flatten);
-
-  try {
-    const visits = await loadVisits();
-
-    dispatch({ visits, shortCode, domain: query.domain, type: GET_SHORT_URL_VISITS });
-  } catch (e) {
-    dispatch({ type: GET_SHORT_URL_VISITS_ERROR });
-  }
+  return getVisitsWithLoader(visitsLoader, extraFinishActionData, actionMap, dispatch, getState);
 };
 
 export const cancelGetShortUrlVisits = createAction(GET_SHORT_URL_VISITS_CANCEL);
-
-export const createNewVisit = ({ shortUrl, visit }) => ({ shortUrl, visit, type: CREATE_SHORT_URL_VISIT });

src/visits/reducers/tagVisits.js

@@ -0,0 +1,81 @@
+import { createAction, handleActions } from 'redux-actions';
+import PropTypes from 'prop-types';
+import { VisitType } from '../types';
+import { getVisitsWithLoader } from './common';
+import { CREATE_VISIT } from './visitCreation';
+
+/* eslint-disable padding-line-between-statements */
+export const GET_TAG_VISITS_START = 'shlink/tagVisits/GET_TAG_VISITS_START';
+export const GET_TAG_VISITS_ERROR = 'shlink/tagVisits/GET_TAG_VISITS_ERROR';
+export const GET_TAG_VISITS = 'shlink/tagVisits/GET_TAG_VISITS';
+export const GET_TAG_VISITS_LARGE = 'shlink/tagVisits/GET_TAG_VISITS_LARGE';
+export const GET_TAG_VISITS_CANCEL = 'shlink/tagVisits/GET_TAG_VISITS_CANCEL';
+/* eslint-enable padding-line-between-statements */
+
+export const TagVisitsType = PropTypes.shape({ // TODO Should extend from VisitInfoType
+  visits: PropTypes.arrayOf(VisitType),
+  tag: PropTypes.string,
+  loading: PropTypes.bool,
+  loadingLarge: PropTypes.bool,
+  error: PropTypes.bool,
+});
+
+const initialState = {
+  visits: [],
+  tag: '',
+  loading: false,
+  loadingLarge: false,
+  error: false,
+  cancelLoad: false,
+};
+
+export default handleActions({
+  [GET_TAG_VISITS_START]: (state) => ({
+    ...state,
+    loading: true,
+    loadingLarge: false,
+    cancelLoad: false,
+  }),
+  [GET_TAG_VISITS_ERROR]: (state) => ({
+    ...state,
+    loading: false,
+    loadingLarge: false,
+    error: true,
+    cancelLoad: false,
+  }),
+  [GET_TAG_VISITS]: (state, { visits, tag }) => ({
+    visits,
+    tag,
+    loading: false,
+    loadingLarge: false,
+    error: false,
+    cancelLoad: false,
+  }),
+  [GET_TAG_VISITS_LARGE]: (state) => ({ ...state, loadingLarge: true }),
+  [GET_TAG_VISITS_CANCEL]: (state) => ({ ...state, cancelLoad: true }),
+  [CREATE_VISIT]: (state, { shortUrl, visit }) => { // eslint-disable-line object-shorthand
+    const { tag, visits } = state;
+
+    if (!shortUrl.tags.includes(tag)) {
+      return state;
+    }
+
+    return { ...state, visits: [ ...visits, visit ] };
+  },
+}, initialState);
+
+export const getTagVisits = (buildShlinkApiClient) => (tag, query = {}) => (dispatch, getState) => {
+  const { getTagVisits } = buildShlinkApiClient(getState);
+  const visitsLoader = (page, itemsPerPage) => getTagVisits(tag, { ...query, page, itemsPerPage });
+  const extraFinishActionData = { tag };
+  const actionMap = {
+    start: GET_TAG_VISITS_START,
+    large: GET_TAG_VISITS_LARGE,
+    finish: GET_TAG_VISITS,
+    error: GET_TAG_VISITS_ERROR,
+  };
+
+  return getVisitsWithLoader(visitsLoader, extraFinishActionData, actionMap, dispatch, getState);
+};
+
+export const cancelGetTagVisits = createAction(GET_TAG_VISITS_CANCEL);

src/visits/reducers/visitCreation.js

@@ -0,0 +1,3 @@
+export const CREATE_VISIT = 'shlink/visitCreation/CREATE_VISIT';
+
+export const createNewVisit = ({ shortUrl, visit }) => ({ shortUrl, visit, type: CREATE_VISIT });