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.
180 lines
4.5 KiB
180 lines
4.5 KiB
import PropTypes from 'prop-types';
|
|
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { withRouter } from 'react-router-dom';
|
|
import { createSelector } from 'reselect';
|
|
import createDimensionsSelector from 'Store/Selectors/createDimensionsSelector';
|
|
import { saveDimensions, setIsSidebarVisible } from 'Store/Actions/appActions';
|
|
import { fetchArtist } from 'Store/Actions/artistActions';
|
|
import { fetchTags } from 'Store/Actions/tagActions';
|
|
import { fetchQualityProfiles, fetchLanguageProfiles, fetchUISettings } from 'Store/Actions/settingsActions';
|
|
import { fetchStatus } from 'Store/Actions/systemActions';
|
|
import ErrorPage from './ErrorPage';
|
|
import LoadingPage from './LoadingPage';
|
|
import Page from './Page';
|
|
|
|
function testLocalStorage() {
|
|
const key = 'sonarrTest';
|
|
|
|
try {
|
|
localStorage.setItem(key, key);
|
|
localStorage.removeItem(key);
|
|
|
|
return true;
|
|
} catch (e) {
|
|
return false;
|
|
}
|
|
}
|
|
|
|
function createMapStateToProps() {
|
|
return createSelector(
|
|
(state) => state.series,
|
|
(state) => state.tags,
|
|
(state) => state.settings,
|
|
(state) => state.app,
|
|
createDimensionsSelector(),
|
|
(series, tags, settings, app, dimensions) => {
|
|
const isPopulated = series.isPopulated &&
|
|
tags.isPopulated &&
|
|
settings.qualityProfiles.isPopulated &&
|
|
settings.ui.isPopulated;
|
|
|
|
const hasError = !!series.error ||
|
|
!!tags.error ||
|
|
!!settings.qualityProfiles.error ||
|
|
!!settings.ui.error;
|
|
|
|
return {
|
|
isPopulated,
|
|
hasError,
|
|
seriesError: series.error,
|
|
tagsError: tags.error,
|
|
qualityProfilesError: settings.qualityProfiles.error,
|
|
uiSettingsError: settings.ui.error,
|
|
isSmallScreen: dimensions.isSmallScreen,
|
|
isSidebarVisible: app.isSidebarVisible,
|
|
version: app.version,
|
|
isUpdated: app.isUpdated,
|
|
isDisconnected: app.isDisconnected
|
|
};
|
|
}
|
|
);
|
|
}
|
|
|
|
function createMapDispatchToProps(dispatch, props) {
|
|
return {
|
|
dispatchFetchSeries() {
|
|
dispatch(fetchArtist());
|
|
},
|
|
dispatchFetchTags() {
|
|
dispatch(fetchTags());
|
|
},
|
|
dispatchFetchQualityProfiles() {
|
|
dispatch(fetchQualityProfiles());
|
|
},
|
|
dispatchFetchLanguageProfiles() {
|
|
dispatch(fetchLanguageProfiles());
|
|
},
|
|
dispatchFetchUISettings() {
|
|
dispatch(fetchUISettings());
|
|
},
|
|
dispatchFetchStatus() {
|
|
dispatch(fetchStatus());
|
|
},
|
|
onResize(dimensions) {
|
|
dispatch(saveDimensions(dimensions));
|
|
},
|
|
onSidebarVisibleChange(isSidebarVisible) {
|
|
dispatch(setIsSidebarVisible({ isSidebarVisible }));
|
|
}
|
|
};
|
|
}
|
|
|
|
class PageConnector extends Component {
|
|
|
|
//
|
|
// Lifecycle
|
|
|
|
constructor(props, context) {
|
|
super(props, context);
|
|
|
|
this.state = {
|
|
isLocalStorageSupported: testLocalStorage()
|
|
};
|
|
}
|
|
|
|
componentDidMount() {
|
|
if (!this.props.isPopulated) {
|
|
this.props.dispatchFetchSeries();
|
|
this.props.dispatchFetchTags();
|
|
this.props.dispatchFetchQualityProfiles();
|
|
this.props.dispatchFetchLanguageProfiles();
|
|
this.props.dispatchFetchUISettings();
|
|
this.props.dispatchFetchStatus();
|
|
}
|
|
}
|
|
|
|
//
|
|
// Listeners
|
|
|
|
onSidebarToggle = () => {
|
|
this.props.onSidebarVisibleChange(!this.props.isSidebarVisible);
|
|
}
|
|
|
|
//
|
|
// Render
|
|
|
|
render() {
|
|
const {
|
|
isPopulated,
|
|
hasError,
|
|
dispatchFetchSeries,
|
|
dispatchFetchTags,
|
|
dispatchFetchQualityProfiles,
|
|
dispatchFetchLanguageProfiles,
|
|
dispatchFetchUISettings,
|
|
dispatchFetchStatus,
|
|
...otherProps
|
|
} = this.props;
|
|
|
|
if (hasError || !this.state.isLocalStorageSupported) {
|
|
return (
|
|
<ErrorPage
|
|
{...this.state}
|
|
{...otherProps}
|
|
/>
|
|
);
|
|
}
|
|
|
|
if (isPopulated) {
|
|
return (
|
|
<Page
|
|
{...otherProps}
|
|
onSidebarToggle={this.onSidebarToggle}
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<LoadingPage />
|
|
);
|
|
}
|
|
}
|
|
|
|
PageConnector.propTypes = {
|
|
isPopulated: PropTypes.bool.isRequired,
|
|
hasError: PropTypes.bool.isRequired,
|
|
isSidebarVisible: PropTypes.bool.isRequired,
|
|
dispatchFetchSeries: PropTypes.func.isRequired,
|
|
dispatchFetchTags: PropTypes.func.isRequired,
|
|
dispatchFetchQualityProfiles: PropTypes.func.isRequired,
|
|
dispatchFetchLanguageProfiles: PropTypes.func.isRequired,
|
|
dispatchFetchUISettings: PropTypes.func.isRequired,
|
|
dispatchFetchStatus: PropTypes.func.isRequired,
|
|
onSidebarVisibleChange: PropTypes.func.isRequired
|
|
};
|
|
|
|
export default withRouter(
|
|
connect(createMapStateToProps, createMapDispatchToProps)(PageConnector)
|
|
);
|