From 0ef74fdc8e34aede30c5eb05df73cfe3715c25c4 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Wed, 19 Feb 2025 02:33:44 +0530
Subject: [PATCH] fix: cmd-k project level action in work item detail page

---
 .../command-palette/modals/issue-level.tsx    | 30 +++++++-------
 .../command-palette/command-palette.tsx       | 39 ++++++++++++++++---
 2 files changed, 47 insertions(+), 22 deletions(-)

diff --git a/web/ce/components/command-palette/modals/issue-level.tsx b/web/ce/components/command-palette/modals/issue-level.tsx
index 316ff9f2186..ea58908fb44 100644
--- a/web/ce/components/command-palette/modals/issue-level.tsx
+++ b/web/ce/components/command-palette/modals/issue-level.tsx
@@ -1,6 +1,6 @@
+import { FC } from "react";
 import { observer } from "mobx-react";
 import { useParams, usePathname } from "next/navigation";
-import useSWR from "swr";
 // components
 import { BulkDeleteIssuesModal } from "@/components/core";
 import { CreateUpdateIssueModal, DeleteIssueModal } from "@/components/issues";
@@ -10,17 +10,25 @@ import { useCommandPalette, useIssueDetail, useUser } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 import { useIssuesStore } from "@/hooks/use-issue-layout-store";
 
-export const IssueLevelModals = observer(() => {
+type Props = {
+  projectId: string | undefined;
+  issueId: string | undefined;
+};
+
+export const IssueLevelModals: FC<Props> = observer((props) => {
+  const { projectId, issueId } = props;
   // router
   const pathname = usePathname();
-  const { workspaceSlug, projectId: paramsProjectId, workItem, cycleId, moduleId } = useParams();
+  const { workspaceSlug, cycleId, moduleId } = useParams();
   const router = useAppRouter();
   // store hooks
   const { data: currentUser } = useUser();
+  const {
+    issue: { getIssueById },
+  } = useIssueDetail();
   const {
     issues: { removeIssue },
   } = useIssuesStore();
-  const { fetchIssueWithIdentifier } = useIssueDetail();
   const {
     isCreateIssueModalOpen,
     toggleCreateIssueModal,
@@ -30,21 +38,9 @@ export const IssueLevelModals = observer(() => {
     toggleBulkDeleteIssueModal,
   } = useCommandPalette();
   // derived values
+  const issueDetails = issueId ? getIssueById(issueId) : undefined;
   const isDraftIssue = pathname?.includes("draft-issues") || false;
 
-  const projectIdentifier = workItem?.toString().split("-")[0];
-  const sequence_id = workItem?.toString().split("-")[1];
-
-  const { data: issueDetails } = useSWR(
-    workspaceSlug && workItem ? `ISSUE_DETAIL_${workspaceSlug}_${projectIdentifier}_${sequence_id}` : null,
-    workspaceSlug && workItem
-      ? () => fetchIssueWithIdentifier(workspaceSlug.toString(), projectIdentifier, sequence_id)
-      : null
-  );
-
-  const issueId = issueDetails?.id;
-  const projectId = paramsProjectId ?? issueDetails?.project_id;
-
   return (
     <>
       <CreateUpdateIssueModal
diff --git a/web/core/components/command-palette/command-palette.tsx b/web/core/components/command-palette/command-palette.tsx
index 4bbbcbc2ee6..9399c52f5a4 100644
--- a/web/core/components/command-palette/command-palette.tsx
+++ b/web/core/components/command-palette/command-palette.tsx
@@ -3,6 +3,7 @@
 import React, { useCallback, useEffect, FC, useMemo } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
+import useSWR from "swr";
 // ui
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { TOAST_TYPE, setToast } from "@plane/ui";
@@ -11,7 +12,14 @@ import { CommandModal, ShortcutsModal } from "@/components/command-palette";
 // helpers
 import { copyTextToClipboard } from "@/helpers/string.helper";
 // hooks
-import { useEventTracker, useUser, useAppTheme, useCommandPalette, useUserPermissions } from "@/hooks/store";
+import {
+  useEventTracker,
+  useUser,
+  useAppTheme,
+  useCommandPalette,
+  useUserPermissions,
+  useIssueDetail,
+} from "@/hooks/store";
 import { usePlatformOS } from "@/hooks/use-platform-os";
 // plane web components
 import {
@@ -30,8 +38,9 @@ import {
 
 export const CommandPalette: FC = observer(() => {
   // router params
-  const { workspaceSlug, projectId, workItem } = useParams();
+  const { workspaceSlug, projectId: paramsProjectId, workItem } = useParams();
   // store hooks
+  const { fetchIssueWithIdentifier } = useIssueDetail();
   const { toggleSidebar } = useAppTheme();
   const { setTrackElement } = useEventTracker();
   const { platform } = usePlatformOS();
@@ -40,15 +49,35 @@ export const CommandPalette: FC = observer(() => {
   const { allowPermissions } = useUserPermissions();
 
   // derived values
+  const projectIdentifier = workItem?.toString().split("-")[0];
+  const sequence_id = workItem?.toString().split("-")[1];
+
+  const { data: issueDetails } = useSWR(
+    workspaceSlug && workItem ? `ISSUE_DETAIL_${workspaceSlug}_${projectIdentifier}_${sequence_id}` : null,
+    workspaceSlug && workItem
+      ? () => fetchIssueWithIdentifier(workspaceSlug.toString(), projectIdentifier, sequence_id)
+      : null
+  );
+
+  const issueId = issueDetails?.id;
+  const projectId = paramsProjectId?.toString() ?? issueDetails?.project_id;
+
   const canPerformWorkspaceMemberActions = allowPermissions(
     [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
     EUserPermissionsLevel.WORKSPACE
   );
   const canPerformProjectMemberActions = allowPermissions(
     [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
-    EUserPermissionsLevel.PROJECT
+    EUserPermissionsLevel.PROJECT,
+    workspaceSlug?.toString(),
+    projectId
+  );
+  const canPerformProjectAdminActions = allowPermissions(
+    [EUserPermissions.ADMIN],
+    EUserPermissionsLevel.PROJECT,
+    workspaceSlug?.toString(),
+    projectId
   );
-  const canPerformProjectAdminActions = allowPermissions([EUserPermissions.ADMIN], EUserPermissionsLevel.PROJECT);
 
   const copyIssueUrlToClipboard = useCallback(() => {
     if (!workItem) return;
@@ -236,7 +265,7 @@ export const CommandPalette: FC = observer(() => {
       {workspaceSlug && projectId && (
         <ProjectLevelModals workspaceSlug={workspaceSlug.toString()} projectId={projectId.toString()} />
       )}
-      <IssueLevelModals />
+      <IssueLevelModals projectId={projectId} issueId={issueId} />
       <CommandModal />
     </>
   );