mnml/client/src/components/header.component.jsx
2019-05-02 14:37:11 +10:00

35 lines
761 B
JavaScript

// eslint-disable-next-line
const preact = require('preact');
const { saw } = require('./shapes');
function pingColour(ping) {
if (ping < 100) return 'forestgreen';
if (ping < 200) return 'yellow';
return 'red';
}
function renderHeader(args) {
const { account, ping } = args;
const accountStatus = account ?
(<div className="header-status">
<h1 className="header-username">{account.name}</h1>
{saw(pingColour(ping))}
<div className="ping-text">{ping}ms</div>
</div>)
: '';
return (
<header>
<h1 className="header-title">
cryps.gg
</h1>
{accountStatus}
</header>
);
}
module.exports = renderHeader;