From 5ef719c592de8bbeba289a9181a05a6a44075ae6 Mon Sep 17 00:00:00 2001 From: Alejandro Celaya Date: Wed, 23 Jun 2021 19:52:19 +0200 Subject: [PATCH 1/3] Added support to set crawlable short URLs during creation and edition --- src/short-urls/EditShortUrl.tsx | 1 + src/short-urls/ShortUrlForm.tsx | 38 ++++++++++-------- src/short-urls/data/index.ts | 2 + .../helpers/ShortUrlFormCheckboxGroup.tsx | 39 +++++++++++++++++++ src/utils/helpers/features.ts | 2 + 5 files changed, 65 insertions(+), 17 deletions(-) create mode 100644 src/short-urls/helpers/ShortUrlFormCheckboxGroup.tsx diff --git a/src/short-urls/EditShortUrl.tsx b/src/short-urls/EditShortUrl.tsx index fdcec096..56151bfa 100644 --- a/src/short-urls/EditShortUrl.tsx +++ b/src/short-urls/EditShortUrl.tsx @@ -41,6 +41,7 @@ const getInitialState = (shortUrl?: ShortUrl, settings?: ShortUrlCreationSetting validSince: shortUrl.meta.validSince ?? undefined, validUntil: shortUrl.meta.validUntil ?? undefined, maxVisits: shortUrl.meta.maxVisits ?? undefined, + crawlable: shortUrl.crawlable, validateUrl, }; }; diff --git a/src/short-urls/ShortUrlForm.tsx b/src/short-urls/ShortUrlForm.tsx index 51714bbc..e30b6c7a 100644 --- a/src/short-urls/ShortUrlForm.tsx +++ b/src/short-urls/ShortUrlForm.tsx @@ -6,6 +6,7 @@ import m from 'moment'; import classNames from 'classnames'; import DateInput, { DateInputProps } from '../utils/DateInput'; import { + supportsCrawlableVisits, supportsListingDomains, supportsSettingShortCodeLength, supportsShortUrlTitle, @@ -20,6 +21,7 @@ import { DomainSelectorProps } from '../domains/DomainSelector'; import { formatIsoDate } from '../utils/helpers/date'; import UseExistingIfFoundInfoIcon from './UseExistingIfFoundInfoIcon'; import { ShortUrlData } from './data'; +import { ShortUrlFormCheckboxGroup } from './helpers/ShortUrlFormCheckboxGroup'; import './ShortUrlForm.scss'; export type Mode = 'create' | 'create-basic' | 'edit'; @@ -108,7 +110,8 @@ export const ShortUrlForm = ( 'col-sm-12': !showCustomizeCard, }); const showValidateUrl = supportsValidateUrl(selectedServer); - const showExtraValidationsCard = showValidateUrl || !isEdit; + const showCrawlableControl = supportsCrawlableVisits(selectedServer); + const showExtraValidationsCard = showValidateUrl || showCrawlableControl || !isEdit; return (
@@ -167,23 +170,24 @@ export const ShortUrlForm = ( {showExtraValidationsCard && ( - - {!isEdit && ( -

- Make sure the long URL is valid, or ensure an existing short URL is returned if it matches all - provided data. -

- )} + {showValidateUrl && ( -

- setShortUrlData({ ...shortUrlData, validateUrl })} - > - Validate URL - -

+ setShortUrlData({ ...shortUrlData, validateUrl })} + > + Validate URL + + )} + {showCrawlableControl && ( + setShortUrlData({ ...shortUrlData, crawlable })} + > + Make it crawlable + )} {!isEdit && (

diff --git a/src/short-urls/data/index.ts b/src/short-urls/data/index.ts index c3e5dfea..341f7e8f 100644 --- a/src/short-urls/data/index.ts +++ b/src/short-urls/data/index.ts @@ -9,6 +9,7 @@ export interface EditShortUrlData { validUntil?: m.Moment | string | null; maxVisits?: number | null; validateUrl?: boolean; + crawlable?: boolean; } export interface ShortUrlData extends EditShortUrlData { @@ -29,6 +30,7 @@ export interface ShortUrl { tags: string[]; domain: string | null; title?: string | null; + crawlable?: boolean; } export interface ShortUrlMeta { diff --git a/src/short-urls/helpers/ShortUrlFormCheckboxGroup.tsx b/src/short-urls/helpers/ShortUrlFormCheckboxGroup.tsx new file mode 100644 index 00000000..91dff0bc --- /dev/null +++ b/src/short-urls/helpers/ShortUrlFormCheckboxGroup.tsx @@ -0,0 +1,39 @@ +import { ChangeEvent, FC, useRef } from 'react'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faInfoCircle as infoIcon } from '@fortawesome/free-solid-svg-icons'; +import { UncontrolledTooltip } from 'reactstrap'; +import Checkbox from '../../utils/Checkbox'; + +interface ShortUrlFormCheckboxGroupProps { + checked?: boolean; + onChange?: (checked: boolean, e: ChangeEvent) => void; + infoTooltip?: string; +} + +const InfoTooltip: FC<{ tooltip: string }> = ({ tooltip }) => { + const ref = useRef(); + + return ( + <> + { + ref.current = el; + }} + > + + + ref.current) as any} placement="right">{tooltip} + + ); +}; + +export const ShortUrlFormCheckboxGroup: FC = ( + { children, infoTooltip, checked, onChange }, +) => ( +

+ + {children} + + {infoTooltip && } +

+); diff --git a/src/utils/helpers/features.ts b/src/utils/helpers/features.ts index 4d7633df..9eb314f2 100644 --- a/src/utils/helpers/features.ts +++ b/src/utils/helpers/features.ts @@ -25,3 +25,5 @@ export const supportsQrCodeMargin = supportsShortUrlTitle; export const supportsTagsInPatch = supportsShortUrlTitle; export const supportsBotVisits = serverMatchesVersions({ minVersion: '2.7.0' }); + +export const supportsCrawlableVisits = supportsBotVisits; From 55716a8f7f05fe25513598d3c4d6e587830b6869 Mon Sep 17 00:00:00 2001 From: Alejandro Celaya Date: Wed, 23 Jun 2021 19:59:06 +0200 Subject: [PATCH 2/3] Created ShortUrlFormCheckboxGroup test --- .../helpers/ShortUrlFormCheckboxGroup.test.tsx | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 test/short-urls/helpers/ShortUrlFormCheckboxGroup.test.tsx diff --git a/test/short-urls/helpers/ShortUrlFormCheckboxGroup.test.tsx b/test/short-urls/helpers/ShortUrlFormCheckboxGroup.test.tsx new file mode 100644 index 00000000..76df7496 --- /dev/null +++ b/test/short-urls/helpers/ShortUrlFormCheckboxGroup.test.tsx @@ -0,0 +1,16 @@ +import { shallow } from 'enzyme'; +import { ShortUrlFormCheckboxGroup } from '../../../src/short-urls/helpers/ShortUrlFormCheckboxGroup'; +import Checkbox from '../../../src/utils/Checkbox'; + +describe('', () => { + test.each([ + [ undefined, '', 0 ], + [ 'This is the tooltip', 'mr-2', 1 ], + ])('renders tooltip only when provided', (infoTooltip, expectedClassName, expectedAmountOfTooltips) => { + const wrapper = shallow(); + const checkbox = wrapper.find(Checkbox); + + expect(checkbox.prop('className')).toEqual(expectedClassName); + expect(wrapper.find('InfoTooltip')).toHaveLength(expectedAmountOfTooltips); + }); +}); From d718329b52e09822c9fbe7ec1a55a5a5820077f2 Mon Sep 17 00:00:00 2001 From: Alejandro Celaya Date: Wed, 23 Jun 2021 19:59:47 +0200 Subject: [PATCH 3/3] Updated changelog --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 522ddf62..065c3ce6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), * [#432](https://github.com/shlinkio/shlink-web-client/pull/432) Added support to provide the `servers.json` file inside a a `conf.d` folder. * [#440](https://github.com/shlinkio/shlink-web-client/pull/440) Added hint of what visits come potentially from a bot, in the visits table, when consuming Shlink >=2.7. * [#431](https://github.com/shlinkio/shlink-web-client/pull/431) Added support to filter out visits from potential bots in visits sections, when consuming Shlink >=2.7. +* [#430](https://github.com/shlinkio/shlink-web-client/pull/430) Added support to set new and existing short URLs as crawlable, when consuming Shlink >=2.7. ### Changed * *Nothing*