/**
 * Page PlaylistCreatePage
 * T0462: Create Playlist Routes
 */

import { useNavigate } from 'react-router-dom';
import { PlaylistForm } from '../components/PlaylistForm';
import { useCreatePlaylist } from '../hooks/usePlaylist';
import { useToast } from '@/hooks/useToast';
import type { CreatePlaylistRequest } from '../types';

export function PlaylistCreatePage() {
  const navigate = useNavigate();
  const { toast } = useToast();
  const createMutation = useCreatePlaylist();

  const handleSubmit = async (data: CreatePlaylistRequest) => {
    try {
      await createMutation.mutateAsync(data);
      toast({
        title: 'Succès',
        description: 'Playlist créée avec succès',
      });
      navigate('/playlists');
    } catch (error) {
      toast({
        title: 'Erreur',
        description: error instanceof Error ? error.message : 'Une erreur est survenue',
        variant: 'destructive',
      });
    }
  };

  const handleCancel = () => {
    navigate('/playlists');
  };

  return (
    <div className="space-y-6">
      <div>
        <h1 className="text-3xl font-bold tracking-tight">Créer une playlist</h1>
        <p className="text-muted-foreground">
          Créez une nouvelle playlist pour organiser vos morceaux
        </p>
      </div>
      <div className="max-w-2xl">
        <PlaylistForm
          onSubmit={handleSubmit}
          onCancel={handleCancel}
          submitLabel="Créer"
        />
      </div>
    </div>
  );
}

