Improved handling of short URL deletion errors

This commit is contained in:
Alejandro Celaya 2020-12-21 21:02:30 +01:00
parent 54b1ab12cd
commit f69f791790
2 changed files with 15 additions and 11 deletions

View file

@ -5,8 +5,7 @@ import { ShortUrlDeletion } from '../reducers/shortUrlDeletion';
import { ShortUrlModalProps } from '../data';
import { handleEventPreventingDefault, OptionalString } from '../../utils/utils';
import { Result } from '../../utils/Result';
const THRESHOLD_REACHED = 'INVALID_SHORTCODE_DELETION';
import { isInvalidDeletionError } from '../../utils/services/types';
interface DeleteShortUrlModalConnectProps extends ShortUrlModalProps {
shortUrlDeletion: ShortUrlDeletion;
@ -22,9 +21,6 @@ const DeleteShortUrlModal = (
useEffect(() => resetDeleteShortUrl, []);
const { error, errorData } = shortUrlDeletion;
const errorCode = error && errorData?.type;
const hasThresholdError = errorCode === THRESHOLD_REACHED;
const hasErrorOtherThanThreshold = error && errorCode !== THRESHOLD_REACHED;
const close = pipe(resetDeleteShortUrl, toggle);
const handleDeleteUrl = handleEventPreventingDefault(() => {
const { shortCode, domain } = shortUrl;
@ -53,15 +49,15 @@ const DeleteShortUrlModal = (
onChange={(e) => setInputValue(e.target.value)}
/>
{hasThresholdError && (
{error && isInvalidDeletionError(errorData) && (
<Result type="warning" small className="mt-2">
{errorData?.threshold && `This short URL has received more than ${errorData.threshold} visits, and therefore, it cannot be deleted.`}
{!errorData?.threshold && 'This short URL has received too many visits, and therefore, it cannot be deleted.'}
{errorData.threshold && `This short URL has received more than ${errorData.threshold} visits, and therefore, it cannot be deleted.`}
{!errorData.threshold && 'This short URL has received too many visits, and therefore, it cannot be deleted.'}
</Result>
)}
{hasErrorOtherThanThreshold && (
{error && !isInvalidDeletionError(errorData) && (
<Result type="error" small className="mt-2">
Something went wrong while deleting the URL :(
{errorData?.detail ?? 'Something went wrong while deleting the URL :('}
</Result>
)}
</ModalBody>

View file

@ -77,10 +77,18 @@ export interface ProblemDetailsError {
[extraProps: string]: any;
}
export interface InvalidArgumentError extends ProblemDetailsError {
interface InvalidArgumentError extends ProblemDetailsError {
type: 'INVALID_ARGUMENT';
invalidElements: string[];
}
interface InvalidShortUrlDeletion extends ProblemDetailsError {
type: 'INVALID_SHORTCODE_DELETION';
threshold?: number;
}
export const isInvalidArgumentError = (error?: ProblemDetailsError): error is InvalidArgumentError =>
error?.type === 'INVALID_ARGUMENT';
export const isInvalidDeletionError = (error?: ProblemDetailsError): error is InvalidShortUrlDeletion =>
error?.type === 'INVALID_SHORTCODE_DELETION';