diff options
author | Sorin Sbarnea <ssbarnea@redhat.com> | 2020-07-06 12:21:00 +0100 |
---|---|---|
committer | Sorin Sbarnea <ssbarnea@redhat.com> | 2020-07-30 13:51:09 +0100 |
commit | 1ecbe5847455c9cd5123f1e2c7109c56bc850be1 (patch) | |
tree | 272ef13707c76809495fb781c17bcf4aab92b5e3 /web/src/pages | |
parent | 9c623851c422f29f641a71fe90cf91c1cf1a1274 (diff) | |
download | zuul-1ecbe5847455c9cd5123f1e2c7109c56bc850be1.tar.gz |
Add user preferences dialog
In order to avoid cluttering Zuul UI with user preferences in various
places, we introduce a simple config dialog.
This moves "auto reload" option to the preferences panel.
Change-Id: I7201d9e021c99f8e5a936dc98efe3c9d563fbcbc
Co-Authored-By: James E. Blair <jeblair@redhat.com>
Diffstat (limited to 'web/src/pages')
-rw-r--r-- | web/src/pages/Status.jsx | 23 |
1 files changed, 11 insertions, 12 deletions
diff --git a/web/src/pages/Status.jsx b/web/src/pages/Status.jsx index 7588ea162..7e33928b9 100644 --- a/web/src/pages/Status.jsx +++ b/web/src/pages/Status.jsx @@ -34,6 +34,7 @@ class StatusPage extends React.Component { static propTypes = { location: PropTypes.object, tenant: PropTypes.object, + preferences: PropTypes.object, timezone: PropTypes.string, remoteData: PropTypes.object, dispatch: PropTypes.func @@ -42,7 +43,6 @@ class StatusPage extends React.Component { state = { filter: null, expanded: false, - autoReload: true } visibilityListener = () => { @@ -80,9 +80,9 @@ class StatusPage extends React.Component { } updateData = (force) => { - if (force || (this.visible && this.state.autoReload)) { + if (force || (this.visible && this.props.preferences.autoReload)) { this.props.dispatch(fetchStatusIfNeeded(this.props.tenant)) - .then(() => {if (this.state.autoReload && this.visible) { + .then(() => {if (this.props.preferences.autoReload && this.visible) { this.timer = setTimeout(this.updateData, 5000) }}) } @@ -97,14 +97,18 @@ class StatusPage extends React.Component { document.title = 'Zuul Status' this.loadState() if (this.props.tenant.name) { - this.updateData() + this.updateData(true) } window.addEventListener('storage', this.loadState) } componentDidUpdate (prevProps) { if (this.props.tenant.name !== prevProps.tenant.name) { - this.updateData() + this.updateData(true) + } + // If the user just enabled auto-reload + if (this.props.preferences.autoReload && !this.timer) { + this.updateData(true) } } @@ -185,7 +189,7 @@ class StatusPage extends React.Component { render () { const { remoteData } = this.props - const { autoReload, filter, expanded } = this.state + const { filter, expanded } = this.state const status = remoteData.status if (this.filter && !this.filterLoaded && filter) { this.filterLoaded = true @@ -227,12 +231,6 @@ class StatusPage extends React.Component { isFetching={remoteData.isFetching} fetchCallback={this.updateData} /> - <Checkbox - defaultChecked={autoReload} - onChange={(e) => {this.setState({autoReload: e.target.checked})}} - style={{marginTop: '0px', marginLeft: '10px'}}> - auto reload - </Checkbox> </div> {status && this.renderStatusHeader(status)} @@ -253,6 +251,7 @@ class StatusPage extends React.Component { } export default connect(state => ({ + preferences: state.preferences, tenant: state.tenant, timezone: state.timezone, remoteData: state.status, |