Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | 20x 7x 5x 7x 5x 20x 12x 12x 5x 17x 20x | import type { ResourceMetric } from "@/api/apiStore.gen";
import {
formatAmount,
formatUnit,
} from "../../shared/model/economicsFormatters";
import { KeyFinancialMetricsFrame } from "./KeyFinancialMetricsTable";
import { ResultDataTable } from "./resultTable";
import { resultColumn } from "./resultTableColumns";
export function KeyResourceMetricsTable({
metrics,
resultCurrency,
}: {
metrics: ResourceMetric[];
resultCurrency: string;
}) {
const columns = [
resultColumn<ResourceMetric>({
key: "metric",
header: "Metric",
render: (metric) => metric.label,
}),
resultColumn<ResourceMetric>({
key: "value",
header: "Value",
headClassName: "text-right",
cellClassName: "text-right tabular-nums",
render: (metric) => resourceMetricValue(metric, resultCurrency),
}),
];
return (
<KeyFinancialMetricsFrame
ariaLabel="Key resource metrics"
title="Key resource metrics"
>
<ResultDataTable
ariaLabel="Key resource metric rows"
columns={columns}
rows={metrics}
getRowKey={(metric) => metric.row_key}
/>
</KeyFinancialMetricsFrame>
);
}
function resourceMetricValue(metric: ResourceMetric, resultCurrency: string) {
if (metric.amount == null) {
return resourceMetricStatusLabel(metric.status);
}
return `${formatAmount(metric.amount, {
maximumFractionDigits: metric.maximum_fraction_digits,
})} ${formatUnit(metric.unit, resultCurrency)}`;
}
function resourceMetricStatusLabel(status: string) {
const labels: Record<string, string> = {
available: "-",
missing_metric: "Unavailable",
unit_mismatch: "Unit mismatch",
unavailable: "Unavailable",
};
return labels[status] ?? "Unavailable";
}
|