import { useEffect, useState } from "react";
import { api, errorMessage, type Genre } from "../api";

export function useGenres(): { genres: Genre[]; error: string | null } {
  const [genres, setGenres] = useState<Genre[]>([]);
  const [error, setError] = useState<string | null>(null);
  useEffect(() => {
    api<Genre[]>("GET", "/genres").then(setGenres, (err) =>
      setError(errorMessage(err)),
    );
  }, []);
  return { genres, error };
}