import type { Post } from "../../classes/post";
import type { BaseElementProps } from "../../types";
import {
  AddPostToThreadButton, AddRepostsButton,
  DeletePostButton, EditPostButton
} from "../buttons/posts";
import { RepostStatusIcon } from "./repostData";

interface PostDataHeaderOptions extends BaseElementProps {
  content: Post;
  posted: boolean;
};

export default function PostDataHeader(props: PostDataHeaderOptions) {
  const content: Post = props.content;

  // if this post can be manipulated in some way
  const canBeEdited: boolean = !props.posted && !content.isRepost;
  const canBeDeleted: boolean = (!props.posted || content.isRepost) ?? false;
  const canAddReposts: boolean = content.canAddMoreRepostRules();

  // show the header if any of the above cases is true
  const canSeeHeader = canBeEdited || canBeDeleted || canAddReposts;
  return (<header class="postItemHeader"
    data-item={content.uuid}
    data-root={content.rootPost ?? content.uuid}
    data-parent={content.isChildPost ? content.parentPost : undefined}
    data-repost={content.isRepost ? true : undefined}
    data-scheduled={!props.posted || undefined}
    hidden={canSeeHeader ? undefined : true}>
    <RepostStatusIcon isRepost={content.isRepost} />
    {canBeEdited ? <EditPostButton id={content.uuid} /> : null}
    {canBeEdited ? <AddPostToThreadButton /> : null}
    {canAddReposts ? <AddRepostsButton /> : null}
    {canBeDeleted ? <DeletePostButton id={content.uuid} isRepost={content.isRepost} child={content.isChildPost} /> : null}
  </header>);
}