book

import React, { useState } from 'react';
import PropTypes from 'prop-types';
import './Book.css';
import Card from 'react-bootstrap/Card';
//import decode from 'jwt-decode';
import Reviews from './Reviews';
import { useAuth } from '../../auth/authContext';

//import Reviews from './Reviews';
/* eslint-disable */
const Book = (props) => {
  const { book, borrowBook, returnBook } = props;
  const [showTab, setShowTab] = useState(false);
  const [status, setStatus] = useState('');
  const handleBorrow = () => {
    setStatus('borrowed');
    borrowBook(book.id);
  };
  const handleReturn = () => returnBook(book.id);

  const { user } = useAuth();

  // console.log(book);
  const imgSource = () => {
    if (book.id % 2 === 0) {
      return 'https://forum.telerikacademy.com/uploads/default/original/2X/b/b89c87e412a2ac743f3f6ce63c5e34123b1c8713.jpeg';
    } else {
      return 'https://forum.telerikacademy.com/uploads/default/optimized/2X/2/2be7497b93dc1f3f0dca455d1d5bfc2adaecf900_2_750x750.jpeg';
    }
  };

  const Buttons = () => {
    if (book.book_status == 'free') {
      return <button onClick={handleBorrow}>Borrow</button>;
    } else if (
      book.book_status == 'borrowed' &&
      user.username === book.borrowed_by
    ) {
      return <button onClick={handleReturn}>Return</button>;
    } else {
      return <div></div>;
    }
  };

  const extra = (
    <div>
      <p>Author: {book.author}</p>
      <p>Status: {book.book_status}</p>
      <Buttons />
      <br />
      <Reviews book={book} />
    </div>
  );

  const handleToggle = () => {
    setShowTab((preState) => !preState);
  };

  return (
    <Card style={{ width: '18rem' }}>
      <Card.Img variant='top' src={imgSource()} />
      <Card.Body>
        <Card.Title>{book.name}</Card.Title>
        <input
          type='button'
          value={`${showTab ? 'Hide' : 'Show'} Info`}
          onClick={handleToggle}
        ></input>
        {showTab && extra}
      </Card.Body>
    </Card>
  );
};

Book.propTypes = {
  book: PropTypes.object.isRequired,
};

export default Book;