109 lines
3.3 KiB
TypeScript
109 lines
3.3 KiB
TypeScript
/**
|
|
* Copyright (c) 2023-present Plane Software, Inc. and contributors
|
|
* SPDX-License-Identifier: AGPL-3.0-only
|
|
* See the LICENSE file for details.
|
|
*/
|
|
|
|
import { MoreHorizontal, Bell, BellOff } from "lucide-react";
|
|
import { useTranslation } from "@plane/i18n";
|
|
import { getIconButtonStyling } from "@plane/propel/icon-button";
|
|
import { CheckCircleFilledIcon, CloseCircleFilledIcon, CopyLinkIcon, NewTabIcon } from "@plane/propel/icons";
|
|
import type { TContextMenuItem } from "@plane/ui";
|
|
import { ActionDropdown } from "@plane/ui";
|
|
|
|
type Props = {
|
|
canOpenTargetWorkItem: boolean;
|
|
canReviewClosedRequest: boolean;
|
|
includeDecisionActions?: boolean;
|
|
isSubscribed?: boolean;
|
|
isSubscriptionLoading?: boolean;
|
|
onAccept?: () => void;
|
|
onCopy: () => void;
|
|
onDecline?: () => void;
|
|
onOpenTarget?: () => void;
|
|
onToggleSubscription?: () => void;
|
|
};
|
|
|
|
export const ExternalContourActionsMenu = (props: Props) => {
|
|
const {
|
|
canOpenTargetWorkItem,
|
|
canReviewClosedRequest,
|
|
includeDecisionActions = false,
|
|
isSubscribed,
|
|
isSubscriptionLoading = false,
|
|
onAccept,
|
|
onCopy,
|
|
onDecline,
|
|
onOpenTarget,
|
|
onToggleSubscription,
|
|
} = props;
|
|
const { t } = useTranslation();
|
|
|
|
const items: TContextMenuItem[] = [
|
|
{
|
|
key: "accept",
|
|
action: () => onAccept?.(),
|
|
shouldRender: includeDecisionActions && canReviewClosedRequest && !!onAccept,
|
|
customContent: (
|
|
<div className="flex items-center gap-2 text-success-secondary">
|
|
<CheckCircleFilledIcon width={14} height={14} />
|
|
{t("external_contours_page.actions.accept")}
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
key: "decline",
|
|
action: () => onDecline?.(),
|
|
shouldRender: includeDecisionActions && canReviewClosedRequest && !!onDecline,
|
|
customContent: (
|
|
<div className="flex items-center gap-2 text-danger-secondary">
|
|
<CloseCircleFilledIcon width={14} height={14} />
|
|
{t("external_contours_page.actions.decline")}
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
key: "copy",
|
|
action: onCopy,
|
|
customContent: (
|
|
<div className="flex items-center gap-2">
|
|
<CopyLinkIcon width={14} height={14} />
|
|
{t("external_contours_page.actions.copy")}
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
key: "open",
|
|
action: () => onOpenTarget?.(),
|
|
shouldRender: canOpenTargetWorkItem && !!onOpenTarget,
|
|
customContent: (
|
|
<div className="flex items-center gap-2">
|
|
<NewTabIcon width={14} height={14} />
|
|
{t("external_contours_page.actions.open")}
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
key: "toggle-subscription",
|
|
action: () => onToggleSubscription?.(),
|
|
shouldRender: canOpenTargetWorkItem && !!onToggleSubscription,
|
|
disabled: isSubscriptionLoading || isSubscribed === undefined,
|
|
customContent: (
|
|
<div className="flex items-center gap-2">
|
|
{isSubscribed ? <BellOff width={14} height={14} /> : <Bell width={14} height={14} />}
|
|
{isSubscribed ? t("common.actions.unsubscribe") : t("common.actions.subscribe")}
|
|
</div>
|
|
),
|
|
},
|
|
];
|
|
|
|
return (
|
|
<ActionDropdown
|
|
items={items}
|
|
button={<MoreHorizontal className="size-4" />}
|
|
buttonClassName={getIconButtonStyling("secondary", "lg")}
|
|
placement="bottom-start"
|
|
/>
|
|
);
|
|
};
|