diff --git a/api/src/stats/stats.service.ts b/api/src/stats/stats.service.ts index c003882c..141b92fd 100644 --- a/api/src/stats/stats.service.ts +++ b/api/src/stats/stats.service.ts @@ -124,8 +124,9 @@ export class StatsService { individualsCapital: supplyAndCapital.individualsCapital, communityCapital: supplyAndCapital.communityCapital, communityWalletsBalanceBreakdown: communityWalletsBalanceBreakdown, - rewardsOverTime: pofValues.nominalRewardOverTime, // net rewards? also available on the pofValues object - clearingBidoverTime: pofValues.clearingBidOverTime, // net rewards? also available on the pofValues object + rewardsOverTime: pofValues.nominalRewardOverTime, + clearingBidOverTime: pofValues.clearingBidOverTime, + netRewardOverTime: pofValues.netRewardOverTime, liquidSupplyConcentration: liquidSupplyConcentration, lockedSupplyConcentration: lockedSupplyConcentration, @@ -145,6 +146,7 @@ export class StatsService { infrastructureEscrow, lockedCoins, }; + return res; } diff --git a/api/src/stats/types.ts b/api/src/stats/types.ts index f20154bd..75c4878c 100644 --- a/api/src/stats/types.ts +++ b/api/src/stats/types.ts @@ -32,7 +32,8 @@ export interface Stats { communityCapital: NameValue[]; communityWalletsBalanceBreakdown: NameValue[]; rewardsOverTime: TimestampValue[]; - clearingBidoverTime: TimestampValue[]; + clearingBidOverTime: TimestampValue[]; + netRewardOverTime: TimestampValue[]; liquidSupplyConcentration: BinRange[]; lockedSupplyConcentration: { accountsLocked: BinRange[]; diff --git a/web-app/src/modules/core/routes/Stats/ChartComponent.tsx b/web-app/src/modules/core/routes/Stats/ChartComponent.tsx index 477b0962..1cbdda6d 100644 --- a/web-app/src/modules/core/routes/Stats/ChartComponent.tsx +++ b/web-app/src/modules/core/routes/Stats/ChartComponent.tsx @@ -14,9 +14,10 @@ interface Props { title: string; type: string; data: any; + showHorizontalLine?: boolean; } -const ChartComponent: FC = ({ type, data, title }) => { +const ChartComponent: FC = ({ type, data, title, showHorizontalLine }) => { const chart = (() => { switch (type) { case 'BarChart': @@ -24,7 +25,7 @@ const ChartComponent: FC = ({ type, data, title }) => { case 'PieChart': return ; case 'LineChart': - return ; + return ; case 'LineAndBarChart': return ; case 'LineAndAreaChart': diff --git a/web-app/src/modules/core/routes/Stats/Stats.tsx b/web-app/src/modules/core/routes/Stats/Stats.tsx index e09e3757..52aaa3c7 100644 --- a/web-app/src/modules/core/routes/Stats/Stats.tsx +++ b/web-app/src/modules/core/routes/Stats/Stats.tsx @@ -126,13 +126,21 @@ const Coinstats = () => {
+
+
+
diff --git a/web-app/src/modules/core/routes/Stats/components/LineChart.tsx b/web-app/src/modules/core/routes/Stats/components/LineChart.tsx index fea4d317..9a146f1d 100644 --- a/web-app/src/modules/core/routes/Stats/components/LineChart.tsx +++ b/web-app/src/modules/core/routes/Stats/components/LineChart.tsx @@ -5,9 +5,10 @@ import ChartContainer from './ChartContainer'; interface Props { title: string; data: { value: number; timestamp: number }[]; + showHorizontalLine?: boolean; } -const LineChart: FC = ({ data, title }) => { +const LineChart: FC = ({ data, title, showHorizontalLine = false }) => { const option = { animation: false, tooltip: { @@ -41,30 +42,14 @@ const LineChart: FC = ({ data, title }) => { axisTick: { alignWithLabel: true, }, - axisLine: { - lineStyle: { - // color: '#E8595C' - }, - }, }, yAxis: { type: 'value', - axisLine: { - lineStyle: { - // color: '#E8595C' - }, - }, - splitLine: { - lineStyle: { - // color: '#ced6e0' - }, - }, }, series: [ { data: data.map((item) => item.value), type: 'line', - smooth: false, symbol: 'circle', symbolSize: 8, itemStyle: { @@ -75,6 +60,27 @@ const LineChart: FC = ({ data, title }) => { lineStyle: { width: 3, }, + markLine: showHorizontalLine + ? { + data: [ + { + yAxis: 35000, + label: { + formatter: '35K', + fontSize: 15, + // fontWeight: 'bold', + }, + }, + ], + lineStyle: { + type: 'dashed', + color: 'red', + width: 1.2, + }, + symbol: ['none', 'diamond'], + symbolSize: 7, + } + : undefined, }, ], };