admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: Ensure attachment modal appears above Command Menu button using createPortal (#12112)

Browse Source 
<img width="1509" alt="Screenshot 2025-05-19 at 12 50 48 AM"
src="https://github.com/user-attachments/assets/fba95ecb-015a-4742-bda2-4d515d168c16"
/>


Closes #12092
This commit is contained in:
Abdul Rahman
2025-05-20 02:38:31 +05:30
committed by GitHub
parent 4f4f3a64fd
commit 42c69dd11a
1 changed files with 49 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/twenty-front/src/modules/activities/files/components/AttachmentList.tsx
View File

@ -1,5 +1,6 @@
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import { lazy, ReactElement, Suspense, useState } from 'react'; import { lazy, ReactElement, Suspense, useState } from 'react';
import { createPortal } from 'react-dom';
import { DropZone } from '@/activities/files/components/DropZone'; import { DropZone } from '@/activities/files/components/DropZone';
import { useUploadAttachmentFile } from '@/activities/files/hooks/useUploadAttachmentFile'; import { useUploadAttachmentFile } from '@/activities/files/hooks/useUploadAttachmentFile';
@ -184,7 +185,9 @@ export const AttachmentList = ({
</StyledDropZoneContainer> </StyledDropZoneContainer>
</StyledContainer> </StyledContainer>
)} )}
{previewedAttachment && isAttachmentPreviewEnabled && ( {previewedAttachment &&
isAttachmentPreviewEnabled &&
createPortal(
<StyledModal <StyledModal
modalId={PREVIEW_MODAL_ID} modalId={PREVIEW_MODAL_ID}
size="large" size="large"
@ -228,7 +231,8 @@ export const AttachmentList = ({
</Suspense> </Suspense>
</StyledModalContent> </StyledModalContent>
</ScrollWrapper> </ScrollWrapper>
</StyledModal> </StyledModal>,
document.body,
)} )}
</> </>
); );