import React, { useState } from 'react';
import BooksListItem from './BooksListItem';
import type { Book } from './Book';

const initialBooks: Book[] = [
  {
    id: 1,
    title: 'JavaScript - Das umfassende Handbuch',
    author: 'Philip Ackermann',
    isbn: '978-3836286299',
    rating: 5,
  },
  {
    id: 2,
    title: 'Clean Code',
    author: 'Robert Martin',
    isbn: '978-0132350884',
    rating: 4,
  },
  {
    id: 3,
    title: 'Design Patterns',
    author: 'Erich Gamma',
    isbn: '978-0201633610',
    rating: 5,
  },
];

const BooksList: React.FC = () => {
  const [books, setBooks] = useState<Book[]>(initialBooks);

  return (
    <ul>
      {books.map((book) => (
        <BooksListItem key={book.id} book={book} />
      ))}
    </ul>
  );
};

export default BooksList;
