diff --git a/index.html b/index.html index 2eefeee2..9196cf3d 100644 --- a/index.html +++ b/index.html @@ -90,7 +90,6 @@ window.global ||= window;
-
diff --git a/package-lock.json b/package-lock.json index 4aacff72..34a390f7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -32,7 +32,7 @@ "emojibase-data": "15.3.2", "file-saver": "2.0.5", "focus-trap-react": "10.0.2", - "folds": "2.3.0", + "folds": "2.2.0", "html-dom-parser": "4.0.0", "html-react-parser": "4.2.0", "i18next": "23.12.2", @@ -7163,9 +7163,9 @@ } }, "node_modules/folds": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/folds/-/folds-2.3.0.tgz", - "integrity": "sha512-1KoM21jrg5daxvKrmSY0V04wa946KlNT0z6h017Rsnw2fdtNC6J0f34Ce5GF46Tzi00gZ/7SvCDXMzW/7e5s0w==", + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/folds/-/folds-2.2.0.tgz", + "integrity": "sha512-uOfck5eWEIK11rhOAEdSoPIvMXwv+D1Go03pxSAKezWVb+uRoBdmE6LEqiLOF+ac4DGmZRMPvpdDsXCg7EVNIg==", "license": "Apache-2.0", "peerDependencies": { "@vanilla-extract/css": "1.9.2", diff --git a/package.json b/package.json index 5a2356f4..0c06993e 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ "emojibase-data": "15.3.2", "file-saver": "2.0.5", "focus-trap-react": "10.0.2", - "folds": "2.3.0", + "folds": "2.2.0", "html-dom-parser": "4.0.0", "html-react-parser": "4.2.0", "i18next": "23.12.2", diff --git a/src/app/features/common-settings/general/RoomAddress.tsx b/src/app/features/common-settings/general/RoomAddress.tsx index 767a967e..6b684be7 100644 --- a/src/app/features/common-settings/general/RoomAddress.tsx +++ b/src/app/features/common-settings/general/RoomAddress.tsx @@ -329,7 +329,7 @@ function LocalAddressesList({ toggleSelect(alias)} + onChange={() => toggleSelect(alias)} size="50" variant="Primary" disabled={loading} diff --git a/src/app/features/room/RoomView.tsx b/src/app/features/room/RoomView.tsx index 0f837594..2a4c710e 100644 --- a/src/app/features/room/RoomView.tsx +++ b/src/app/features/room/RoomView.tsx @@ -79,8 +79,9 @@ export function RoomView({ room, eventId }: { room: Room; eventId?: string }) { useCallback( (evt) => { if (editableActiveElement()) return; - const portalContainer = document.getElementById('portalContainer'); - if (portalContainer && portalContainer.children.length > 0) { + // means some menu or modal window is open + const lastNode = document.body.lastElementChild; + if (lastNode && !lastNode.hasAttribute('data-last-node')) { return; } if (shouldFocusMessageField(evt) || isKeyHotkey('mod+v', evt)) { diff --git a/src/app/features/search/Search.tsx b/src/app/features/search/Search.tsx index fcd6233a..aaf51a17 100644 --- a/src/app/features/search/Search.tsx +++ b/src/app/features/search/Search.tsx @@ -434,8 +434,9 @@ export function SearchModalRenderer() { return; } - const portalContainer = document.getElementById('portalContainer'); - if (portalContainer && portalContainer.children.length > 0) { + // means some menu or modal window is open + const lastNode = document.body.lastElementChild; + if (lastNode && !lastNode.hasAttribute('data-last-node')) { return; } setOpen(true); diff --git a/src/app/pages/App.tsx b/src/app/pages/App.tsx index 0a919b57..935790ac 100644 --- a/src/app/pages/App.tsx +++ b/src/app/pages/App.tsx @@ -1,6 +1,5 @@ -import React from 'react'; +import React, { useEffect } from 'react'; import { Provider as JotaiProvider } from 'jotai'; -import { OverlayContainerProvider, PopOutContainerProvider, TooltipContainerProvider } from 'folds'; import { RouterProvider } from 'react-router-dom'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; @@ -14,39 +13,41 @@ import { ScreenSizeProvider, useScreenSize } from '../hooks/useScreenSize'; const queryClient = new QueryClient(); +const useLastNodeToDetectReactPortalEntry = () => { + useEffect(() => { + const lastDiv = document.createElement('div'); + lastDiv.setAttribute('data-last-node', 'true'); + document.body.appendChild(lastDiv); + }, []); +}; + function App() { const screenSize = useScreenSize(); - const portalContainer = document.getElementById('portalContainer') ?? undefined; + useLastNodeToDetectReactPortalEntry(); return ( - - - - - - } - error={(err, retry, ignore) => ( - - )} - > - {(clientConfig) => ( - - - - - - - - - )} - - - - - - + + + } + error={(err, retry, ignore) => ( + + )} + > + {(clientConfig) => ( + + + + + + + + + )} + + + ); }