mirror/plane
1
0
Fork 0
mirror of https://github.com/makeplane/plane.git synced 2026-01-29 17:59:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

[WEB-4746] fix: position peek view relative to app layout (#7635)

Browse Source
This commit is contained in:
Prateek Shourya
2025-08-25 01:32:15 +05:30
committed by GitHub
parent 568a1bb228
commit 599ff2eec4
2 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -20,7 +20,7 @@ type Props = {
export const WorkItemsModal: React.FC<Props> = observer((props) => {
const { isOpen, onClose, projectDetails, moduleDetails, cycleDetails, isEpic } = props;
const { updateIsEpic } = useAnalytics();
const { updateIsEpic, isPeekView } = useAnalytics();
const [fullScreen, setFullScreen] = useState(false);
const handleClose = () => {
@@ -29,18 +29,18 @@ export const WorkItemsModal: React.FC<Props> = observer((props) => {
};
useEffect(() => {
updateIsEpic(isEpic ?? false);
}, [isEpic, updateIsEpic]);
updateIsEpic(isPeekView ? (isEpic ?? false) : false);
}, [isEpic, updateIsEpic, isPeekView]);
const portalContainer = document.getElementById("full-screen-portal") as HTMLElement;
if (!isOpen) return null;
const content = (
<div className={cn("inset-0 z-[25] h-full w-full overflow-y-auto", fullScreen ? "absolute" : "fixed")}>
<div className={cn("z-[25] h-full w-full overflow-y-auto absolute")}>
<div
className={`right-0 top-0 z-20 h-full bg-custom-background-100 shadow-custom-shadow-md ${
fullScreen ? "w-full p-2 absolute" : "w-full sm:w-full md:w-1/2 fixed"
className={`top-0 right-0 z-[25] h-full bg-custom-background-100 shadow-custom-shadow-md absolute ${
fullScreen ? "w-full p-2" : "w-1/2"
}`}
>
<div
@@ -67,5 +67,5 @@ export const WorkItemsModal: React.FC<Props> = observer((props) => {
</div>
);
return fullScreen && portalContainer ? createPortal(content, portalContainer) : content;
return portalContainer ? createPortal(content, portalContainer) : content;
});

6
apps/web/core/components/issues/peek-overview/view.tsx
View File

@@ -110,16 +110,16 @@ export const IssueView: FC<IIssueView> = observer((props) => {
const peekOverviewIssueClassName = cn(
!embedIssue
? "fixed z-[25] flex flex-col overflow-hidden rounded border border-custom-border-200 bg-custom-background-100 transition-all duration-300"
? "absolute z-[25] flex flex-col overflow-hidden rounded border border-custom-border-200 bg-custom-background-100 transition-all duration-300"
: `w-full h-full`,
!embedIssue && {
"top-2 bottom-2 right-2 w-full md:w-[50%] border-0 border-l": peekMode === "side-peek",
"top-0 bottom-0 right-0 w-full md:w-[50%] border-0 border-l": peekMode === "side-peek",
"size-5/6 top-[8.33%] left-[8.33%]": peekMode === "modal",
"inset-0 m-4 absolute": peekMode === "full-screen",
}
);
const shouldUsePortal = !embedIssue && peekMode === "full-screen";
const shouldUsePortal = !embedIssue;
const portalContainer = document.getElementById("full-screen-portal") as HTMLElement;