Added provision for adding multiple tags by using commas

This commit is contained in:
Pranab Singh 2019-10-09 02:10:10 +05:30 committed by Sean Yesmunt
parent c88bb04f08
commit 8c4c5709c6
5 changed files with 37 additions and 24 deletions

View file

@ -3,7 +3,7 @@ import React, { useState } from 'react';
import { Form, FormField } from 'component/common/form';
import Button from 'component/button';
import SelectAsset from 'component/selectAsset';
import TagSelect from 'component/tagsSelect';
import TagsSelect from 'component/tagsSelect';
import * as PAGES from 'constants/pages';
type Props = {
@ -182,7 +182,7 @@ function ChannelForm(props: Props) {
disabled={false}
onChange={text => setParams({ ...params, description: text })}
/>
<TagSelect
<TagsSelect
title={__('Add Tags')}
suggestMature
help={__('The better your tags are, the easier it will be for people to discover your channel.')}

View file

@ -6,7 +6,7 @@ import Button from 'component/button';
import ChannelSection from 'component/selectChannel';
import classnames from 'classnames';
import UnsupportedOnWeb from 'component/common/unsupported-on-web';
import TagSelect from 'component/tagsSelect';
import TagsSelect from 'component/tagsSelect';
import PublishText from 'component/publishText';
import PublishPrice from 'component/publishPrice';
import PublishFile from 'component/publishFile';
@ -130,7 +130,7 @@ function PublishForm(props: Props) {
<PublishText disabled={formDisabled} />
<Card actions={<SelectThumbnail />} />
<TagSelect
<TagsSelect
title={__('Add Tags')}
suggestMature
help={__('The better your tags are, the easier it will be for people to discover your content.')}

View file

@ -34,7 +34,12 @@ export default function TagsSearch(props: Props) {
tags.unshift({ name: newTag });
}
const doesTagMatch = name => (newTag ? name.toLowerCase().includes(newTag.toLowerCase()) : true);
const doesTagMatch = name => {
let nextTag;
nextTag = newTag.substr(newTag.lastIndexOf(',') + 1, newTag.length);
nextTag = newTag.substr(newTag.lastIndexOf(' ') + 1, newTag.length);
return newTag ? name.toLowerCase().includes(nextTag.toLowerCase()) : true;
};
// Make sure there are no duplicates, then trim
const suggestedTagsSet = new Set(tags.map(tag => tag.name));
const suggestedTags = Array.from(suggestedTagsSet)
@ -51,32 +56,40 @@ export default function TagsSearch(props: Props) {
function handleSubmit(e) {
e.preventDefault();
const trimmedTag = newTag.trim();
let tags = newTag.trim();
if (trimmedTag.length === 0) {
if (tags.length === 0) {
return;
}
setNewTag('');
if (onSelect) {
onSelect({ name: trimmedTag });
} else {
if (!unfollowedTags.map(({ name }) => name).includes(trimmedTag)) {
doAddTag(trimmedTag);
}
if (!followedTags.map(({ name }) => name).includes(trimmedTag)) {
doToggleTagFollow(trimmedTag);
tags = tags.split(',').map(newTag => newTag.trim());
tags.forEach(tag => {
if (onSelect) {
onSelect({ name: tag });
} else {
if (!unfollowedTags.map(({ name }) => name).includes(tag)) {
doAddTag(tag);
}
if (!followedTags.map(({ name }) => name).includes(tag)) {
doToggleTagFollow(tag);
}
}
}
});
}
function handleTagClick(tag) {
if (onSelect) {
onSelect({ name: tag });
} else {
doToggleTagFollow(tag);
}
function handleTagClick(tags) {
tags = tags.split(',').map(newTag => newTag.trim());
tags.forEach(tag => {
if (onSelect) {
onSelect({ name: tag });
} else {
doToggleTagFollow(tag);
}
});
}
return (

View file

@ -23,7 +23,7 @@ type Props = {
placeholder?: string,
};
export default function TagSelect(props: Props) {
export default function TagsSelect(props: Props) {
const {
showClose,
followedTags,

View file

@ -792,4 +792,4 @@
"Create": "Create",
"You have no rewards available.": "You have no rewards available.",
"URL does not include name.": "URL does not include name."
}
}