nws-site/src/App.tsx

66 lines
2.2 KiB
TypeScript

import React, {useEffect, useState} from 'react';
import NWSLogo from './static/images/NWS_Logo.png';
import './App.css';
function App() {
const setup_time = 1643927861;
const[uptime, setUptime] = useState("100%");
useEffect(() => {
var myHeaders = new Headers();
myHeaders.append("Content-Type", "application/x-www-form-urlencoded");
var urlencoded = new URLSearchParams();
urlencoded.append("api_key", "ur1612363-492fa5df2a31fab5b52171b4");
urlencoded.append("monitors", "790552884");
urlencoded.append("custom_uptime_ranges", setup_time+"_"+(new Date().valueOf()/1000));
urlencoded.append("all_time_uptime_ratio", "1");
var requestOptions = {
method: 'POST',
headers: myHeaders,
body: urlencoded,
redirect: 'follow'
};
// @ts-ignore
fetch("https://api.uptimerobot.com/v2/getMonitors", requestOptions)
.then(response => response.json().then(json => {
setUptime(json.monitors[0].custom_uptime_ranges);
}))
.then(result => console.log(result))
.catch(error => console.log('error', error));
}, []);
let diff = new Date().getTime() - new Date(setup_time*1000).getTime();
let days = Math.floor(diff / (1000 * 60 * 60 * 24));
diff -= days * (1000 * 60 * 60 * 24);
let hours = Math.floor(diff / (1000 * 60 * 60));
diff -= hours * (1000 * 60 * 60);
let mins = Math.floor(diff / (1000 * 60));
diff -= mins * (1000 * 60);
let seconds = Math.floor(diff / (1000));
diff -= seconds * (1000);
return (
<div className="App">
<header className="App-header">
<img src={NWSLogo} alt="nws-logo" />
<p>
NWS has had {uptime}% uptime since {(new Date(setup_time*1000)).toLocaleString()}
</p>
{uptime === "100.000" &&
<p>
Continuous 100% SLA uptime for {days + " days, " + hours + " hours, " + mins + " minutes, " + seconds + " seconds"}
</p>
}
</header>
</div>
);
}
export default App;