28 lines
865 B
TypeScript
28 lines
865 B
TypeScript
import { View, Text } from "react-native";
|
|
import { ProgressBar } from "./ProgressBar";
|
|
import { ResetCountdown } from "./ResetCountdown";
|
|
|
|
interface UsageStatProps {
|
|
label: string;
|
|
percent: number;
|
|
resetAtSeconds?: number;
|
|
resetAtISO?: string;
|
|
}
|
|
|
|
export function UsageStat({ label, percent, resetAtSeconds, resetAtISO }: UsageStatProps) {
|
|
return (
|
|
<View className="gap-y-1.5 mb-4">
|
|
<View className="flex-row justify-between items-center">
|
|
<Text className="text-sm font-medium text-neutral-700 dark:text-neutral-300">
|
|
{label}
|
|
</Text>
|
|
<Text className="text-sm font-semibold text-neutral-900 dark:text-white">
|
|
{Math.round(percent)}%
|
|
</Text>
|
|
</View>
|
|
<ProgressBar percent={percent} />
|
|
<ResetCountdown resetAtSeconds={resetAtSeconds} resetAtISO={resetAtISO} />
|
|
</View>
|
|
);
|
|
}
|