Fixed: Quality cutoff updating in UI when adding/removing qualities

(cherry picked from commit fea66cb7bccc7e94523614db38b157fa38f55ea5)

Closes #3203
pull/3965/head
Mark McDowall 2 years ago committed by Bogdan
parent 7f38ab31bb
commit 1c4addddf3

@ -113,12 +113,14 @@ class EnhancedSelectInput extends Component {
this._scheduleUpdate(); this._scheduleUpdate();
} }
if (!Array.isArray(this.props.value) && prevProps.value !== this.props.value) { if (!Array.isArray(this.props.value)) {
if (prevProps.value !== this.props.value || prevProps.values !== this.props.values) {
this.setState({ this.setState({
selectedIndex: getSelectedIndex(this.props) selectedIndex: getSelectedIndex(this.props)
}); });
} }
} }
}
// //
// Control // Control
@ -332,6 +334,11 @@ class EnhancedSelectInput extends Component {
const isMultiSelect = Array.isArray(value); const isMultiSelect = Array.isArray(value);
const selectedOption = getSelectedOption(selectedIndex, values); const selectedOption = getSelectedOption(selectedIndex, values);
let selectedValue = value;
if (!values.length) {
selectedValue = isMultiSelect ? [] : '';
}
return ( return (
<div> <div>
@ -372,15 +379,17 @@ class EnhancedSelectInput extends Component {
onPress={this.onPress} onPress={this.onPress}
> >
{ {
isFetching && isFetching ?
<LoadingIndicator <LoadingIndicator
className={styles.loading} className={styles.loading}
size={20} size={20}
/> /> :
null
} }
{ {
!isFetching && isFetching ?
null :
<Icon <Icon
name={icons.CARET_DOWN} name={icons.CARET_DOWN}
/> />
@ -400,7 +409,7 @@ class EnhancedSelectInput extends Component {
onPress={this.onPress} onPress={this.onPress}
> >
<SelectedValueComponent <SelectedValueComponent
value={value} value={selectedValue}
values={values} values={values}
{...selectedValueOptions} {...selectedValueOptions}
{...selectedOption} {...selectedOption}
@ -418,15 +427,17 @@ class EnhancedSelectInput extends Component {
> >
{ {
isFetching && isFetching ?
<LoadingIndicator <LoadingIndicator
className={styles.loading} className={styles.loading}
size={20} size={20}
/> /> :
null
} }
{ {
!isFetching && isFetching ?
null :
<Icon <Icon
name={icons.CARET_DOWN} name={icons.CARET_DOWN}
/> />
@ -505,7 +516,7 @@ class EnhancedSelectInput extends Component {
</Manager> </Manager>
{ {
isMobile && isMobile ?
<Modal <Modal
className={styles.optionsModal} className={styles.optionsModal}
size={sizes.EXTRA_SMALL} size={sizes.EXTRA_SMALL}
@ -555,7 +566,8 @@ class EnhancedSelectInput extends Component {
} }
</Scroller> </Scroller>
</ModalBody> </ModalBody>
</Modal> </Modal> :
null
} }
</div> </div>
); );

@ -24,7 +24,7 @@ function HintedSelectInputSelectedValue(props) {
> >
<div className={styles.valueText}> <div className={styles.valueText}>
{ {
isMultiSelect && isMultiSelect ?
value.map((key, index) => { value.map((key, index) => {
const v = valuesMap[key]; const v = valuesMap[key];
return ( return (
@ -32,26 +32,28 @@ function HintedSelectInputSelectedValue(props) {
{v ? v.value : key} {v ? v.value : key}
</Label> </Label>
); );
}) }) :
null
} }
{ {
!isMultiSelect && value isMultiSelect ? null : value
} }
</div> </div>
{ {
hint != null && includeHint && hint != null && includeHint ?
<div className={styles.hintText}> <div className={styles.hintText}>
{hint} {hint}
</div> </div> :
null
} }
</EnhancedSelectInputSelectedValue> </EnhancedSelectInputSelectedValue>
); );
} }
HintedSelectInputSelectedValue.propTypes = { HintedSelectInputSelectedValue.propTypes = {
value: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))]).isRequired, value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number]))]).isRequired,
values: PropTypes.arrayOf(PropTypes.object).isRequired, values: PropTypes.arrayOf(PropTypes.object).isRequired,
hint: PropTypes.string, hint: PropTypes.string,
isMultiSelect: PropTypes.bool.isRequired, isMultiSelect: PropTypes.bool.isRequired,

Loading…
Cancel
Save