/* Starts with "--:--" on the server so the first client render matches,
   then sets the real Tehran time only after mount (avoids a hydration mismatch on the clock text) */
export function useTehranClock() {
  const now = ref<Date | null>(null);
  let t: ReturnType<typeof setInterval> | undefined;

  onMounted(() => {
    now.value = new Date();
    t = setInterval(() => (now.value = new Date()), 15000);
  });
  onBeforeUnmount(() => clearInterval(t));

  const time = computed(() =>
    now.value
      ? new Intl.DateTimeFormat("fa-IR", {
          hour: "2-digit",
          minute: "2-digit",
          timeZone: "Asia/Tehran",
        }).format(now.value)
      : "--:--",
  );

  const shift = computed(() => {
    if (!now.value) return "";
    const hour = Number(
      new Intl.DateTimeFormat("en-US", {
        hour: "numeric",
        hour12: false,
        timeZone: "Asia/Tehran",
      }).format(now.value),
    );
    return hour >= 6 && hour < 14 ? "صبح" : hour >= 14 && hour < 22 ? "عصر" : "شب";
  });

  return { time, shift };
}