slate/scenes/SceneDeals.js

80 lines
2.4 KiB
JavaScript
Raw Permalink Normal View History

2020-06-19 06:57:57 +03:00
import * as React from "react";
import * as System from "~/components/system";
import { LoaderSpinner } from "~/components/system/components/Loaders";
2020-06-19 06:57:57 +03:00
import Section from "~/components/core/Section";
import ScenePage from "~/components/core/ScenePage";
2020-08-22 07:25:34 +03:00
import ScenePageHeader from "~/components/core/ScenePageHeader";
export default class SceneDeals extends React.Component {
render() {
let addressSentence = "Your deals are made from your default address.";
return (
2020-11-16 00:54:14 +03:00
<React.Fragment>
<ScenePageHeader>
View all of your storage deals that are in progress or successful. {addressSentence}
2020-08-22 07:25:34 +03:00
</ScenePageHeader>
2020-11-16 00:54:14 +03:00
{this.props.dealsLoaded ? (
<Section title={"History"} style={{ maxWidth: 960, minWidth: "auto" }}>
<System.Table
data={{
columns: [
{
key: "dealId",
name: "Deal ID",
width: "72px",
},
{
key: "rootCid",
name: "Root CID",
width: "100%",
},
{
key: "miner",
name: "Miner ID",
width: "72px",
},
{
key: "createdAt",
name: "Creation date",
width: "112px",
},
{
key: "totalSpeculatedCost",
name: "Cost",
width: "128px",
},
{
key: "formattedSize",
name: "Size",
width: "72px",
},
{
key: "formattedDuration",
name: "Duration",
width: "96px",
},
{
key: "pending",
name: "Retrievable",
width: "112px",
type: "RETRIEVABLE",
},
],
2020-11-16 00:54:14 +03:00
rows: this.props.deals,
}}
/>
</Section>
) : (
<div style={{ padding: "32px 0 0 0" }}>
<LoaderSpinner style={{ height: 32, width: 32 }} />
</div>
)}
2020-11-16 00:54:14 +03:00
</React.Fragment>
);
}
}