import { useMemo } from "react";import { View } from "react-native"; import type { DailyTotals } from "@t3tools/shared/usageMerge"; import { buildChartDays, type UsageChartMetric } from "./usageChartData";import { useProviderColors } from "./usageProviders"; export interface UsageDailyChartProps {  readonly days: readonly string[];  readonly daily: readonly DailyTotals[];  readonly metric: UsageChartMetric;  readonly height: number;} /** * Stacked daily bars drawn with plain views. Android and any platform without * Swift Charts land here; iOS resolves `UsageDailyChart.ios.tsx` instead. */export function UsageDailyChart({ days, daily, metric, height }: UsageDailyChartProps) {  const colors = useProviderColors();  const chartDays = useMemo(() => buildChartDays(days, daily, metric), [days, daily, metric]);  const max = chartDays.reduce((peak, day) => Math.max(peak, day.total), 0);   return (    <View style={{ height }} className="flex-row items-end gap-px">      {/* column-reverse stacks the bottom-first provider values upward          without reversing the array (Hermes lacks Array#toReversed). */}      {chartDays.map((day) => (        <View key={day.day} className="h-full flex-1 flex-col-reverse overflow-hidden rounded-sm">          {day.values.map((entry) => (            <View              key={entry.provider}              style={{                height: max === 0 ? 0 : (entry.value / max) * height,                backgroundColor: colors[entry.provider],              }}            />          ))}        </View>      ))}    </View>  );}