mirror of
https://github.com/Sonarr/Sonarr.git
synced 2025-04-25 06:47:09 -04:00
TagSelect field type
This commit is contained in:
parent
1d02208316
commit
09347f79c5
6 changed files with 114 additions and 3 deletions
|
@ -20,6 +20,7 @@ import SeriesTypeSelectInput from './SeriesTypeSelectInput';
|
||||||
import EnhancedSelectInput from './EnhancedSelectInput';
|
import EnhancedSelectInput from './EnhancedSelectInput';
|
||||||
import EnhancedSelectInputConnector from './EnhancedSelectInputConnector';
|
import EnhancedSelectInputConnector from './EnhancedSelectInputConnector';
|
||||||
import TagInputConnector from './TagInputConnector';
|
import TagInputConnector from './TagInputConnector';
|
||||||
|
import TagSelectInputConnector from './TagSelectInputConnector';
|
||||||
import TextTagInputConnector from './TextTagInputConnector';
|
import TextTagInputConnector from './TextTagInputConnector';
|
||||||
import TextInput from './TextInput';
|
import TextInput from './TextInput';
|
||||||
import FormInputHelpText from './FormInputHelpText';
|
import FormInputHelpText from './FormInputHelpText';
|
||||||
|
@ -84,6 +85,9 @@ function getComponent(type) {
|
||||||
case inputTypes.TEXT_TAG:
|
case inputTypes.TEXT_TAG:
|
||||||
return TextTagInputConnector;
|
return TextTagInputConnector;
|
||||||
|
|
||||||
|
case inputTypes.TAG_SELECT:
|
||||||
|
return TagSelectInputConnector;
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return TextInput;
|
return TextInput;
|
||||||
}
|
}
|
||||||
|
|
|
@ -29,6 +29,8 @@ function getType({ type, selectOptionsProviderAction }) {
|
||||||
return inputTypes.SELECT;
|
return inputTypes.SELECT;
|
||||||
case 'tag':
|
case 'tag':
|
||||||
return inputTypes.TEXT_TAG;
|
return inputTypes.TEXT_TAG;
|
||||||
|
case 'tagSelect':
|
||||||
|
return inputTypes.TAG_SELECT;
|
||||||
case 'textbox':
|
case 'textbox':
|
||||||
return inputTypes.TEXT;
|
return inputTypes.TEXT;
|
||||||
case 'oAuth':
|
case 'oAuth':
|
||||||
|
|
102
frontend/src/Components/Form/TagSelectInputConnector.js
Normal file
102
frontend/src/Components/Form/TagSelectInputConnector.js
Normal file
|
@ -0,0 +1,102 @@
|
||||||
|
import _ from 'lodash';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import React, { Component } from 'react';
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
import { createSelector } from 'reselect';
|
||||||
|
import TagInput from './TagInput';
|
||||||
|
|
||||||
|
function createMapStateToProps() {
|
||||||
|
return createSelector(
|
||||||
|
(state, { value }) => value,
|
||||||
|
(state, { values }) => values,
|
||||||
|
(tags, tagList) => {
|
||||||
|
const sortedTags = _.sortBy(tagList, 'value');
|
||||||
|
|
||||||
|
return {
|
||||||
|
tags: tags.reduce((acc, tag) => {
|
||||||
|
const matchingTag = _.find(tagList, { key: tag });
|
||||||
|
|
||||||
|
if (matchingTag) {
|
||||||
|
acc.push({
|
||||||
|
id: tag,
|
||||||
|
name: matchingTag.value
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return acc;
|
||||||
|
}, []),
|
||||||
|
|
||||||
|
tagList: sortedTags.map(({ key: id, value: name }) => {
|
||||||
|
return {
|
||||||
|
id,
|
||||||
|
name
|
||||||
|
};
|
||||||
|
}),
|
||||||
|
|
||||||
|
allTags: sortedTags
|
||||||
|
};
|
||||||
|
}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
class TagSelectInputConnector extends Component {
|
||||||
|
|
||||||
|
//
|
||||||
|
// Listeners
|
||||||
|
|
||||||
|
onTagAdd = (tag) => {
|
||||||
|
const {
|
||||||
|
name,
|
||||||
|
value,
|
||||||
|
allTags
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
const existingTag =_.some(allTags, { key: tag.id });
|
||||||
|
|
||||||
|
const newValue = value.slice();
|
||||||
|
|
||||||
|
if (existingTag) {
|
||||||
|
newValue.push(tag.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.props.onChange({ name, value: newValue });
|
||||||
|
}
|
||||||
|
|
||||||
|
onTagDelete = ({ index }) => {
|
||||||
|
const {
|
||||||
|
name,
|
||||||
|
value
|
||||||
|
} = this.props;
|
||||||
|
|
||||||
|
const newValue = value.slice();
|
||||||
|
newValue.splice(index, 1);
|
||||||
|
|
||||||
|
this.props.onChange({
|
||||||
|
name,
|
||||||
|
value: newValue
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
//
|
||||||
|
// Render
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<TagInput
|
||||||
|
onTagAdd={this.onTagAdd}
|
||||||
|
onTagDelete={this.onTagDelete}
|
||||||
|
{...this.props}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
TagSelectInputConnector.propTypes = {
|
||||||
|
name: PropTypes.string.isRequired,
|
||||||
|
value: PropTypes.arrayOf(PropTypes.number).isRequired,
|
||||||
|
values: PropTypes.arrayOf(PropTypes.object).isRequired,
|
||||||
|
allTags: PropTypes.arrayOf(PropTypes.object).isRequired,
|
||||||
|
onChange: PropTypes.func.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
export default connect(createMapStateToProps)(TagSelectInputConnector);
|
|
@ -18,6 +18,7 @@ export const SERIES_TYPE_SELECT = 'seriesTypeSelect';
|
||||||
export const TAG = 'tag';
|
export const TAG = 'tag';
|
||||||
export const TEXT = 'text';
|
export const TEXT = 'text';
|
||||||
export const TEXT_TAG = 'textTag';
|
export const TEXT_TAG = 'textTag';
|
||||||
|
export const TAG_SELECT = 'tagSelect';
|
||||||
|
|
||||||
export const all = [
|
export const all = [
|
||||||
AUTO_COMPLETE,
|
AUTO_COMPLETE,
|
||||||
|
@ -39,5 +40,6 @@ export const all = [
|
||||||
SERIES_TYPE_SELECT,
|
SERIES_TYPE_SELECT,
|
||||||
TAG,
|
TAG,
|
||||||
TEXT,
|
TEXT,
|
||||||
TEXT_TAG
|
TEXT_TAG,
|
||||||
|
TAG_SELECT
|
||||||
];
|
];
|
||||||
|
|
|
@ -62,7 +62,8 @@ namespace NzbDrone.Core.Annotations
|
||||||
Url,
|
Url,
|
||||||
Captcha,
|
Captcha,
|
||||||
OAuth,
|
OAuth,
|
||||||
Device
|
Device,
|
||||||
|
TagSelect
|
||||||
}
|
}
|
||||||
|
|
||||||
public enum HiddenType
|
public enum HiddenType
|
||||||
|
|
|
@ -104,7 +104,7 @@ namespace Sonarr.Http.ClientSchema
|
||||||
Section = fieldAttribute.Section
|
Section = fieldAttribute.Section
|
||||||
};
|
};
|
||||||
|
|
||||||
if (fieldAttribute.Type == FieldType.Select)
|
if (fieldAttribute.Type == FieldType.Select || fieldAttribute.Type == FieldType.TagSelect)
|
||||||
{
|
{
|
||||||
if (fieldAttribute.SelectOptionsProviderAction.IsNotNullOrWhiteSpace())
|
if (fieldAttribute.SelectOptionsProviderAction.IsNotNullOrWhiteSpace())
|
||||||
{
|
{
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue