49 lines
1.1 KiB
TypeScript
49 lines
1.1 KiB
TypeScript
|
/**
|
||
|
* @author Martin Karkowski
|
||
|
* @email m.karkowski@zema.de
|
||
|
* @create date 2021-02-09 10:40:55
|
||
|
* @modify date 2021-02-09 10:40:55
|
||
|
* @desc [description]
|
||
|
*/
|
||
|
|
||
|
import React from "react";
|
||
|
import { ProgressBar } from "react-bootstrap";
|
||
|
|
||
|
/**
|
||
|
* Component used to render the Status of the Memory of a Host.
|
||
|
*/
|
||
|
export class MemoryStatusOfHostComponent extends React.Component<
|
||
|
{
|
||
|
value: number;
|
||
|
},
|
||
|
{}
|
||
|
> {
|
||
|
render() {
|
||
|
// Determine the Now Value.
|
||
|
const now = Math.round(1000 - this.props.value * 1000) / 10;
|
||
|
const colorRange = {
|
||
|
"0": "success",
|
||
|
"30": "success",
|
||
|
"75": "warning",
|
||
|
"90": "danger",
|
||
|
"101": "danger"
|
||
|
};
|
||
|
|
||
|
// Determine the Color, Therefore filter the "keys" based on the now Value.
|
||
|
const color =
|
||
|
colorRange[
|
||
|
Object.getOwnPropertyNames(colorRange).filter(
|
||
|
(value) => now < parseFloat(value)
|
||
|
)[0]
|
||
|
];
|
||
|
|
||
|
// Render
|
||
|
return (
|
||
|
<>
|
||
|
<ProgressBar now={now} label={`${now} %`} variant={color} />
|
||
|
</>
|
||
|
);
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export default MemoryStatusOfHostComponent;
|