'use client';

import { useEffect } from 'react';

type Props = {
  error: Error;
  reset: () => void;
};

const BookDetailError: React.FC<Props> = ({ error, reset }) => {
  useEffect(() => {
    console.error('Route error:', error);
  }, [error]);

  return (
    <div style={{ padding: '2rem' }}>
      <h2>Da ist etwas schiefgelaufen.</h2>
      <p>{error.message}</p>

      <button
        onClick={() => reset()}
        style={{
          marginTop: '1rem',
          padding: '0.5rem 1rem',
          border: '1px solid #ccc',
          borderRadius: 4,
        }}
      >
        Erneut versuchen
      </button>
    </div>
  );
};

export default BookDetailError;
