42 lines
1.2 KiB
TypeScript
42 lines
1.2 KiB
TypeScript
import { useEffect, useRef, useState } from "react";
|
|
import { Text } from "react-native";
|
|
import { COUNTDOWN_INTERVAL_MS } from "@/lib/constants";
|
|
import { formatResetCountdown, formatResetCountdownISO } from "@/lib/timeUtils";
|
|
|
|
interface ResetCountdownProps {
|
|
resetAtSeconds?: number;
|
|
resetAtISO?: string;
|
|
}
|
|
|
|
export function ResetCountdown({ resetAtSeconds, resetAtISO }: ResetCountdownProps) {
|
|
const latest = useRef({ resetAtSeconds, resetAtISO });
|
|
latest.current = { resetAtSeconds, resetAtISO };
|
|
|
|
const getLabel = () => {
|
|
if (latest.current.resetAtSeconds !== undefined) {
|
|
return formatResetCountdown(latest.current.resetAtSeconds);
|
|
}
|
|
if (latest.current.resetAtISO) return formatResetCountdownISO(latest.current.resetAtISO);
|
|
return "";
|
|
};
|
|
|
|
const [label, setLabel] = useState(getLabel);
|
|
|
|
useEffect(() => {
|
|
const update = () => setLabel(getLabel());
|
|
update();
|
|
const interval = setInterval(update, COUNTDOWN_INTERVAL_MS);
|
|
return () => clearInterval(interval);
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
setLabel(getLabel());
|
|
}, [resetAtSeconds, resetAtISO]);
|
|
|
|
if (!label) return null;
|
|
|
|
return (
|
|
<Text className="text-xs text-neutral-500 dark:text-neutral-400">{label}</Text>
|
|
);
|
|
}
|