import { FC, useEffect, useState } from "react"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import TimezoneSelect, { ITimezoneOption } from "@calcom/ui/form/TimezoneSelect"; import { Switch } from "@calcom/ui/v2"; import { is24h, timeZone } from "../../lib/clock"; type Props = { onSelectTimeZone: (selectedTimeZone: string) => void; onToggle24hClock: (is24hClock: boolean) => void; timeFormat: string; }; const TimeOptions: FC = ({ onToggle24hClock, onSelectTimeZone, timeFormat }) => { const [selectedTimeZone, setSelectedTimeZone] = useState(""); const [is24hClock, setIs24hClock] = useState(timeFormat === "HH:mm" && true); const { t } = useLocale(); useEffect(() => { setIs24hClock(is24h()); setSelectedTimeZone(timeZone()); }, []); useEffect(() => { if (selectedTimeZone && timeZone() && selectedTimeZone !== timeZone()) { onSelectTimeZone(timeZone(selectedTimeZone)); } }, [selectedTimeZone, onSelectTimeZone]); const handle24hClockToggle = (is24hClock: boolean) => { setIs24hClock(is24hClock); onToggle24hClock(is24h(is24hClock)); }; return selectedTimeZone !== "" ? (
{t("time_options")}
setSelectedTimeZone(tz.value)} className="focus:border-brand mt-1 mb-2 block w-full rounded-md border-gray-300 text-sm focus:ring-black" />
) : null; }; export default TimeOptions;