/**
 * Copyright (c) 2023-present Plane Software, Inc. and contributors
 * SPDX-License-Identifier: AGPL-3.0-only
 * See the LICENSE file for details.
 */

import React from "react";
// helpers
import { Button } from "@plane/propel/button";
import { cn } from "@plane/utils";

type Props = {
  icon: React.ReactNode;
  title: string;
  disabled?: boolean;
  compactView?: boolean;
};

export function IssueDetailWidgetButton(props: Props) {
  const { icon, title, disabled = false, compactView = false } = props;
  return (
    <Button
      variant={"secondary"}
      disabled={disabled}
      size="xl"
      className={cn(
        "border-transparent shadow-none focus-visible:outline-none",
        compactView
          ? "h-10 rounded-[18px] bg-layer-2/80 px-4 backdrop-blur-xl hover:bg-layer-2-active"
          : "rounded-md"
      )}
    >
      {icon && icon}
      <span className="text-body-xs-medium">{title}</span>
    </Button>
  );
}
