import React, { MouseEventHandler } from "react";
import { Link } from "react-router-dom";
import { PostType } from "../types";
import { IntoPost } from "./intopost";

export type Props = {
  post: PostType;
  handleClick: MouseEventHandler;
};

export default function Post({ handleClick, post }: Props) {
  return (
    <div className="flex flex-row h-16 divide-x-2 border-2 border-solid">
      <div className="basis-full">
        <Link to={`/post/${post._id}`} state={post}>
          <button id={post._id} onClick={handleClick}>
            {post.title}
          </button>
        </Link>
      </div>
      <div className="basis-3/12">{post.date}</div>
      <div className="basis-2/12">{post.counts}</div>
    </div>
  );
}