import List from "antd/lib/list";
import { Text } from "components/Typography";
import React from "react";

interface CardModuleActionProps {
  onCopyLink?: () => void;
  onDelete?: () => void;
  onEdit?: () => void;
  toggleVisible: (value: boolean) => void;
  copySmartLink?: boolean;
}

const CardModuleAction: React.FC<CardModuleActionProps> = ({
  onEdit,
  onDelete,
  onCopyLink,
  toggleVisible,
  copySmartLink,
}) => {
  const onClose = () => {
    toggleVisible && toggleVisible(false);
  };

  const onEditModule = () => {
    onEdit && onEdit();
    onClose();
  };

  const onDeleteModule = () => {
    onDelete && onDelete();
    onClose();
  };
  const handleCopyLink = () => {
    onCopyLink && onCopyLink();
    onClose();
  };

  return (
    <List data-testid="card-module-action" className="module-editor__acitons">
      {copySmartLink ? (
        <List.Item onClick={handleCopyLink}>
          <Text preset="semibold14">Copy Smart Link</Text>
        </List.Item>
      ) : null}
      {onEdit ? (
        <List.Item onClick={onEditModule}>
          <Text preset="semibold14">Edit</Text>
        </List.Item>
      ) : null}
      {onDelete ? (
        <List.Item onClick={onDeleteModule}>
          <Text preset="semibold14" className="text--red">
            Delete
          </Text>
        </List.Item>
      ) : null}
    </List>
  );
};

export default CardModuleAction;
