diff --git a/CHANGELOG.md b/CHANGELOG.md
index f3a19b08..df4e8429 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -8,7 +8,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
#### Added
-* *Nothing*
+* [#101](https://github.com/shlinkio/shlink-web-client/issues/101) Added checkbox to short URL creation form that allows to determine the value of the `findIfExists` flag introduced in Shlink v1.16.0.
#### Changed
diff --git a/package.json b/package.json
index 29cb437b..bdb53a80 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
"react-router-dom": "^4.2.2",
"react-swipeable": "^4.3.0",
"react-tagsinput": "^3.19.0",
- "reactstrap": "^6.0.1",
+ "reactstrap": "^7.1.0",
"redux": "^4.0.0",
"redux-actions": "^2.6.5",
"redux-thunk": "^2.3.0",
diff --git a/src/short-urls/CreateShortUrl.js b/src/short-urls/CreateShortUrl.js
index 89838947..38d1d4be 100644
--- a/src/short-urls/CreateShortUrl.js
+++ b/src/short-urls/CreateShortUrl.js
@@ -5,7 +5,9 @@ import React from 'react';
import { Collapse } from 'reactstrap';
import * as PropTypes from 'prop-types';
import DateInput from '../utils/DateInput';
+import Checkbox from '../utils/Checkbox';
import { createShortUrlResultType } from './reducers/shortUrlCreation';
+import UseExistingIfFoundInfoIcon from './UseExistingIfFoundInfoIcon';
const normalizeTag = pipe(trim, replace(/ /g, '-'));
const formatDate = (date) => isNil(date) ? date : date.format();
@@ -24,6 +26,7 @@ const CreateShortUrl = (TagsSelector, CreateShortUrlResult) => class CreateShort
validSince: undefined,
validUntil: undefined,
maxVisits: undefined,
+ findIfExists: false,
moreOptionsVisible: false,
};
@@ -93,22 +96,30 @@ const CreateShortUrl = (TagsSelector, CreateShortUrlResult) => class CreateShort
{renderDateInput('validUntil', 'Enabled until...', { minDate: this.state.validSince })}
+
+
+ this.setState({ findIfExists })}
+ >
+ Use existing URL if found
+
+
+
-
diff --git a/src/short-urls/UseExistingIfFoundInfoIcon.js b/src/short-urls/UseExistingIfFoundInfoIcon.js
new file mode 100644
index 00000000..7e155ac4
--- /dev/null
+++ b/src/short-urls/UseExistingIfFoundInfoIcon.js
@@ -0,0 +1,56 @@
+import React from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons';
+import { Modal, ModalBody, ModalHeader } from 'reactstrap';
+import './UseExistingIfFoundInfoIcon.scss';
+import { useToggle } from '../utils/utils';
+
+const renderInfoModal = (isOpen, toggle) => (
+
+ Info
+
+
+ When the
+ "Use existing URL if found"
+ checkbox is checked, the server will return an existing short URL if it matches provided params.
+
+
+ These are the checks performed by Shlink in order to determine if an existing short URL should be returned:
+
+
+
+ When only the long URL is provided: The most recent match will be returned, or a new short URL will be created
+ if none is found
+
+
+ When long URL and custom slug are provided: Same as in previous case, but it will try to match the short URL
+ using both the long URL and the slug.
+
+ If the slug is being used by another long URL, an error will be returned.
+
+
+ When other params are provided: Same as in previous cases, but it will try to match existing short URLs with
+ all provided data. If any of them does not match, a new short URL will be created
+
+
+
+ Important: This feature will be ignored while using a Shlink version older than v1.16.0.
+