Added flag on short URL creation which tells if the short URL was already saved

This commit is contained in:
Alejandro Celaya 2022-11-07 18:24:26 +01:00
parent ae1d39bede
commit 4ca31fc162
9 changed files with 23 additions and 19 deletions

View file

@ -21,7 +21,7 @@ export interface ShlinkState {
servers: ServersMap; servers: ServersMap;
selectedServer: SelectedServer; selectedServer: SelectedServer;
shortUrlsList: ShortUrlsList; shortUrlsList: ShortUrlsList;
shortUrlCreationResult: ShortUrlCreation; shortUrlCreation: ShortUrlCreation;
shortUrlDeletion: ShortUrlDeletion; shortUrlDeletion: ShortUrlDeletion;
shortUrlEdition: ShortUrlEdition; shortUrlEdition: ShortUrlEdition;
shortUrlVisits: ShortUrlVisits; shortUrlVisits: ShortUrlVisits;

View file

@ -21,7 +21,7 @@ export default (container: IContainer) => combineReducers<ShlinkState>({
servers: serversReducer, servers: serversReducer,
selectedServer: selectedServerReducer, selectedServer: selectedServerReducer,
shortUrlsList: shortUrlsListReducer, shortUrlsList: shortUrlsListReducer,
shortUrlCreationResult: container.shortUrlCreationReducer, shortUrlCreation: container.shortUrlCreationReducer,
shortUrlDeletion: container.shortUrlDeletionReducer, shortUrlDeletion: container.shortUrlDeletionReducer,
shortUrlEdition: container.shortUrlEditionReducer, shortUrlEdition: container.shortUrlEditionReducer,
shortUrlDetail: container.shortUrlDetailReducer, shortUrlDetail: container.shortUrlDetailReducer,

View file

@ -12,7 +12,7 @@ export interface CreateShortUrlProps {
interface CreateShortUrlConnectProps extends CreateShortUrlProps { interface CreateShortUrlConnectProps extends CreateShortUrlProps {
settings: Settings; settings: Settings;
shortUrlCreationResult: ShortUrlCreation; shortUrlCreation: ShortUrlCreation;
selectedServer: SelectedServer; selectedServer: SelectedServer;
createShortUrl: (data: ShortUrlData) => Promise<void>; createShortUrl: (data: ShortUrlData) => Promise<void>;
resetCreateShortUrl: () => void; resetCreateShortUrl: () => void;
@ -38,7 +38,7 @@ export const CreateShortUrl = (
CreateShortUrlResult: FC<CreateShortUrlResultProps>, CreateShortUrlResult: FC<CreateShortUrlResultProps>,
) => ({ ) => ({
createShortUrl, createShortUrl,
shortUrlCreationResult, shortUrlCreation,
resetCreateShortUrl, resetCreateShortUrl,
selectedServer, selectedServer,
basicMode = false, basicMode = false,
@ -50,7 +50,7 @@ export const CreateShortUrl = (
<> <>
<ShortUrlForm <ShortUrlForm
initialState={initialState} initialState={initialState}
saving={shortUrlCreationResult.saving} saving={shortUrlCreation.saving}
selectedServer={selectedServer} selectedServer={selectedServer}
mode={basicMode ? 'create-basic' : 'create'} mode={basicMode ? 'create-basic' : 'create'}
onSave={async (data: ShortUrlData) => { onSave={async (data: ShortUrlData) => {
@ -59,7 +59,7 @@ export const CreateShortUrl = (
}} }}
/> />
<CreateShortUrlResult <CreateShortUrlResult
{...shortUrlCreationResult} {...shortUrlCreation}
resetCreateShortUrl={resetCreateShortUrl} resetCreateShortUrl={resetCreateShortUrl}
canBeClosed={basicMode} canBeClosed={basicMode}
/> />

View file

@ -1,7 +1,6 @@
import { faCopy as copyIcon } from '@fortawesome/free-regular-svg-icons'; import { faCopy as copyIcon } from '@fortawesome/free-regular-svg-icons';
import { faTimes as closeIcon } from '@fortawesome/free-solid-svg-icons'; import { faTimes as closeIcon } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { isNil } from 'ramda';
import { useEffect } from 'react'; import { useEffect } from 'react';
import CopyToClipboard from 'react-copy-to-clipboard'; import CopyToClipboard from 'react-copy-to-clipboard';
import { Tooltip } from 'reactstrap'; import { Tooltip } from 'reactstrap';
@ -34,7 +33,7 @@ export const CreateShortUrlResult = (useTimeoutToggle: TimeoutToggle) => (
); );
} }
if (isNil(result)) { if (!result) {
return null; return null;
} }

View file

@ -8,8 +8,9 @@ import { ProblemDetailsError } from '../../api/types/errors';
export const CREATE_SHORT_URL = 'shlink/createShortUrl/CREATE_SHORT_URL'; export const CREATE_SHORT_URL = 'shlink/createShortUrl/CREATE_SHORT_URL';
export interface ShortUrlCreation { export interface ShortUrlCreation {
result: ShortUrl | null; result?: ShortUrl;
saving: boolean; saving: boolean;
saved: boolean;
error: boolean; error: boolean;
errorData?: ProblemDetailsError; errorData?: ProblemDetailsError;
} }
@ -17,8 +18,8 @@ export interface ShortUrlCreation {
export type CreateShortUrlAction = PayloadAction<ShortUrl>; export type CreateShortUrlAction = PayloadAction<ShortUrl>;
const initialState: ShortUrlCreation = { const initialState: ShortUrlCreation = {
result: null,
saving: false, saving: false,
saved: false,
error: false, error: false,
}; };
@ -35,12 +36,15 @@ export const shortUrlCreationReducerCreator = (buildShlinkApiClient: ShlinkApiCl
resetCreateShortUrl: () => initialState, resetCreateShortUrl: () => initialState,
}, },
extraReducers: (builder) => { extraReducers: (builder) => {
builder.addCase(createShortUrl.pending, (state) => ({ ...state, saving: true, error: false })); builder.addCase(createShortUrl.pending, (state) => ({ ...state, saving: true, saved: false, error: false }));
builder.addCase( builder.addCase(
createShortUrl.rejected, createShortUrl.rejected,
(state, { error }) => ({ ...state, saving: false, error: true, errorData: parseApiError(error) }), (state, { error }) => ({ ...state, saving: false, saved: false, error: true, errorData: parseApiError(error) }),
);
builder.addCase(
createShortUrl.fulfilled,
(_, { payload: result }) => ({ result, saving: false, saved: true, error: false }),
); );
builder.addCase(createShortUrl.fulfilled, (_, { payload: result }) => ({ result, saving: false, error: false }));
}, },
}); });

View file

@ -10,8 +10,8 @@ export const SHORT_URL_EDITED = 'shlink/shortUrlEdition/SHORT_URL_EDITED';
export interface ShortUrlEdition { export interface ShortUrlEdition {
shortUrl?: ShortUrl; shortUrl?: ShortUrl;
saving: boolean; saving: boolean;
error: boolean;
saved: boolean; saved: boolean;
error: boolean;
errorData?: ProblemDetailsError; errorData?: ProblemDetailsError;
} }

View file

@ -36,7 +36,7 @@ const provideServices = (bottle: Bottle, connect: ConnectDecorator) => {
bottle.serviceFactory('CreateShortUrl', CreateShortUrl, 'ShortUrlForm', 'CreateShortUrlResult'); bottle.serviceFactory('CreateShortUrl', CreateShortUrl, 'ShortUrlForm', 'CreateShortUrlResult');
bottle.decorator( bottle.decorator(
'CreateShortUrl', 'CreateShortUrl',
connect(['shortUrlCreationResult', 'selectedServer', 'settings'], ['createShortUrl', 'resetCreateShortUrl']), connect(['shortUrlCreation', 'selectedServer', 'settings'], ['createShortUrl', 'resetCreateShortUrl']),
); );
bottle.serviceFactory('EditShortUrl', EditShortUrl, 'ShortUrlForm'); bottle.serviceFactory('EditShortUrl', EditShortUrl, 'ShortUrlForm');

View file

@ -13,7 +13,7 @@ describe('<CreateShortUrl />', () => {
const CreateShortUrl = createShortUrlsCreator(ShortUrlForm, CreateShortUrlResult); const CreateShortUrl = createShortUrlsCreator(ShortUrlForm, CreateShortUrlResult);
const setUp = () => render( const setUp = () => render(
<CreateShortUrl <CreateShortUrl
shortUrlCreationResult={shortUrlCreationResult} shortUrlCreation={shortUrlCreationResult}
createShortUrl={createShortUrl} createShortUrl={createShortUrl}
selectedServer={null} selectedServer={null}
resetCreateShortUrl={() => {}} resetCreateShortUrl={() => {}}

View file

@ -22,16 +22,16 @@ describe('shortUrlCreationReducer', () => {
it('returns loading on CREATE_SHORT_URL_START', () => { it('returns loading on CREATE_SHORT_URL_START', () => {
expect(reducer(undefined, action(createShortUrl.pending.toString()))).toEqual({ expect(reducer(undefined, action(createShortUrl.pending.toString()))).toEqual({
result: null,
saving: true, saving: true,
saved: false,
error: false, error: false,
}); });
}); });
it('returns error on CREATE_SHORT_URL_ERROR', () => { it('returns error on CREATE_SHORT_URL_ERROR', () => {
expect(reducer(undefined, action(createShortUrl.rejected.toString()))).toEqual({ expect(reducer(undefined, action(createShortUrl.rejected.toString()))).toEqual({
result: null,
saving: false, saving: false,
saved: false,
error: true, error: true,
}); });
}); });
@ -40,14 +40,15 @@ describe('shortUrlCreationReducer', () => {
expect(reducer(undefined, action(createShortUrl.fulfilled.toString(), { payload: shortUrl }))).toEqual({ expect(reducer(undefined, action(createShortUrl.fulfilled.toString(), { payload: shortUrl }))).toEqual({
result: shortUrl, result: shortUrl,
saving: false, saving: false,
saved: true,
error: false, error: false,
}); });
}); });
it('returns default state on RESET_CREATE_SHORT_URL', () => { it('returns default state on RESET_CREATE_SHORT_URL', () => {
expect(reducer(undefined, action(resetCreateShortUrl.toString()))).toEqual({ expect(reducer(undefined, action(resetCreateShortUrl.toString()))).toEqual({
result: null,
saving: false, saving: false,
saved: false,
error: false, error: false,
}); });
}); });