Merge pull request #467 from acelaya-forks/feature/comma-separated-tags

Feature/comma separated tags
This commit is contained in:
Alejandro Celaya 2021-08-15 09:54:57 +02:00 committed by GitHub
commit 590393dcfd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 4 deletions

View file

@ -7,6 +7,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
## [Unreleased]
### Added
* [#460](https://github.com/shlinkio/shlink-web-client/pull/460) Added dynamic title on hover for tags with a very long title.
* [#462](https://github.com/shlinkio/shlink-web-client/pull/462) Now it is possible to paste multiple comma-separated tags in the tags selector, making all of them to be added as individual tags.
### Changed
* *Nothing*

View file

@ -44,13 +44,18 @@ const TagsSelector = (colorGenerator: ColorGenerator) => (
addOnBlur
placeholderText={placeholder}
minQueryLength={1}
delimiters={[ 'Enter', 'Tab', ',' ]}
onDelete={(removedTagIndex) => {
const tagsCopy = [ ...selectedTags ];
tagsCopy.splice(removedTagIndex, 1);
onChange(tagsCopy);
}}
onAddition={({ name: newTag }) => onChange([ ...selectedTags, newTag.toLowerCase() ])}
onAddition={({ name: newTag }) => onChange(
// * Avoid duplicated tags (thanks to the Set),
// * Split any of the new tags by comma, allowing to paste multiple comma-separated tags at once.
[ ...new Set([ ...selectedTags, ...newTag.toLowerCase().split(',') ]) ],
)}
/>
);
};

View file

@ -49,10 +49,14 @@ describe('<TagsSelector />', () => {
]);
});
it('invokes onChange when new tags are added', () => {
wrapper.simulate('addition', { name: 'The-New-Tag' });
it.each([
[ 'The-New-Tag', [ ...tags, 'the-new-tag' ]],
[ 'comma,separated,tags', [ ...tags, 'comma', 'separated', 'tags' ]],
[ 'foo', tags ],
])('invokes onChange when new tags are added', (newTag, expectedTags) => {
wrapper.simulate('addition', { name: newTag });
expect(onChange).toHaveBeenCalledWith([ ...tags, 'the-new-tag' ]);
expect(onChange).toHaveBeenCalledWith(expectedTags);
});
it.each([