import { Button, ButtonProps } from "@/ui";
import { t } from "i18next";
import { PlusCircleIcon } from "lucide-react";
import { forwardRef } from "react";

export interface AppendEmptyRowButtonProps extends ButtonProps {
  label?: string;
  className?: string;
}

export const AppendEmptyRowButton = forwardRef<HTMLButtonElement, AppendEmptyRowButtonProps>(
  (
    { label = t("common.append_empty_row"), className, ...props }: AppendEmptyRowButtonProps,
    ref
  ): JSX.Element => (
    <Button type='button' variant='outline' ref={ref} {...props}>
      <PlusCircleIcon className={label ? "w-4 h-4 mr-2" : "w-4 h-4"} />
      {label && <>{label}</>}
    </Button>
  )
);

AppendEmptyRowButton.displayName = "AppendEmptyRowButton";
