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
|
import type { TickerOverview } from "@/types/api";
import { fmtCurrency, fmtLarge, fmtNumber } from "@/lib/format";
type Props = {
overview: TickerOverview;
};
export function ValuationOverviewCard({ overview }: Props) {
const rows = [
{ label: "Market Cap", value: fmtLarge(overview.stats.market_cap), missing: overview.stats.market_cap == null },
{ label: "P/E TTM", value: overview.stats.trailing_pe == null ? "-" : `${fmtNumber(overview.stats.trailing_pe)}x`, missing: overview.stats.trailing_pe == null },
{ label: "EPS TTM", value: fmtCurrency(overview.stats.trailing_eps), missing: overview.stats.trailing_eps == null },
{ label: "P/B", value: overview.ratios.price_to_book == null ? "-" : `${fmtNumber(overview.ratios.price_to_book)}x`, missing: overview.ratios.price_to_book == null },
{ label: "P/S", value: overview.ratios.price_to_sales == null ? "-" : `${fmtNumber(overview.ratios.price_to_sales)}x`, missing: overview.ratios.price_to_sales == null },
{ label: "EV/Sales", value: overview.ratios.ev_to_sales == null ? "-" : `${fmtNumber(overview.ratios.ev_to_sales)}x`, missing: overview.ratios.ev_to_sales == null },
{ label: "EV/EBITDA", value: overview.ratios.ev_to_ebitda == null ? "-" : `${fmtNumber(overview.ratios.ev_to_ebitda)}x`, missing: overview.ratios.ev_to_ebitda == null },
];
const visible = rows.filter((r) => !r.missing);
return (
<section className="psm-card">
<div className="psm-card-head">
<div>
<div className="psm-eyebrow">Valuation</div>
<h2 className="psm-card-title">Valuation</h2>
</div>
</div>
{visible.length > 0 && (
<div className="psm-stat-list">
{visible.map((row) => (
<div key={row.label} className="psm-stat-row">
<span className="psm-stat-label">{row.label}</span>
<span className="psm-stat-value">{row.value}</span>
</div>
))}
</div>
)}
</section>
);
}
|