|
@@ -3,6 +3,7 @@ import Burns from "./Burns";
|
|
|
import Overview from "./Overview";
|
|
|
import ReportBrowser from "./ReportBrowser";
|
|
|
import Loading from "../Loading";
|
|
|
+import Chart from "../Chart";
|
|
|
|
|
|
import { Tokenomics } from "../../types";
|
|
|
|
|
@@ -14,9 +15,17 @@ interface IProps {
|
|
|
|
|
|
const CouncilReports = (props: IProps) => {
|
|
|
const { reports, tokenomics } = props;
|
|
|
- if (!tokenomics) return <Loading />;
|
|
|
+ if (!tokenomics) return <Loading target="tokenomics" />;
|
|
|
const { exchanges, extecutedBurnsAmount } = tokenomics;
|
|
|
|
|
|
+ const tokenValue = {};
|
|
|
+ exchanges
|
|
|
+ .filter((e) => e.date)
|
|
|
+ .forEach((e) => {
|
|
|
+ const date = e.date.split("T")[0];
|
|
|
+ tokenValue[date] = { date, price: e.price * 1000000 };
|
|
|
+ });
|
|
|
+
|
|
|
return (
|
|
|
<div className="h-100 py-3 d-flex flex-row justify-content-center pb-5">
|
|
|
<div className="d-flex flex-column text-right align-items-right">
|
|
@@ -29,6 +38,21 @@ const CouncilReports = (props: IProps) => {
|
|
|
exchanges={exchanges}
|
|
|
extecutedBurnsAmount={extecutedBurnsAmount}
|
|
|
/>
|
|
|
+
|
|
|
+ <div className="box">
|
|
|
+ <h3>Token Value</h3>
|
|
|
+
|
|
|
+ <Chart
|
|
|
+ data={Object.values(tokenValue).sort((a, b) => a.date - b.date)}
|
|
|
+ x="date"
|
|
|
+ y="price"
|
|
|
+ xLabel="Date"
|
|
|
+ yLabel="$"
|
|
|
+ scaleY={true}
|
|
|
+ pixels={600}
|
|
|
+ barStyle={() => `bg-warning`}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<div className="box col-8">
|