tedkulp/Radarr
1
0
Fork 0
mirror of https://github.com/Radarr/Radarr.git synced 2026-03-05 13:21:25 -05:00
Code Issues Projects Releases Wiki Activity

Improve typings for select options

Browse Source
This commit is contained in:
Bogdan
2025-04-18 12:11:55 +03:00
parent 9ef7c2a0b4
commit 3a55316ada
4 changed files with 44 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/Collection/CollectionFooter.js
View File

@@ -1,13 +1,10 @@
import _ from 'lodash';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import AvailabilitySelectInput from 'Components/Form/Select/AvailabilitySelectInput';
import QualityProfileSelectInput from 'Components/Form/Select/QualityProfileSelectInput';
import RootFolderSelectInput from 'Components/Form/Select/RootFolderSelectInput';
import SelectInput from 'Components/Form/SelectInput';
import FormInputGroup from 'Components/Form/FormInputGroup';
import SpinnerButton from 'Components/Link/SpinnerButton';
import PageContentFooter from 'Components/Page/PageContentFooter';
import { kinds } from 'Helpers/Props';
import { inputTypes, kinds } from 'Helpers/Props';
import translate from 'Utilities/String/translate';
import CollectionFooterLabel from './CollectionFooterLabel';
import styles from './CollectionFooter.css';
@@ -19,8 +16,7 @@ const monitoredOptions = [
key: NO_CHANGE,
get value() {
return translate('NoChange');
},
isDisabled: true
}
},
{
key: 'monitored',
@@ -41,8 +37,7 @@ const searchOnAddOptions = [
key: NO_CHANGE,
get value() {
return translate('NoChange');
},
isDisabled: true
}
},
{
key: 'yes',
@@ -173,7 +168,8 @@ class CollectionFooter extends Component {
isSaving={isSaving && monitored !== NO_CHANGE}
/>
<SelectInput
<FormInputGroup
type={inputTypes.SELECT}
name="monitored"
value={monitored}
values={monitoredOptions}
@@ -188,7 +184,8 @@ class CollectionFooter extends Component {
isSaving={isSaving && monitor !== NO_CHANGE}
/>
<SelectInput
<FormInputGroup
type={inputTypes.SELECT}
name="monitor"
value={monitor}
values={monitoredOptions}
@@ -203,10 +200,12 @@ class CollectionFooter extends Component {
isSaving={isSaving && qualityProfileId !== NO_CHANGE}
/>
<QualityProfileSelectInput
<FormInputGroup
type={inputTypes.QUALITY_PROFILE_SELECT}
name="qualityProfileId"
value={qualityProfileId}
includeNoChange={true}
includeNoChangeDisabled={false}
isDisabled={!selectedCount}
onChange={this.onInputChange}
/>
@@ -218,10 +217,12 @@ class CollectionFooter extends Component {
isSaving={isSaving && minimumAvailability !== NO_CHANGE}
/>
<AvailabilitySelectInput
<FormInputGroup
type={inputTypes.AVAILABILITY_SELECT}
name="minimumAvailability"
value={minimumAvailability}
includeNoChange={true}
includeNoChangeDisabled={false}
isDisabled={!selectedCount}
onChange={this.onInputChange}
/>
@@ -233,12 +234,14 @@ class CollectionFooter extends Component {
isSaving={isSaving && rootFolderPath !== NO_CHANGE}
/>
<RootFolderSelectInput
<FormInputGroup
type={inputTypes.ROOT_FOLDER_SELECT}
name="rootFolderPath"
value={rootFolderPath}
includeNoChange={true}
isDisabled={!selectedCount}
includeNoChangeDisabled={false}
selectedValueOptions={{ includeFreeSpace: false }}
isDisabled={!selectedCount}
onChange={this.onInputChange}
/>
</div>
@@ -249,7 +252,8 @@ class CollectionFooter extends Component {
isSaving={isSaving && searchOnAdd !== NO_CHANGE}
/>
<SelectInput
<FormInputGroup
type={inputTypes.SELECT}
name="searchOnAdd"
value={searchOnAdd}
values={searchOnAddOptions}

27
frontend/src/Components/Form/SelectInput.tsx
View File

@@ -1,12 +1,17 @@
import classNames from 'classnames';
import React, { ChangeEvent, SyntheticEvent, useCallback } from 'react';
import React, {
ChangeEvent,
ComponentProps,
SyntheticEvent,
useCallback,
} from 'react';
import { InputChanged } from 'typings/inputs';
import styles from './SelectInput.css';
interface SelectInputOption {
key: string;
export interface SelectInputOption
extends Pick<ComponentProps<'option'>, 'disabled'> {
key: string | number;
value: string | number | (() => string | number);
isDisabled?: boolean;
}
interface SelectInputProps<T> {
@@ -62,20 +67,10 @@ function SelectInput<T>({
onBlur={onBlur}
>
{values.map((option) => {
const {
key,
value: optionValue,
isDisabled: optionIsDisabled = false,
...otherOptionProps
} = option;
const { key, value: optionValue, ...otherOptionProps } = option;
return (
<option
key={key}
value={key}
disabled={optionIsDisabled}
{...otherOptionProps}
>
<option key={key} value={key} {...otherOptionProps}>
{typeof optionValue === 'function' ? optionValue() : optionValue}
</option>
);

19
frontend/src/DiscoverMovie/DiscoverMovieFooter.js
View File

@@ -2,13 +2,10 @@ import _ from 'lodash';
import PropTypes from 'prop-types';
import React, { Component } from 'react';
import CheckInput from 'Components/Form/CheckInput';
import AvailabilitySelectInput from 'Components/Form/Select/AvailabilitySelectInput';
import QualityProfileSelectInput from 'Components/Form/Select/QualityProfileSelectInput';
import RootFolderSelectInput from 'Components/Form/Select/RootFolderSelectInput';
import SelectInput from 'Components/Form/SelectInput';
import FormInputGroup from 'Components/Form/FormInputGroup';
import SpinnerButton from 'Components/Link/SpinnerButton';
import PageContentFooter from 'Components/Page/PageContentFooter';
import { kinds } from 'Helpers/Props';
import { inputTypes, kinds } from 'Helpers/Props';
import monitorOptions from 'Utilities/Movie/monitorOptions';
import translate from 'Utilities/String/translate';
import DiscoverMovieFooterLabel from './DiscoverMovieFooterLabel';
@@ -146,7 +143,8 @@ class DiscoverMovieFooter extends Component {
isSaving={isAdding}
/>
<SelectInput
<FormInputGroup
type={inputTypes.SELECT}
name="monitor"
value={monitor}
values={monitorOptions}
@@ -161,7 +159,8 @@ class DiscoverMovieFooter extends Component {
isSaving={isAdding}
/>
<QualityProfileSelectInput
<FormInputGroup
type={inputTypes.QUALITY_PROFILE_SELECT}
name="qualityProfileId"
value={qualityProfileId}
isDisabled={!selectedCount}
@@ -175,7 +174,8 @@ class DiscoverMovieFooter extends Component {
isSaving={isAdding}
/>
<AvailabilitySelectInput
<FormInputGroup
type={inputTypes.AVAILABILITY_SELECT}
name="minimumAvailability"
value={minimumAvailability}
isDisabled={!selectedCount}
@@ -189,7 +189,8 @@ class DiscoverMovieFooter extends Component {
isSaving={isAdding}
/>
<RootFolderSelectInput
<FormInputGroup
type={inputTypes.ROOT_FOLDER_SELECT}
name="rootFolderPath"
value={rootFolderPath}
isDisabled={!selectedCount}

6
frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.tsx
View File

@@ -5,7 +5,7 @@ import { createSelector } from 'reselect';
import AppState from 'App/State/AppState';
import InteractiveImportAppState from 'App/State/InteractiveImportAppState';
import * as commandNames from 'Commands/commandNames';
import SelectInput from 'Components/Form/SelectInput';
import SelectInput, { SelectInputOption } from 'Components/Form/SelectInput';
import Icon from 'Components/Icon';
import Button from 'Components/Link/Button';
import SpinnerButton from 'Components/Link/SpinnerButton';
@@ -141,7 +141,7 @@ const COLUMNS = [
},
];
const importModeOptions = [
const importModeOptions: SelectInputOption[] = [
{
key: 'chooseImportMode',
value: () => translate('ChooseImportMode'),
@@ -289,7 +289,7 @@ function InteractiveImportModalContent(
}, [selectedState]);
const bulkSelectOptions = useMemo(() => {
const options = [
const options: SelectInputOption[] = [
{
key: 'select',
value: translate('SelectDropdown'),