fix: issue widget modal rendering (#5896)

web/core/components/issues/issue-detail-widgets/root.tsx

@@ -12,10 +12,11 @@ type Props = {
   projectId: string;
   issueId: string;
   disabled: boolean;
+  renderWidgetModals?: boolean;
 };
 
 export const IssueDetailWidgets: FC<Props> = (props) => {
-  const { workspaceSlug, projectId, issueId, disabled } = props;
+  const { workspaceSlug, projectId, issueId, disabled, renderWidgetModals = true } = props;
   return (
     <>
       <div className="flex flex-col gap-5">
@@ -32,7 +33,9 @@ export const IssueDetailWidgets: FC<Props> = (props) => {
           disabled={disabled}
         />
       </div>
+      {renderWidgetModals && (
         <IssueDetailWidgetModals workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} />
+      )}
     </>
   );
 };

web/core/components/issues/issue-detail/main-content.tsx

@@ -40,6 +40,7 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
   const { data: currentUser } = useUser();
   const {
     issue: { getIssueById },
+    peekIssue,
   } = useIssueDetail();
   const { setShowAlert } = useReloadConfirmations(isSubmitting === "submitting");
 
@@ -53,6 +54,8 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
   const issue = issueId ? getIssueById(issueId) : undefined;
   if (!issue || !issue.project_id) return <></>;
 
+  const isPeekModeActive = Boolean(peekIssue);
+
   return (
     <>
       <div className="rounded-lg space-y-4">
@@ -110,6 +113,7 @@ export const IssueMainContent: React.FC<Props> = observer((props) => {
         projectId={projectId}
         issueId={issueId}
         disabled={!isEditable || isArchived}
+        renderWidgetModals={!isPeekModeActive}
       />
 
       {windowSize[0] < 768 && (