UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: карточка внешнего контура

plane-src/apps/web/ce/components/projects/external-contours/issue-header.tsx

@@ -7,16 +7,13 @@
 import { useCallback, useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
-import { MoveDiagonal, MoveRight } from "lucide-react";
+import { Check, MoveDiagonal, MoveRight, X } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import { IconButton } from "@plane/propel/icon-button";
-import { Button } from "@plane/propel/button";
 import {
   CenterPanelIcon,
-  CheckCircleFilledIcon,
   ChevronDownIcon,
   ChevronUpIcon,
-  CloseCircleFilledIcon,
   CopyLinkIcon,
   FullScreenPanelIcon,
   SidePanelIcon,
@@ -100,6 +97,7 @@ export const ExternalContoursIssueActionsHeader = observer(function ExternalCont
     contourRequest.capabilities?.can_source_decide ??
     (contourRequest.status === "closed" && contourRequest.source_decision !== "accepted");
   const isSourceAccepted = contourRequest.source_decision === "accepted";
+  const isDecisionSubmitting = loader === "mutation-loading";
 
   const redirectToRelativeIssue = useCallback(
     (direction: "next" | "prev") => {
@@ -291,16 +289,30 @@ export const ExternalContoursIssueActionsHeader = observer(function ExternalCont
 
           <div className="flex flex-wrap items-center gap-2">
             {canReviewClosedRequest && (
-              <>
-                <Button variant="primary" size="lg" onClick={() => handleDecision("accept")} className="nodedc-external-primary-button">
-                  <CheckCircleFilledIcon className="size-4 shrink-0 text-success-secondary" />
-                  {t("external_contours_page.actions.accept")}
-                </Button>
-                <Button variant="secondary" size="lg" onClick={() => setIsDeclineModalOpen(true)} className="nodedc-external-action-button">
-                  <CloseCircleFilledIcon className="size-4 shrink-0 text-danger-secondary" />
-                  {t("external_contours_page.actions.decline")}
-                </Button>
-              </>
+              <div className="nodedc-external-decision-cluster">
+                <Tooltip tooltipContent={t("external_contours_page.actions.accept")}>
+                  <button
+                    type="button"
+                    aria-label={t("external_contours_page.actions.accept")}
+                    onClick={() => handleDecision("accept")}
+                    disabled={isDecisionSubmitting}
+                    className="nodedc-external-decision-button nodedc-external-decision-button-accept"
+                  >
+                    <Check className="size-4" strokeWidth={2.6} />
+                  </button>
+                </Tooltip>
+                <Tooltip tooltipContent={t("external_contours_page.actions.decline")}>
+                  <button
+                    type="button"
+                    aria-label={t("external_contours_page.actions.decline")}
+                    onClick={() => setIsDeclineModalOpen(true)}
+                    disabled={isDecisionSubmitting}
+                    className="nodedc-external-decision-button nodedc-external-decision-button-decline"
+                  >
+                    <X className="size-4" strokeWidth={2.5} />
+                  </button>
+                </Tooltip>
+              </div>
             )}
 
             {isSourceAccepted && (