UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: миграция P0 action-menu на ActionDropdown

This commit is contained in:
DCCONSTRUCTIONS
2026-04-22 12:24:05 +03:00
parent 54a648bb91
commit b0173c82e6
7 changed files with 107 additions and 321 deletions
@@ -8,7 +8,8 @@ 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 { CustomMenu } from "@plane/ui";
import type { TContextMenuItem } from "@plane/ui";
import { ActionDropdown } from "@plane/ui";
type Props = {
canOpenTargetWorkItem: boolean;
@@ -38,54 +39,70 @@ export const ExternalContourActionsMenu = (props: Props) => {
} = props;
const { t } = useTranslation();
return (
<CustomMenu
customButton={<MoreHorizontal className="size-4" />}
customButtonClassName={getIconButtonStyling("secondary", "lg")}
placement="bottom-start"
>
{includeDecisionActions && canReviewClosedRequest && onAccept && (
<CustomMenu.MenuItem onClick={onAccept}>
<div className="flex items-center gap-2 text-success-secondary">
<CheckCircleFilledIcon width={14} height={14} />
{t("external_contours_page.actions.accept")}
</div>
</CustomMenu.MenuItem>
)}
{includeDecisionActions && canReviewClosedRequest && onDecline && (
<CustomMenu.MenuItem onClick={onDecline}>
<div className="flex items-center gap-2 text-danger-secondary">
<CloseCircleFilledIcon width={14} height={14} />
{t("external_contours_page.actions.decline")}
</div>
</CustomMenu.MenuItem>
)}
<CustomMenu.MenuItem onClick={onCopy}>
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>
</CustomMenu.MenuItem>
),
},
{
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>
),
},
];
{canOpenTargetWorkItem && onOpenTarget && (
<CustomMenu.MenuItem onClick={onOpenTarget}>
<div className="flex items-center gap-2">
<NewTabIcon width={14} height={14} />
{t("external_contours_page.actions.open")}
</div>
</CustomMenu.MenuItem>
)}
{canOpenTargetWorkItem && onToggleSubscription && (
<CustomMenu.MenuItem onClick={onToggleSubscription} disabled={isSubscriptionLoading || isSubscribed === undefined}>
<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>
</CustomMenu.MenuItem>
)}
</CustomMenu>
return (
<ActionDropdown
items={items}
button={<MoreHorizontal className="size-4" />}
buttonClassName={getIconButtonStyling("secondary", "lg")}
placement="bottom-start"
/>
);
};