vhad/plane
1
0
Fork 0
mirror of https://github.com/gosticks/plane.git synced 2025-10-16 12:45:33 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[WEB-4981] fix: analytics modal portal (#7852)

Browse Source
This commit is contained in:
Anmol Singh Bhatia 2025-09-25 20:26:44 +05:30 committed by GitHub
parent 19e00b0d4b
commit b946b3a315
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 27 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
apps/web/core/components/analytics/work-items/modal/index.tsx
View File

@ -1,9 +1,8 @@
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
// plane package imports // plane package imports
import { createPortal } from "react-dom"; import { ModalPortal, EPortalWidth, EPortalPosition } from "@plane/propel/portal";
import { ICycle, IModule, IProject } from "@plane/types"; import { ICycle, IModule, IProject } from "@plane/types";
import { cn } from "@plane/utils";
import { useAnalytics } from "@/hooks/store/use-analytics"; import { useAnalytics } from "@/hooks/store/use-analytics";
// plane web components // plane web components
import { WorkItemsModalMainContent } from "./content"; import { WorkItemsModalMainContent } from "./content";
@ -32,41 +31,35 @@ export const WorkItemsModal: React.FC<Props> = observer((props) => {
updateIsEpic(isPeekView ? (isEpic ?? false) : false); updateIsEpic(isPeekView ? (isEpic ?? false) : false);
}, [isEpic, updateIsEpic, isPeekView]); }, [isEpic, updateIsEpic, isPeekView]);
const portalContainer = document.getElementById("full-screen-portal") as HTMLElement; return (
<ModalPortal
if (!isOpen) return null; isOpen={isOpen}
onClose={handleClose}
const content = ( width={fullScreen ? EPortalWidth.FULL : EPortalWidth.THREE_QUARTER}
<div className={cn("z-[25] h-full w-full overflow-y-auto absolute")}> position={EPortalPosition.RIGHT}
fullScreen={fullScreen}
>
<div <div
className={`top-0 right-0 z-[25] h-full bg-custom-background-100 shadow-custom-shadow-md absolute ${ className={`flex h-full flex-col overflow-hidden border-custom-border-200 bg-custom-background-100 text-left ${
fullScreen ? "w-full p-2" : "w-1/2" fullScreen ? "rounded-lg border m-2" : "border-l"
}`} }`}
> >
<div <WorkItemsModalHeader
className={`flex h-full flex-col overflow-hidden border-custom-border-200 bg-custom-background-100 text-left ${ fullScreen={fullScreen}
fullScreen ? "rounded-lg border" : "border-l" handleClose={handleClose}
}`} setFullScreen={setFullScreen}
> title={projectDetails?.name ?? ""}
<WorkItemsModalHeader cycle={cycleDetails}
fullScreen={fullScreen} module={moduleDetails}
handleClose={handleClose} />
setFullScreen={setFullScreen} <WorkItemsModalMainContent
title={projectDetails?.name ?? ""} fullScreen={fullScreen}
cycle={cycleDetails} projectDetails={projectDetails}
module={moduleDetails} cycleDetails={cycleDetails}
/> moduleDetails={moduleDetails}
<WorkItemsModalMainContent isEpic={isEpic}
fullScreen={fullScreen} />
projectDetails={projectDetails}
cycleDetails={cycleDetails}
moduleDetails={moduleDetails}
isEpic={isEpic}
/>
</div>
</div> </div>
</div> </ModalPortal>
); );
return portalContainer ? createPortal(content, portalContainer) : content;
}); });