import Image from "next/image";
import React, { useState } from "react";
import Modal from "./modal";

export default function Card({ img, url }) {
  const [showModal, setShowModal] = useState(false);

  const handleClick = () => {
    setShowModal(true);
  };
  return (
    <>
      <div
        onClick={(e) => handleClick()}
        className="border-2 overflow-hidden rounded cursor-pointer"
      >
        <Image
          src={`/static/forex-sinyal/${img}`}
          className={`object-cover w-full`}
          width={435}
          height={120}
        />
      </div>
      {showModal ? (
        <Modal showModal={showModal} setShowModal={setShowModal} url={url} />
      ) : null}
    </>
  );
}
