ActualEbitdaCard
Stat card summarising the realised EBITDA for the selected reporting window vs the prior period.
Stat card summarising the realised EBITDA for the selected reporting window vs the prior period.
import { ActualEbitdaCard } from "@tetherto/mdk-react-devkit";| Prop | Status | Type | Default | Description |
|---|---|---|---|---|
value | Required | number | — | — |
Usage
Individual stat cards and charts used inside the EBITDA section.
| Component | Description |
|---|---|
ActualEbitdaCard | Computed actual EBITDA for the selected period. |
EbitdaHodlCard | EBITDA projection assuming all BTC is held (hodl). |
EbitdaSellingCard | EBITDA projection assuming all BTC is sold at current price. |
BitcoinProducedCard | Total Bitcoin mined in the selected period. |
BitcoinPriceCard | Current or average Bitcoin price for the period. |
BitcoinProductionCostCard | Per-BTC production cost for the period. |
BitcoinProducedChart | Bar chart of Bitcoin produced over time. |
MonthlyEbitdaChart | Monthly EBITDA bar chart. |
Examples
import { ActualEbitdaCard } from '@tetherto/mdk-react-devkit'export const ActualEbitdaCardExample = () => ( <div className="mdk-example-row"> <ActualEbitdaCard value={125000} /> </div>)import { BitcoinPriceCard } from '@tetherto/mdk-react-devkit'export const BitcoinPriceCardExample = () => ( <div className="mdk-example-row"> <BitcoinPriceCard value={125000} /> </div>)import { BitcoinProducedCard } from '@tetherto/mdk-react-devkit'export const BitcoinProducedCardExample = () => ( <div className="mdk-example-row"> <BitcoinProducedCard value={125000} /> </div>)import { BitcoinProducedChart } from '@tetherto/mdk-react-devkit'export const BitcoinProducedChartExample = () => ( <div className="mdk-example-row"> <BitcoinProducedChart chartData={{ labels: [], datasets: [] } as never} isLoading={false} /> </div>)import { BitcoinProductionCostCard } from '@tetherto/mdk-react-devkit'export const BitcoinProductionCostCardExample = () => ( <div className="mdk-example-row"> <BitcoinProductionCostCard value={28000} /> </div>)import { EbitdaHodlCard } from '@tetherto/mdk-react-devkit'export const EbitdaHodlCardExample = () => ( <div className="mdk-example-row"> <EbitdaHodlCard value={125000} currentBTCPrice={65000} /> </div>)import { EbitdaSellingCard } from '@tetherto/mdk-react-devkit'export const EbitdaSellingCardExample = () => ( <div className="mdk-example-row"> <EbitdaSellingCard value={125000} /> </div>)import { MonthlyEbitdaChart } from '@tetherto/mdk-react-devkit'export const MonthlyEbitdaChartExample = () => ( <div className="mdk-example-row"> <MonthlyEbitdaChart chartData={{ labels: [], datasets: [] } as never} /> </div>)PoolDetailsPopover
Button-triggered popover that displays a pool's key/value details (URL, fee, worker count, status, …) inside a Radix `Dialog`. Wraps `PoolDetailsCard` so the…
AvgAllInCostChart
Avg All-in Cost - revenue vs cost ($/MWh) bar chart over time. Renders the OSS `SiteEnergyVsCostChart`. The revenue/cost time-series isn't carried by the cos…