From f52bcc53897087f03f0176f485b01ae04232634c Mon Sep 17 00:00:00 2001 From: Alejandro Celaya Date: Sun, 19 Jan 2020 20:37:12 +0100 Subject: [PATCH] Ensured state is reset on edit meta modal after closing it --- src/short-urls/helpers/EditMetaModal.js | 14 +++++++++----- src/short-urls/reducers/shortUrlMeta.js | 6 +++++- src/short-urls/services/provideServices.js | 5 +++-- test/short-urls/helpers/EditTagsModal.test.js | 5 +---- test/short-urls/reducers/shortUrlMeta.test.js | 15 +++++++++++++++ 5 files changed, 33 insertions(+), 12 deletions(-) diff --git a/src/short-urls/helpers/EditMetaModal.js b/src/short-urls/helpers/EditMetaModal.js index 31251dcb..f4cec441 100644 --- a/src/short-urls/helpers/EditMetaModal.js +++ b/src/short-urls/helpers/EditMetaModal.js @@ -5,6 +5,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons'; import { ExternalLink } from 'react-external-link'; import moment from 'moment'; +import { pipe } from 'ramda'; import { shortUrlType } from '../reducers/shortUrlsList'; import { shortUrlEditMetaType } from '../reducers/shortUrlMeta'; import DateInput from '../../utils/DateInput'; @@ -16,6 +17,7 @@ const propTypes = { shortUrl: shortUrlType.isRequired, shortUrlMeta: shortUrlEditMetaType, editShortUrlMeta: PropTypes.func, + resetShortUrlMeta: PropTypes.func, }; const dateOrUndefined = (shortUrl, dateName) => { @@ -25,22 +27,24 @@ const dateOrUndefined = (shortUrl, dateName) => { }; const EditMetaModal = ( - { isOpen, toggle, shortUrl, shortUrlMeta, editShortUrlMeta } + { isOpen, toggle, shortUrl, shortUrlMeta, editShortUrlMeta, resetShortUrlMeta } ) => { const { saving, error } = shortUrlMeta; const url = shortUrl && (shortUrl.shortUrl || ''); const [ validSince, setValidSince ] = useState(dateOrUndefined(shortUrl, 'validSince')); const [ validUntil, setValidUntil ] = useState(dateOrUndefined(shortUrl, 'validUntil')); const [ maxVisits, setMaxVisits ] = useState(shortUrl && shortUrl.meta && shortUrl.meta.maxVisits); + + const close = pipe(resetShortUrlMeta, toggle); const doEdit = () => editShortUrlMeta(shortUrl.shortCode, { maxVisits: maxVisits && parseInt(maxVisits), validSince: validSince && formatIsoDate(validSince), validUntil: validUntil && formatIsoDate(validUntil), - }).then(toggle); + }).then(close); return ( - - + + Edit metadata for

Using these metadata properties, you can limit when and how many times your short URL can be visited.

