mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 09:30:31 +03:00
Migrated tag actions to have a single DTO param
This commit is contained in:
parent
f8fc1245ca
commit
648744f440
4 changed files with 14 additions and 23 deletions
|
@ -8,15 +8,15 @@ import { useToggle } from '../../utils/helpers/hooks';
|
|||
import { handleEventPreventingDefault } from '../../utils/utils';
|
||||
import { ColorGenerator } from '../../utils/services/ColorGenerator';
|
||||
import { TagModalProps } from '../data';
|
||||
import { TagEdition } from '../reducers/tagEdit';
|
||||
import { EditTag, TagEdition } from '../reducers/tagEdit';
|
||||
import { Result } from '../../utils/Result';
|
||||
import { ShlinkApiError } from '../../api/ShlinkApiError';
|
||||
import './EditTagModal.scss';
|
||||
|
||||
interface EditTagModalProps extends TagModalProps {
|
||||
tagEdit: TagEdition;
|
||||
editTag: (oldName: string, newName: string, color: string) => Promise<void>;
|
||||
tagEdited: (oldName: string, newName: string, color: string) => void;
|
||||
editTag: (editTag: EditTag) => Promise<void>;
|
||||
tagEdited: (tagEdited: EditTag) => void;
|
||||
}
|
||||
|
||||
export const EditTagModal = ({ getColorForKey }: ColorGenerator) => (
|
||||
|
@ -27,11 +27,11 @@ export const EditTagModal = ({ getColorForKey }: ColorGenerator) => (
|
|||
const [showColorPicker, toggleColorPicker, , hideColorPicker] = useToggle();
|
||||
const { editing, error, edited, errorData } = tagEdit;
|
||||
const saveTag = handleEventPreventingDefault(
|
||||
async () => editTag(tag, newTagName, color)
|
||||
async () => editTag({ oldName: tag, newName: newTagName, color })
|
||||
.then(toggle)
|
||||
.catch(() => {}),
|
||||
);
|
||||
const onClosed = pipe(hideColorPicker, () => edited && tagEdited(tag, newTagName, color));
|
||||
const onClosed = pipe(hideColorPicker, () => edited && tagEdited({ oldName: tag, newName: newTagName, color }));
|
||||
|
||||
return (
|
||||
<Modal isOpen={isOpen} toggle={toggle} centered onClosed={onClosed}>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { pick } from 'ramda';
|
||||
import { PayloadAction } from '@reduxjs/toolkit';
|
||||
import { createAction, PayloadAction } from '@reduxjs/toolkit';
|
||||
import { Dispatch } from 'redux';
|
||||
import { buildReducer } from '../../utils/helpers/redux';
|
||||
import { GetState } from '../../container/types';
|
||||
|
@ -23,7 +23,7 @@ export interface TagEdition {
|
|||
errorData?: ProblemDetailsError;
|
||||
}
|
||||
|
||||
interface EditTag {
|
||||
export interface EditTag {
|
||||
oldName: string;
|
||||
newName: string;
|
||||
color: string;
|
||||
|
@ -49,9 +49,7 @@ export default buildReducer<TagEdition, EditTagAction & ApiErrorAction>({
|
|||
}, initialState);
|
||||
|
||||
export const editTag = (buildShlinkApiClient: ShlinkApiClientBuilder, colorGenerator: ColorGenerator) => (
|
||||
oldName: string,
|
||||
newName: string,
|
||||
color: string,
|
||||
{ oldName, newName, color }: EditTag,
|
||||
) => async (dispatch: Dispatch, getState: GetState) => {
|
||||
dispatch({ type: EDIT_TAG_START });
|
||||
const { editTag: shlinkEditTag } = buildShlinkApiClient(getState);
|
||||
|
@ -70,11 +68,4 @@ export const editTag = (buildShlinkApiClient: ShlinkApiClientBuilder, colorGener
|
|||
}
|
||||
};
|
||||
|
||||
export const tagEdited = (oldName: string, newName: string, color: string): EditTagAction => ({
|
||||
type: TAG_EDITED,
|
||||
payload: {
|
||||
oldName,
|
||||
newName,
|
||||
color,
|
||||
},
|
||||
});
|
||||
export const tagEdited = createAction<EditTag>(TAG_EDITED);
|
||||
|
|
|
@ -11,7 +11,7 @@ import { TagStats } from '../data';
|
|||
import { ApiErrorAction } from '../../api/types/actions';
|
||||
import { CREATE_SHORT_URL, CreateShortUrlAction } from '../../short-urls/reducers/shortUrlCreation';
|
||||
import { DeleteTagAction, TAG_DELETED } from './tagDelete';
|
||||
import { EditTagAction, TAG_EDITED } from './tagEdit';
|
||||
import { EditTagAction, tagEdited } from './tagEdit';
|
||||
import { ProblemDetailsError } from '../../api/types/errors';
|
||||
|
||||
export const LIST_TAGS_START = 'shlink/tagsList/LIST_TAGS_START';
|
||||
|
@ -90,7 +90,7 @@ export default buildReducer<TagsList, TagsCombinedAction>({
|
|||
tags: rejectTag(state.tags, tag),
|
||||
filteredTags: rejectTag(state.filteredTags, tag),
|
||||
}),
|
||||
[TAG_EDITED]: (state, { payload }) => ({
|
||||
[tagEdited.toString()]: (state, { payload }) => ({
|
||||
...state,
|
||||
tags: state.tags.map(renameTag(payload.oldName, payload.newName)).sort(),
|
||||
filteredTags: state.filteredTags.map(renameTag(payload.oldName, payload.newName)).sort(),
|
||||
|
|
|
@ -50,7 +50,7 @@ describe('tagEditReducer', () => {
|
|||
|
||||
describe('tagEdited', () => {
|
||||
it('returns action based on provided params', () =>
|
||||
expect(tagEdited('foo', 'bar', '#ff0000')).toEqual({
|
||||
expect(tagEdited({ oldName: 'foo', newName: 'bar', color: '#ff0000' })).toEqual({
|
||||
type: TAG_EDITED,
|
||||
payload: {
|
||||
oldName: 'foo',
|
||||
|
@ -74,7 +74,7 @@ describe('tagEditReducer', () => {
|
|||
|
||||
it('calls API on success', async () => {
|
||||
const apiClientMock = createApiClientMock(Promise.resolve());
|
||||
const dispatchable = editTag(() => apiClientMock, colorGenerator)(oldName, newName, color);
|
||||
const dispatchable = editTag(() => apiClientMock, colorGenerator)({ oldName, newName, color });
|
||||
|
||||
await dispatchable(dispatch, getState);
|
||||
|
||||
|
@ -95,7 +95,7 @@ describe('tagEditReducer', () => {
|
|||
it('throws on error', async () => {
|
||||
const error = 'Error';
|
||||
const apiClientMock = createApiClientMock(Promise.reject(error));
|
||||
const dispatchable = editTag(() => apiClientMock, colorGenerator)(oldName, newName, color);
|
||||
const dispatchable = editTag(() => apiClientMock, colorGenerator)({ oldName, newName, color });
|
||||
|
||||
try {
|
||||
await dispatchable(dispatch, getState);
|
||||
|
|
Loading…
Reference in a new issue