You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
1.8 KiB
64 lines
1.8 KiB
import React, { Fragment, useCallback } from 'react';
|
|
import { useSelector } from 'react-redux';
|
|
import FormGroup from 'Components/Form/FormGroup';
|
|
import FormInputGroup from 'Components/Form/FormInputGroup';
|
|
import FormLabel from 'Components/Form/FormLabel';
|
|
import { inputTypes } from 'Helpers/Props';
|
|
import { CheckInputChanged } from 'typings/inputs';
|
|
import translate from 'Utilities/String/translate';
|
|
import selectTableOptions from './selectTableOptions';
|
|
|
|
interface ArtistIndexTableOptionsProps {
|
|
onTableOptionChange(...args: unknown[]): unknown;
|
|
}
|
|
|
|
function ArtistIndexTableOptions(props: ArtistIndexTableOptionsProps) {
|
|
const { onTableOptionChange } = props;
|
|
|
|
const tableOptions = useSelector(selectTableOptions);
|
|
|
|
const { showBanners, showSearchAction } = tableOptions;
|
|
|
|
const onTableOptionChangeWrapper = useCallback(
|
|
({ name, value }: CheckInputChanged) => {
|
|
onTableOptionChange({
|
|
tableOptions: {
|
|
...tableOptions,
|
|
[name]: value,
|
|
},
|
|
});
|
|
},
|
|
[tableOptions, onTableOptionChange]
|
|
);
|
|
|
|
return (
|
|
<Fragment>
|
|
<FormGroup>
|
|
<FormLabel>{translate('ShowBanners')}</FormLabel>
|
|
|
|
<FormInputGroup
|
|
type={inputTypes.CHECK}
|
|
name="showBanners"
|
|
value={showBanners}
|
|
helpText={translate('ShowBannersHelpText')}
|
|
onChange={onTableOptionChangeWrapper}
|
|
/>
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<FormLabel>{translate('ShowSearch')}</FormLabel>
|
|
|
|
<FormInputGroup
|
|
type={inputTypes.CHECK}
|
|
name="showSearchAction"
|
|
value={showSearchAction}
|
|
helpText={translate('ShowSearchActionHelpText')}
|
|
onChange={onTableOptionChangeWrapper}
|
|
/>
|
|
</FormGroup>
|
|
</Fragment>
|
|
);
|
|
}
|
|
|
|
export default ArtistIndexTableOptions;
|