@@ -83,7 +87,7 @@ const EditMetaModal = ( )} - + diff --git a/src/short-urls/reducers/shortUrlMeta.js b/src/short-urls/reducers/shortUrlMeta.js index 724b3b6a..2c799e13 100644 --- a/src/short-urls/reducers/shortUrlMeta.js +++ b/src/short-urls/reducers/shortUrlMeta.js @@ -1,10 +1,11 @@ -import { handleActions } from 'redux-actions'; +import { createAction, handleActions } from 'redux-actions'; import PropTypes from 'prop-types'; /* eslint-disable padding-line-between-statements */ export const EDIT_SHORT_URL_META_START = 'shlink/shortUrlMeta/EDIT_SHORT_URL_META_START'; export const EDIT_SHORT_URL_META_ERROR = 'shlink/shortUrlMeta/EDIT_SHORT_URL_META_ERROR'; export const SHORT_URL_META_EDITED = 'shlink/shortUrlMeta/SHORT_URL_META_EDITED'; +export const RESET_EDIT_SHORT_URL_META = 'shlink/shortUrlMeta/RESET_EDIT_SHORT_URL_META'; /* eslint-enable padding-line-between-statements */ export const shortUrlMetaType = PropTypes.shape({ @@ -31,6 +32,7 @@ export default handleActions({ [EDIT_SHORT_URL_META_START]: (state) => ({ ...state, saving: true, error: false }), [EDIT_SHORT_URL_META_ERROR]: (state) => ({ ...state, saving: false, error: true }), [SHORT_URL_META_EDITED]: (state, { shortCode, meta }) => ({ shortCode, meta, saving: false, error: false }), + [RESET_EDIT_SHORT_URL_META]: () => initialState, }, initialState); export const editShortUrlMeta = (buildShlinkApiClient) => (shortCode, meta) => async (dispatch, getState) => { @@ -46,3 +48,5 @@ export const editShortUrlMeta = (buildShlinkApiClient) => (shortCode, meta) => a throw e; } }; + +export const resetShortUrlMeta = createAction(RESET_EDIT_SHORT_URL_META); diff --git a/src/short-urls/services/provideServices.js b/src/short-urls/services/provideServices.js index 5642f784..a46974c9 100644 --- a/src/short-urls/services/provideServices.js +++ b/src/short-urls/services/provideServices.js @@ -14,7 +14,7 @@ import { listShortUrls } from '../reducers/shortUrlsList'; import { createShortUrl, resetCreateShortUrl } from '../reducers/shortUrlCreation'; import { deleteShortUrl, resetDeleteShortUrl, shortUrlDeleted } from '../reducers/shortUrlDeletion'; import { editShortUrlTags, resetShortUrlsTags, shortUrlTagsEdited } from '../reducers/shortUrlTags'; -import { editShortUrlMeta } from '../reducers/shortUrlMeta'; +import { editShortUrlMeta, resetShortUrlMeta } from '../reducers/shortUrlMeta'; import { resetShortUrlParams } from '../reducers/shortUrlsListParams'; const provideServices = (bottle, connect) => { @@ -57,7 +57,7 @@ const provideServices = (bottle, connect) => { )); bottle.serviceFactory('EditMetaModal', () => EditMetaModal); - bottle.decorator('EditMetaModal', connect([ 'shortUrlMeta' ], [ 'editShortUrlMeta' ])); + bottle.decorator('EditMetaModal', connect([ 'shortUrlMeta' ], [ 'editShortUrlMeta', 'resetShortUrlMeta' ])); // Actions bottle.serviceFactory('editShortUrlTags', editShortUrlTags, 'buildShlinkApiClient'); @@ -75,6 +75,7 @@ const provideServices = (bottle, connect) => { bottle.serviceFactory('shortUrlDeleted', () => shortUrlDeleted); bottle.serviceFactory('editShortUrlMeta', editShortUrlMeta, 'buildShlinkApiClient'); + bottle.serviceFactory('resetShortUrlMeta', () => resetShortUrlMeta); }; export default provideServices; diff --git a/test/short-urls/helpers/EditTagsModal.test.js b/test/short-urls/helpers/EditTagsModal.test.js index 1f6b4a0d..2bb99f88 100644 --- a/test/short-urls/helpers/EditTagsModal.test.js +++ b/test/short-urls/helpers/EditTagsModal.test.js @@ -35,10 +35,7 @@ describe('', () => { afterEach(() => { wrapper && wrapper.unmount(); - editShortUrlTags.mockClear(); - shortUrlTagsEdited.mockReset(); - resetShortUrlsTags.mockReset(); - toggle.mockReset(); + jest.clearAllMocks(); }); it('resets tags when component is mounted', () => { diff --git a/test/short-urls/reducers/shortUrlMeta.test.js b/test/short-urls/reducers/shortUrlMeta.test.js index 1fa74036..d1158efd 100644 --- a/test/short-urls/reducers/shortUrlMeta.test.js +++ b/test/short-urls/reducers/shortUrlMeta.test.js @@ -3,7 +3,9 @@ import reducer, { EDIT_SHORT_URL_META_START, EDIT_SHORT_URL_META_ERROR, SHORT_URL_META_EDITED, + RESET_EDIT_SHORT_URL_META, editShortUrlMeta, + resetShortUrlMeta, } from '../../../src/short-urls/reducers/shortUrlMeta'; describe('shortUrlMetaReducer', () => { @@ -36,6 +38,15 @@ describe('shortUrlMetaReducer', () => { error: false, }); }); + + it('goes back to initial state on RESET_EDIT_SHORT_URL_META', () => { + expect(reducer({}, { type: RESET_EDIT_SHORT_URL_META })).toEqual({ + meta: {}, + shortCode: null, + saving: false, + error: false, + }); + }); }); describe('editShortUrlMeta', () => { @@ -75,4 +86,8 @@ describe('shortUrlMetaReducer', () => { expect(dispatch).toHaveBeenNthCalledWith(2, { type: EDIT_SHORT_URL_META_ERROR }); }); }); + + describe('resetShortUrlMeta', () => { + it('creates expected action', () => expect(resetShortUrlMeta()).toEqual({ type: RESET_EDIT_SHORT_URL_META })); + }); });