Fix UI issues with no indexers exist

pull/5/head
Qstick 4 years ago
parent d041b152d6
commit 2006ce42d0

@ -429,7 +429,10 @@ class IndexerIndex extends Component {
{
!error && isPopulated && !items.length &&
<NoIndexer totalItems={totalItems} />
<NoIndexer
totalItems={totalItems}
onAddIndexerPress={this.onAddIndexerPress}
/>
}
</PageContentBody>

@ -6,7 +6,10 @@ import translate from 'Utilities/String/translate';
import styles from './NoIndexer.css';
function NoIndexer(props) {
const { totalItems } = props;
const {
totalItems,
onAddIndexerPress
} = props;
if (totalItems > 0) {
return (
@ -26,7 +29,7 @@ function NoIndexer(props) {
<div className={styles.buttonContainer}>
<Button
to="/add/new"
onPress={onAddIndexerPress}
kind={kinds.PRIMARY}
>
{translate('AddNewIndexer')}
@ -37,7 +40,8 @@ function NoIndexer(props) {
}
NoIndexer.propTypes = {
totalItems: PropTypes.number.isRequired
totalItems: PropTypes.number.isRequired,
onAddIndexerPress: PropTypes.func.isRequired
};
export default NoIndexer;

@ -51,7 +51,8 @@ class SearchFooter extends Component {
render() {
const {
isFetching
isFetching,
hasIndexers
} = this.props;
const {
@ -97,7 +98,7 @@ class SearchFooter extends Component {
<SpinnerButton
className={styles.deleteSelectedButton}
isSpinning={isFetching}
isDisabled={isFetching}
isDisabled={isFetching || !hasIndexers}
onPress={this.onSearchPress}
>
Search
@ -113,6 +114,7 @@ class SearchFooter extends Component {
SearchFooter.propTypes = {
isFetching: PropTypes.bool.isRequired,
onSearchPress: PropTypes.func.isRequired,
hasIndexers: PropTypes.bool.isRequired,
searchError: PropTypes.object
};

@ -12,6 +12,8 @@ import PageToolbarSeparator from 'Components/Page/Toolbar/PageToolbarSeparator';
import TableOptionsModalWrapper from 'Components/Table/TableOptions/TableOptionsModalWrapper';
import { align, icons, sortDirections } from 'Helpers/Props';
import NoIndexer from 'Indexer/NoIndexer';
import AddIndexerModal from 'Settings/Indexers/Indexers/AddIndexerModal';
import EditIndexerModalConnector from 'Settings/Indexers/Indexers/EditIndexerModalConnector';
import * as keyCodes from 'Utilities/Constants/keyCodes';
import getErrorMessage from 'Utilities/Object/getErrorMessage';
import hasDifferentItemsOrOrder from 'Utilities/Object/hasDifferentItemsOrOrder';
@ -39,6 +41,8 @@ class SearchIndex extends Component {
scroller: null,
jumpBarItems: { order: [] },
jumpToCharacter: null,
isAddIndexerModalOpen: false,
isEditIndexerModalOpen: false,
searchType: null,
lastToggled: null
};
@ -123,6 +127,21 @@ class SearchIndex extends Component {
//
// Listeners
onAddIndexerPress = () => {
this.setState({ isAddIndexerModalOpen: true });
}
onAddIndexerModalClose = ({ indexerSelected = false } = {}) => {
this.setState({
isAddIndexerModalOpen: false,
isEditIndexerModalOpen: indexerSelected
});
}
onEditIndexerModalClose = () => {
this.setState({ isEditIndexerModalOpen: false });
}
onJumpBarItemPress = (jumpToCharacter) => {
this.setState({ jumpToCharacter });
}
@ -169,6 +188,8 @@ class SearchIndex extends Component {
const {
scroller,
jumpBarItems,
isAddIndexerModalOpen,
isEditIndexerModalOpen,
jumpToCharacter
} = this.state;
@ -248,7 +269,10 @@ class SearchIndex extends Component {
{
!error && !isFetching && !hasIndexers &&
<NoIndexer />
<NoIndexer
totalItems={0}
onAddIndexerPress={this.onAddIndexerPress}
/>
}
{
@ -268,8 +292,19 @@ class SearchIndex extends Component {
<SearchFooter
isFetching={isFetching}
hasIndexers={hasIndexers}
onSearchPress={this.onSearchPress}
/>
<AddIndexerModal
isOpen={isAddIndexerModalOpen}
onModalClose={this.onAddIndexerModalClose}
/>
<EditIndexerModalConnector
isOpen={isEditIndexerModalOpen}
onModalClose={this.onEditIndexerModalClose}
/>
</PageContent>
);
}

@ -6,13 +6,12 @@ import withScrollPosition from 'Components/withScrollPosition';
import { fetchReleases, setReleasesFilter, setReleasesSort, setReleasesTableOption } from 'Store/Actions/releaseActions';
import scrollPositions from 'Store/scrollPositions';
import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
import createIndexerClientSideCollectionItemsSelector from 'Store/Selectors/createIndexerClientSideCollectionItemsSelector';
import createReleaseClientSideCollectionItemsSelector from 'Store/Selectors/createReleaseClientSideCollectionItemsSelector';
import SearchIndex from './SearchIndex';
function createMapStateToProps() {
return createSelector(
createIndexerClientSideCollectionItemsSelector('indexerIndex'),
(state) => state.indexers,
createReleaseClientSideCollectionItemsSelector('releases'),
createDimensionsSelector(),
(

@ -30,7 +30,6 @@ class AddIndexerItem extends Component {
const {
name,
implementation,
implementationName,
infoLink,
presets,
onIndexerSelect
@ -105,7 +104,6 @@ class AddIndexerItem extends Component {
AddIndexerItem.propTypes = {
name: PropTypes.string.isRequired,
implementation: PropTypes.string.isRequired,
implementationName: PropTypes.string.isRequired,
infoLink: PropTypes.string.isRequired,
presets: PropTypes.arrayOf(PropTypes.object),
onIndexerSelect: PropTypes.func.isRequired

Loading…
Cancel
Save