diff --git a/src/tags/helpers/DeleteTagConfirmModal.tsx b/src/tags/helpers/DeleteTagConfirmModal.tsx index 6828af13..fd2cbfdb 100644 --- a/src/tags/helpers/DeleteTagConfirmModal.tsx +++ b/src/tags/helpers/DeleteTagConfirmModal.tsx @@ -13,15 +13,14 @@ interface DeleteTagConfirmModalProps extends TagModalProps { export const DeleteTagConfirmModal = ( { tag, toggle, isOpen, deleteTag, tagDelete, tagDeleted }: DeleteTagConfirmModalProps, ) => { - const { deleting, error, errorData } = tagDelete; + const { deleting, error, deleted, errorData } = tagDelete; const doDelete = async () => { await deleteTag(tag); - tagDeleted(tag); toggle(); }; return ( - + deleted && tagDeleted(tag)}> Delete tag Are you sure you want to delete tag {tag}? diff --git a/src/tags/reducers/tagDelete.ts b/src/tags/reducers/tagDelete.ts index f0111660..2c6683d6 100644 --- a/src/tags/reducers/tagDelete.ts +++ b/src/tags/reducers/tagDelete.ts @@ -13,6 +13,7 @@ export const TAG_DELETED = 'shlink/deleteTag/TAG_DELETED'; export interface TagDeletion { deleting: boolean; + deleted: boolean; error: boolean; errorData?: ProblemDetailsError; } @@ -23,13 +24,14 @@ export interface DeleteTagAction extends Action { const initialState: TagDeletion = { deleting: false, + deleted: false, error: false, }; export default buildReducer({ - [DELETE_TAG_START]: () => ({ deleting: true, error: false }), - [DELETE_TAG_ERROR]: (_, { errorData }) => ({ deleting: false, error: true, errorData }), - [DELETE_TAG]: () => ({ deleting: false, error: false }), + [DELETE_TAG_START]: () => ({ deleting: true, deleted: false, error: false }), + [DELETE_TAG_ERROR]: (_, { errorData }) => ({ deleting: false, deleted: false, error: true, errorData }), + [DELETE_TAG]: () => ({ deleting: false, deleted: true, error: false }), }, initialState); export const deleteTag = (buildShlinkApiClient: ShlinkApiClientBuilder) => (tag: string) => async ( diff --git a/test/tags/helpers/DeleteTagConfirmModal.test.tsx b/test/tags/helpers/DeleteTagConfirmModal.test.tsx index 8ca667ea..00a7cdf1 100644 --- a/test/tags/helpers/DeleteTagConfirmModal.test.tsx +++ b/test/tags/helpers/DeleteTagConfirmModal.test.tsx @@ -6,14 +6,14 @@ import { renderWithEvents } from '../../__helpers__/setUpTest'; describe('', () => { const tag = 'nodejs'; const deleteTag = jest.fn(); - const tagDeleted = jest.fn(); + const toggle = jest.fn(); const setUp = (tagDelete: TagDeletion) => renderWithEvents( ''} + toggle={toggle} isOpen deleteTag={deleteTag} - tagDeleted={tagDeleted} + tagDeleted={jest.fn()} tagDelete={tagDelete} />, ); @@ -21,7 +21,7 @@ describe('', () => { afterEach(jest.resetAllMocks); it('asks confirmation for provided tag to be deleted', () => { - setUp({ error: false, deleting: false }); + setUp({ error: false, deleted: false, deleting: false }); const delBtn = screen.getByRole('button', { name: 'Delete tag' }); @@ -33,12 +33,12 @@ describe('', () => { }); it('shows error message when deletion failed', () => { - setUp({ error: true, deleting: false }); + setUp({ error: true, deleted: false, deleting: false }); expect(screen.getByText('Something went wrong while deleting the tag :(')).toBeInTheDocument(); }); it('shows loading status while deleting', () => { - setUp({ error: false, deleting: true }); + setUp({ error: false, deleted: false, deleting: true }); const delBtn = screen.getByRole('button', { name: 'Deleting tag...' }); @@ -48,22 +48,21 @@ describe('', () => { }); it('hides tag modal when btn is clicked', async () => { - const { user } = setUp({ error: false, deleting: false }); + const { user } = setUp({ error: false, deleted: true, deleting: false }); await user.click(screen.getByRole('button', { name: 'Delete tag' })); expect(deleteTag).toHaveBeenCalledTimes(1); expect(deleteTag).toHaveBeenCalledWith(tag); - expect(tagDeleted).toHaveBeenCalledTimes(1); - expect(tagDeleted).toHaveBeenCalledWith(tag); + expect(toggle).toHaveBeenCalledTimes(1); }); it('does no further actions when modal is closed without deleting tag', async () => { - const { user } = setUp({ error: false, deleting: false }); + const { user } = setUp({ error: false, deleted: true, deleting: false }); await user.click(screen.getByLabelText('Close')); expect(deleteTag).not.toHaveBeenCalled(); - expect(tagDeleted).not.toHaveBeenCalled(); + expect(toggle).toHaveBeenCalled(); }); }); diff --git a/test/tags/reducers/tagDelete.test.ts b/test/tags/reducers/tagDelete.test.ts index a4726bf1..cb05952c 100644 --- a/test/tags/reducers/tagDelete.test.ts +++ b/test/tags/reducers/tagDelete.test.ts @@ -15,6 +15,7 @@ describe('tagDeleteReducer', () => { it('returns loading on DELETE_TAG_START', () => { expect(reducer(undefined, { type: DELETE_TAG_START })).toEqual({ deleting: true, + deleted: false, error: false, }); }); @@ -22,6 +23,7 @@ describe('tagDeleteReducer', () => { it('returns error on DELETE_TAG_ERROR', () => { expect(reducer(undefined, { type: DELETE_TAG_ERROR })).toEqual({ deleting: false, + deleted: false, error: true, }); }); @@ -29,6 +31,7 @@ describe('tagDeleteReducer', () => { it('returns tag names on DELETE_TAG', () => { expect(reducer(undefined, { type: DELETE_TAG })).toEqual({ deleting: false, + deleted: true, error: false, }); });