import type { ClientView } from '@/lib/client-view';

interface NotesSectionProps {
  notes: ClientView['notes'];
}

export function NotesSection({ notes }: NotesSectionProps) {
  if (notes.length === 0) {
    return (
      <p className="text-sm text-muted-foreground italic">
        Nessuna nota ancora registrata. Le decisioni appariranno qui man mano che il progetto avanza.
      </p>
    );
  }

  return (
    <div className="space-y-3">
      {notes.map((note) => {
        const dateFormatted = new Date(note.created_at).toLocaleDateString('it-IT', {
          year: 'numeric',
          month: 'long',
          day: 'numeric',
        });
        const timeFormatted = new Date(note.created_at).toLocaleTimeString('it-IT', {
          hour: '2-digit',
          minute: '2-digit',
        });

        return (
          <div
            key={note.id}
            className="rounded-xl border border-border-light bg-card shadow-card p-5"
          >
            {/* Testo nota — sola lettura (D-12: admin scrive, cliente legge) */}
            <p className="text-xs text-foreground leading-relaxed whitespace-pre-wrap">
              {note.body}
            </p>

            {/* Timestamp */}
            <p className="text-[11px] text-muted-foreground mt-3">
              {dateFormatted} alle {timeFormatted}
            </p>
          </div>
        );
      })}
    </div>
  );
}