import * as React from "react";
import { CardProps } from "./types";

export const Card = ({ card }: { card: CardProps }) => {
  return (
    <div className="card" key="{idx}">
      <img src={card.imageUrl} alt={card.name} />
      <div className="content">
        <h4>{card.name}</h4>
        <p className="card-text">{card.text}</p>
        <table>
          <tbody>
            <tr>
              <td>
                <strong>Set Name:</strong>
              </td>
              <td>{card.set.name}</td>
            </tr>
            <tr>
              <td>
                <strong>Type:</strong>
              </td>
              <td>{card.type}</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  );
};