|
|
@ -16,6 +16,7 @@ import { inputTypes, kinds, sizes } from 'Helpers/Props';
|
|
|
|
import Series from 'Series/Series';
|
|
|
|
import Series from 'Series/Series';
|
|
|
|
import createAllSeriesSelector from 'Store/Selectors/createAllSeriesSelector';
|
|
|
|
import createAllSeriesSelector from 'Store/Selectors/createAllSeriesSelector';
|
|
|
|
import createTagsSelector from 'Store/Selectors/createTagsSelector';
|
|
|
|
import createTagsSelector from 'Store/Selectors/createTagsSelector';
|
|
|
|
|
|
|
|
import translate from 'Utilities/String/translate';
|
|
|
|
import styles from './TagsModalContent.css';
|
|
|
|
import styles from './TagsModalContent.css';
|
|
|
|
|
|
|
|
|
|
|
|
interface TagsModalContentProps {
|
|
|
|
interface TagsModalContentProps {
|
|
|
@ -73,12 +74,12 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<ModalContent onModalClose={onModalClose}>
|
|
|
|
<ModalContent onModalClose={onModalClose}>
|
|
|
|
<ModalHeader>Tags</ModalHeader>
|
|
|
|
<ModalHeader>{translate('Tags')}</ModalHeader>
|
|
|
|
|
|
|
|
|
|
|
|
<ModalBody>
|
|
|
|
<ModalBody>
|
|
|
|
<Form>
|
|
|
|
<Form>
|
|
|
|
<FormGroup>
|
|
|
|
<FormGroup>
|
|
|
|
<FormLabel>Tags</FormLabel>
|
|
|
|
<FormLabel>{translate('Tags')}</FormLabel>
|
|
|
|
|
|
|
|
|
|
|
|
<FormInputGroup
|
|
|
|
<FormInputGroup
|
|
|
|
type={inputTypes.TAG}
|
|
|
|
type={inputTypes.TAG}
|
|
|
@ -89,7 +90,7 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
</FormGroup>
|
|
|
|
</FormGroup>
|
|
|
|
|
|
|
|
|
|
|
|
<FormGroup>
|
|
|
|
<FormGroup>
|
|
|
|
<FormLabel>Apply Tags</FormLabel>
|
|
|
|
<FormLabel>{translate('ApplyTags')}</FormLabel>
|
|
|
|
|
|
|
|
|
|
|
|
<FormInputGroup
|
|
|
|
<FormInputGroup
|
|
|
|
type={inputTypes.SELECT}
|
|
|
|
type={inputTypes.SELECT}
|
|
|
@ -97,17 +98,17 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
value={applyTags}
|
|
|
|
value={applyTags}
|
|
|
|
values={applyTagsOptions}
|
|
|
|
values={applyTagsOptions}
|
|
|
|
helpTexts={[
|
|
|
|
helpTexts={[
|
|
|
|
'How to apply tags to the selected series',
|
|
|
|
translate('ApplyTagsHelpTextHowToApplySeries'),
|
|
|
|
'Add: Add the tags the existing list of tags',
|
|
|
|
translate('ApplyTagsHelpTextAdd'),
|
|
|
|
'Remove: Remove the entered tags',
|
|
|
|
translate('ApplyTagsHelpTextRemove'),
|
|
|
|
'Replace: Replace the tags with the entered tags (enter no tags to clear all tags)',
|
|
|
|
translate('ApplyTagsHelpTextReplace'),
|
|
|
|
]}
|
|
|
|
]}
|
|
|
|
onChange={onApplyTagsChange}
|
|
|
|
onChange={onApplyTagsChange}
|
|
|
|
/>
|
|
|
|
/>
|
|
|
|
</FormGroup>
|
|
|
|
</FormGroup>
|
|
|
|
|
|
|
|
|
|
|
|
<FormGroup>
|
|
|
|
<FormGroup>
|
|
|
|
<FormLabel>Result</FormLabel>
|
|
|
|
<FormLabel>{translate('Result')}</FormLabel>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={styles.result}>
|
|
|
|
<div className={styles.result}>
|
|
|
|
{seriesTags.map((id) => {
|
|
|
|
{seriesTags.map((id) => {
|
|
|
@ -124,7 +125,11 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Label
|
|
|
|
<Label
|
|
|
|
key={tag.id}
|
|
|
|
key={tag.id}
|
|
|
|
title={removeTag ? 'Removing tag' : 'Existing tag'}
|
|
|
|
title={
|
|
|
|
|
|
|
|
removeTag
|
|
|
|
|
|
|
|
? translate('RemovingTag')
|
|
|
|
|
|
|
|
: translate('ExistingTag')
|
|
|
|
|
|
|
|
}
|
|
|
|
kind={removeTag ? kinds.INVERSE : kinds.INFO}
|
|
|
|
kind={removeTag ? kinds.INVERSE : kinds.INFO}
|
|
|
|
size={sizes.LARGE}
|
|
|
|
size={sizes.LARGE}
|
|
|
|
>
|
|
|
|
>
|
|
|
@ -148,7 +153,7 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Label
|
|
|
|
<Label
|
|
|
|
key={tag.id}
|
|
|
|
key={tag.id}
|
|
|
|
title={'Adding tag'}
|
|
|
|
title={translate('AddingTag')}
|
|
|
|
kind={kinds.SUCCESS}
|
|
|
|
kind={kinds.SUCCESS}
|
|
|
|
size={sizes.LARGE}
|
|
|
|
size={sizes.LARGE}
|
|
|
|
>
|
|
|
|
>
|
|
|
@ -162,10 +167,10 @@ function TagsModalContent(props: TagsModalContentProps) {
|
|
|
|
</ModalBody>
|
|
|
|
</ModalBody>
|
|
|
|
|
|
|
|
|
|
|
|
<ModalFooter>
|
|
|
|
<ModalFooter>
|
|
|
|
<Button onPress={onModalClose}>Cancel</Button>
|
|
|
|
<Button onPress={onModalClose}>{translate('Cancel')}</Button>
|
|
|
|
|
|
|
|
|
|
|
|
<Button kind={kinds.PRIMARY} onPress={onApplyPress}>
|
|
|
|
<Button kind={kinds.PRIMARY} onPress={onApplyPress}>
|
|
|
|
Apply
|
|
|
|
{translate('Apply')}
|
|
|
|
</Button>
|
|
|
|
</Button>
|
|
|
|
</ModalFooter>
|
|
|
|
</ModalFooter>
|
|
|
|
</ModalContent>
|
|
|
|
</ModalContent>
|
|
|
|