import { Calendar, MapPin, Plus, Sparkles } from 'lucide-react';
import React from 'react';
import { Button } from '@/components/ui/button';

interface EmptyStateProps {
  type: 'no-days' | 'no-active-day' | 'no-places';
  onAction?: () => void;
  onAISuggestions?: () => void;
  dayNumber?: number;
}

export const EmptyState: React.FC<EmptyStateProps> = ({ type, onAction, onAISuggestions, dayNumber }) => {
  if (type === 'no-days') {
    return (
      <div className="flex flex-col items-center justify-center h-full min-h-[400px] text-center p-8">
        <Calendar className="h-20 w-20 mb-4 text-muted-foreground/20" />
        <h3 className="text-2xl font-bold mb-2">Henüz gün oluşturulmadı</h3>
        <p className="text-muted-foreground mb-6 max-w-md">
          Seyahatiniz için günlük plan oluşturun ve her güne yerler ekleyin
        </p>
        <Button size="lg" className="rounded-full" onClick={onAction}>
          <Plus className="h-5 w-5 mr-2" />
          İlk Günü Oluştur
        </Button>
      </div>
    );
  }

  if (type === 'no-active-day') {
    return (
      <div className="flex flex-col items-center justify-center h-full min-h-[400px] text-center p-8">
        <MapPin className="h-20 w-20 mb-4 text-muted-foreground/20" />
        <h3 className="text-2xl font-bold mb-2">Bir gün seçin</h3>
        <p className="text-muted-foreground max-w-md">
          Planlamaya başlamak için soldaki günlerden birini seçin
        </p>
      </div>
    );
  }

  if (type === 'no-places') {
    return (
      <div className="flex flex-col items-center justify-center min-h-[300px] text-center p-8 border-2 border-dashed border-border rounded-2xl bg-muted/30">
        <MapPin className="h-16 w-16 mb-4 text-muted-foreground/20" />
        <h3 className="text-xl font-bold mb-2">Bu gün boş görünüyor 👀</h3>
        <p className="text-muted-foreground mb-6 max-w-md">
          Yakın yerleri ekleyelim mi?
        </p>
        <div className="flex flex-col sm:flex-row gap-3">
          <Button size="lg" className="rounded-full" onClick={onAISuggestions}>
            <Sparkles className="h-5 w-5 mr-2" />
            AI Önerileri
          </Button>
          <Button size="lg" variant="outline" className="rounded-full" onClick={onAction}>
            <Plus className="h-5 w-5 mr-2" />
            Yer Ekle
          </Button>
        </div>
      </div>
    );
  }

  return null;
};
