/**
 * Navigation Bar Time Display Component
 * 
 * Displays current date and time in the navigation bar.
 * Uses unified refresh system for consistent time updates.
 */

"use client";

import { useState } from "react";
import { format } from 'date-fns';
import { fr } from 'date-fns/locale';
import { useUnifiedRefresh } from '@/hooks/use-unified-refresh';
import { REFRESH_INTERVALS } from '@/lib/constants/refresh-intervals';

export function MainNavTime() {
  const [currentTime, setCurrentTime] = useState(new Date());

  // Update time using unified refresh system
  useUnifiedRefresh({
    resource: 'navbar-time',
    interval: REFRESH_INTERVALS.NAVBAR_TIME,
    enabled: true, // Always enabled (no auth required for time display)
    onRefresh: async () => {
      setCurrentTime(new Date());
    },
    priority: 'high', // High priority for real-time clock
  });

  const formattedDate = format(currentTime, "d MMMM yyyy", { locale: fr });
  const formattedTime = format(currentTime, "HH:mm");

  return (
    <div className="hidden md:flex flex-col items-center">
      <div className="text-white/80 text-xs">{formattedDate}</div>
      <div className="text-white text-sm font-medium">{formattedTime}</div>
    </div>
  );
}