23 lines
763 B
TypeScript
23 lines
763 B
TypeScript
import type { CurrentItem } from '../entities/current/types';
|
|
import { formatNumber } from '../utils/format';
|
|
|
|
type MetricWidgetProps = {
|
|
item: CurrentItem;
|
|
};
|
|
|
|
export function MetricWidget({ item }: MetricWidgetProps) {
|
|
const name = item.name?.trim() || item.tag;
|
|
const unit = item.unitOfMeasurement?.trim();
|
|
|
|
return (
|
|
<article className="metric-widget" title={`${name} (${item.tag})`}>
|
|
<span className="metric-widget__id">{item.tag}</span>
|
|
<span className="metric-widget__name">{name}</span>
|
|
<span className="metric-widget__reading">
|
|
<strong className="metric-widget__value">{formatNumber(item.value)}</strong>
|
|
{unit ? <span className="metric-widget__unit">{unit}</span> : null}
|
|
</span>
|
|
</article>
|
|
);
|
|
}
|