diff --git a/src/tags/helpers/DeleteTagConfirmModal.js b/src/tags/helpers/DeleteTagConfirmModal.js index 460db160..0cb8664e 100644 --- a/src/tags/helpers/DeleteTagConfirmModal.js +++ b/src/tags/helpers/DeleteTagConfirmModal.js @@ -3,64 +3,45 @@ import { Modal, ModalBody, ModalFooter, ModalHeader } from 'reactstrap'; import PropTypes from 'prop-types'; import { tagDeleteType } from '../reducers/tagDelete'; -export default class DeleteTagConfirmModal extends React.Component { - static propTypes = { - tag: PropTypes.string.isRequired, - toggle: PropTypes.func.isRequired, - isOpen: PropTypes.bool.isRequired, - deleteTag: PropTypes.func, - tagDelete: tagDeleteType, - tagDeleted: PropTypes.func, - }; - - doDelete = async () => { - const { tag, toggle, deleteTag } = this.props; +const propTypes = { + tag: PropTypes.string.isRequired, + toggle: PropTypes.func.isRequired, + isOpen: PropTypes.bool.isRequired, + deleteTag: PropTypes.func, + tagDelete: tagDeleteType, + tagDeleted: PropTypes.func, +}; +const DeleteTagConfirmModal = ({ tag, toggle, isOpen, deleteTag, tagDelete, tagDeleted }) => { + const doDelete = async () => { await deleteTag(tag); - this.tagWasDeleted = true; + tagDeleted(tag); toggle(); }; - handleOnClosed = () => { - if (!this.tagWasDeleted) { - return; - } - const { tagDeleted, tag } = this.props; + return ( + + + Delete tag + + + Are you sure you want to delete tag {tag}? + {tagDelete.error && ( +
+ Something went wrong while deleting the tag :( +
+ )} +
+ + + + +
+ ); +}; - tagDeleted(tag); - }; +DeleteTagConfirmModal.propTypes = propTypes; - componentDidMount() { - this.tagWasDeleted = false; - } - - render() { - const { tag, toggle, isOpen, tagDelete } = this.props; - - return ( - - - Delete tag - - - Are you sure you want to delete tag {tag}? - {tagDelete.error && ( -
- Something went wrong while deleting the tag :( -
- )} -
- - - - -
- ); - } -} +export default DeleteTagConfirmModal; diff --git a/test/tags/helpers/DeleteTagConfirmModal.test.js b/test/tags/helpers/DeleteTagConfirmModal.test.js index 73d6de29..aa45d921 100644 --- a/test/tags/helpers/DeleteTagConfirmModal.test.js +++ b/test/tags/helpers/DeleteTagConfirmModal.test.js @@ -25,8 +25,7 @@ describe('', () => { afterEach(() => { wrapper && wrapper.unmount(); - deleteTag.mockReset(); - tagDeleted.mockReset(); + jest.resetAllMocks(); }); it('asks confirmation for provided tag to be deleted', () => { @@ -56,14 +55,16 @@ describe('', () => { expect(delBtn.text()).toEqual('Deleting tag...'); }); - it('deletes tag modal when btn is clicked', () => { + it('deletes tag modal when btn is clicked', async () => { wrapper = createWrapper({ error: false, deleting: true }); const footer = wrapper.find(ModalFooter); const delBtn = footer.find('.btn-danger'); - delBtn.simulate('click'); + await delBtn.simulate('click'); expect(deleteTag).toHaveBeenCalledTimes(1); expect(deleteTag).toHaveBeenCalledWith(tag); + expect(tagDeleted).toHaveBeenCalledTimes(1); + expect(tagDeleted).toHaveBeenCalledWith(tag); }); it('does no further actions when modal is closed without deleting tag', () => { @@ -71,16 +72,7 @@ describe('', () => { const modal = wrapper.find(Modal); modal.simulate('closed'); + expect(deleteTag).not.toHaveBeenCalled(); expect(tagDeleted).not.toHaveBeenCalled(); }); - - it('notifies tag to be deleted when modal is closed after deleting tag', () => { - wrapper = createWrapper({ error: false, deleting: false }); - const modal = wrapper.find(Modal); - - wrapper.instance().tagWasDeleted = true; - modal.simulate('closed'); - expect(tagDeleted).toHaveBeenCalledTimes(1); - expect(tagDeleted).toHaveBeenCalledWith(tag); - }); });