webapp.src.components.PageTitle.jsx Maven / Gradle / Ivy
/*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
//@flow
import React from "react";
type Props = {
title: string
}
type State = {
noConnection: boolean,
lightShown: boolean,
info: ?any,
lastSuccess: number,
modalShown: boolean,
errorText: ?string,
}
export class PageTitle extends React.Component {
timeoutId: TimeoutID;
constructor(props: Props) {
super(props);
this.state = {
noConnection: false,
lightShown: false,
info: null,
lastSuccess: Date.now(),
modalShown: false,
errorText: null,
};
}
refreshLoop() {
clearTimeout(this.timeoutId);
fetch("/ui/api/cluster")
.then(response => {
if (response.status === 401) {
location.reload();
}
return response.json();
})
.then(info => {
this.setState({
info: info,
noConnection: false,
lastSuccess: Date.now(),
modalShown: false,
});
//$FlowFixMe$ Bootstrap 3 plugin
$('#no-connection-modal').modal('hide');
this.resetTimer();
})
.catch(fail => {
this.setState({
noConnection: true,
lightShown: !this.state.lightShown,
errorText: fail
});
this.resetTimer();
if (!this.state.modalShown && (fail || (Date.now() - this.state.lastSuccess) > 30 * 1000)) {
//$FlowFixMe$ Bootstrap 3 plugin
$('#no-connection-modal').modal();
this.setState({modalShown: true});
}
});
}
resetTimer() {
clearTimeout(this.timeoutId);
this.timeoutId = setTimeout(this.refreshLoop.bind(this), 1000);
}
componentDidMount() {
this.refreshLoop.bind(this)();
}
renderStatusLight() {
if (this.state.noConnection) {
if (this.state.lightShown) {
return ;
}
else {
return
}
}
return ;
}
render() {
const info = this.state.info;
if (!info) {
return null;
}
return (
Unable to connect to server
{this.state.errorText ? "Error: " + this.state.errorText : null}
);
}
}