import { FC, useEffect, useState } from "react"; import TimezoneSelect, { ITimezoneOption } from "react-timezone-select"; import Switch from "@calcom/ui/Switch"; import { useLocale } from "@lib/hooks/useLocale"; import { is24h, timeZone } from "../../lib/clock"; type Props = { onSelectTimeZone: (selectedTimeZone: string) => void; onToggle24hClock: (is24hClock: boolean) => void; }; const TimeOptions: FC = ({ onToggle24hClock, onSelectTimeZone }) => { const [selectedTimeZone, setSelectedTimeZone] = useState(""); const [is24hClock, setIs24hClock] = useState(false); 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 shadow-sm focus:ring-black sm:text-sm" />
) : null; }; export default TimeOptions;