mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-23 17:40:23 +03:00
Added flag on short URL creation which tells if the short URL was already saved
This commit is contained in:
parent
ae1d39bede
commit
4ca31fc162
9 changed files with 23 additions and 19 deletions
|
@ -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;
|
||||||
|
|
|
@ -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,
|
||||||
|
|
|
@ -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}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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 }));
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -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;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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');
|
||||||
|
|
|
@ -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={() => {}}
|
||||||
|
|
|
@ -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,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue