slate/scenes/SceneMiners.js

94 lines
2.8 KiB
JavaScript

import * as React from "react";
import * as Strings from "~/common/strings";
import * as Constants from "~/common/constants";
import * as Fixtures from "~/common/fixtures";
import * as System from "~/components/system";
import { css } from "@emotion/react";
import Section from "~/components/core/Section";
import ScenePage from "~/components/core/ScenePage";
export default class SceneMiners extends React.Component {
state = {};
_handleChange = (e) => {
this.setState({ [e.target.name]: e.target.value });
};
render() {
return (
<ScenePage>
<System.H1>Miners</System.H1>
<Section
onAction={this.props.onAction}
onNavigateTo={this.props.onNavigateTo}
title="Recent"
buttons={[
{
name: "Add miner",
type: "ACTION",
value: "ACTION_ADD_MINERS",
},
{
name: "Export",
type: "DOWNLOAD",
value: "CSV_ALL_MINERS",
},
]}
>
<System.Table
data={{
columns: [
{
key: "availability",
name: "Availability",
width: "100px",
type: "MINER_AVAILABILITY",
},
{ key: "miner", name: "Miner", width: "100%" },
{ key: "miner-id", name: "Miner ID" },
{ key: "location", name: "Location", type: "LOCATION" },
{
key: "reputation-score",
name: "Reputation score",
tooltip: "Reputation score explainer",
width: "144px",
},
{
key: "storage-available",
name: "Availble storage",
width: "120px",
},
{
key: "storage-proven",
name: "Proven storage",
tooltip: "Proven storage explainer",
width: "144px",
},
],
rows: [
{
id: 1,
availability: 1,
miner: "Example Miner A",
"miner-id": "t44444",
location: 1,
"reputation-score": 80,
"storage-available": Strings.bytesToSize(244000),
"storage-proven": Strings.bytesToSize(22000),
},
],
}}
selectedRowId={this.state.table_miners}
onNavigateTo={this.props.onNavigateTo}
onAction={this.props.onAction}
onChange={this._handleChange}
name="table_miners"
/>
</Section>
</ScenePage>
);
}
}