fix: handled drag and drop issue, gantt hover issue for issue peek overview (#2660)

web/components/issues/issue-peek-overview/root.tsx

@@ -1,4 +1,4 @@
-import { FC, ReactNode } from "react";
+import { FC, Fragment, ReactNode } from "react";
 import { useRouter } from "next/router";
 import useSWR from "swr";
 import { observer } from "mobx-react-lite";
@@ -112,6 +112,7 @@ export const IssuePeekOverview: FC<IIssuePeekOverview> = observer((props) => {
     else await issueStore.deleteIssue(workspaceSlug, projectId, issue!);
     const { query } = router;
     if (query.peekIssueId) {
+      issueDetailStore.setPeekId(null);
       delete query.peekIssueId;
       router.push({
         pathname: router.pathname,
@@ -123,30 +124,32 @@ export const IssuePeekOverview: FC<IIssuePeekOverview> = observer((props) => {
   const userRole = userStore.currentProjectRole ?? 5;
 
   return (
-    <IssueView
+    <Fragment>
-      workspaceSlug={workspaceSlug}
+      <IssueView
-      projectId={projectId}
+        workspaceSlug={workspaceSlug}
-      issueId={issueId}
+        projectId={projectId}
-      issue={issue}
+        issueId={issueId}
-      isLoading={isLoading}
+        issue={issue}
-      isArchived={isArchived}
+        isLoading={isLoading}
-      handleCopyText={handleCopyText}
+        isArchived={isArchived}
-      redirectToIssueDetail={redirectToIssueDetail}
+        handleCopyText={handleCopyText}
-      issueUpdate={issueUpdate}
+        redirectToIssueDetail={redirectToIssueDetail}
-      issueReactionCreate={issueReactionCreate}
+        issueUpdate={issueUpdate}
-      issueReactionRemove={issueReactionRemove}
+        issueReactionCreate={issueReactionCreate}
-      issueCommentCreate={issueCommentCreate}
+        issueReactionRemove={issueReactionRemove}
-      issueCommentUpdate={issueCommentUpdate}
+        issueCommentCreate={issueCommentCreate}
-      issueCommentRemove={issueCommentRemove}
+        issueCommentUpdate={issueCommentUpdate}
-      issueCommentReactionCreate={issueCommentReactionCreate}
+        issueCommentRemove={issueCommentRemove}
-      issueCommentReactionRemove={issueCommentReactionRemove}
+        issueCommentReactionCreate={issueCommentReactionCreate}
-      issueSubscriptionCreate={issueSubscriptionCreate}
+        issueCommentReactionRemove={issueCommentReactionRemove}
-      issueSubscriptionRemove={issueSubscriptionRemove}
+        issueSubscriptionCreate={issueSubscriptionCreate}
-      handleDeleteIssue={handleDeleteIssue}
+        issueSubscriptionRemove={issueSubscriptionRemove}
-      disableUserActions={[5, 10].includes(userRole)}
+        handleDeleteIssue={handleDeleteIssue}
-      showCommentAccessSpecifier={projectStore.currentProjectDetails?.is_deployed}
+        disableUserActions={[5, 10].includes(userRole)}
-    >
+        showCommentAccessSpecifier={projectStore.currentProjectDetails?.is_deployed}
-      {children}
+      >
-    </IssueView>
+        {children}
+      </IssueView>
+    </Fragment>
   );
 });

web/components/issues/issue-peek-overview/view.tsx

@@ -97,6 +97,7 @@ export const IssueView: FC<IIssueView> = observer((props) => {
 
   const updateRoutePeekId = () => {
     if (issueId != peekIssueId) {
+      issueDetailStore.setPeekId(issueId);
       const { query } = router;
       router.push({
         pathname: router.pathname,
@@ -107,6 +108,7 @@ export const IssueView: FC<IIssueView> = observer((props) => {
   const removeRoutePeekId = () => {
     const { query } = router;
     if (query.peekIssueId) {
+      issueDetailStore.setPeekId(null);
       delete query.peekIssueId;
       router.push({
         pathname: router.pathname,
@@ -292,8 +294,6 @@ export const IssueView: FC<IIssueView> = observer((props) => {
                             issueReactionRemove={issueReactionRemove}
                           />
 
-                          <div className="border-t border-custom-border-400" />
-
                           <IssueComment
                             workspaceSlug={workspaceSlug}
                             projectId={projectId}

web/store/cycle/cycle_issue_kanban_view.store.ts

@@ -44,6 +44,7 @@ export class CycleIssueKanBanViewStore implements ICycleIssueKanBanViewStore {
   }
 
   get canUserDragDrop() {
+    if (this.rootStore.issueDetail.peekId) return false;
     if (
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by &&
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by === "sort_order" &&

web/store/issue/issue_kanban_view.store.ts

@@ -44,6 +44,7 @@ export class IssueKanBanViewStore implements IIssueKanBanViewStore {
   }
 
   get canUserDragDrop() {
+    if (this.rootStore.issueDetail.peekId) return false;
     if (
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by &&
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by === "sort_order" &&

web/store/module/module_issue_kanban_view.store.ts

@@ -44,6 +44,7 @@ export class ModuleIssueKanBanViewStore implements IModuleIssueKanBanViewStore {
   }
 
   get canUserDragDrop() {
+    if (this.rootStore.issueDetail.peekId) return false;
     if (
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by &&
       this.rootStore?.issueFilter?.userDisplayFilters?.order_by === "sort_order" &&