diff --git a/frontend/src/app/AppLayout.jsx b/frontend/src/app/AppLayout.jsx
index 6c8ae4c..09b0dfd 100644
--- a/frontend/src/app/AppLayout.jsx
+++ b/frontend/src/app/AppLayout.jsx
@@ -5,6 +5,7 @@ import DropOverlay from './DropOverlay';
import UploadQueueOverlay from './UploadQueueOverlay';
import useDocumentsWorkspace from '../hooks/documents/useDocumentsWorkspace';
import { useDocumentsPreferences } from './useDocumentsPreferences';
+import SettingsRoute from './SettingsRoute';
const AppLayout = () => {
const documentsPreferences = useDocumentsPreferences();
@@ -15,6 +16,8 @@ const AppLayout = () => {
dropOverlayState,
managementModals,
contextValue,
+ settingsOpen,
+ closeSettings,
} = useDocumentsWorkspace({
documentsViewMode: documentsPreferences.documentsViewMode,
documentsSortField: documentsPreferences.documentsSortField,
@@ -61,6 +64,9 @@ const AppLayout = () => {
/>
{managementModals}
+ {settingsOpen ? (
+
+ ) : null}
);
diff --git a/frontend/src/app/AppRouter.jsx b/frontend/src/app/AppRouter.jsx
index f077d05..fb5488b 100644
--- a/frontend/src/app/AppRouter.jsx
+++ b/frontend/src/app/AppRouter.jsx
@@ -3,7 +3,6 @@ import { Navigate, Route, Routes } from 'react-router-dom';
import AppLayout from './AppLayout';
import DocumentsRoute from './DocumentsRoute';
import LoginRoute from './LoginRoute';
-import SettingsRoute from './SettingsRoute';
const AppRouter = () => (
@@ -13,7 +12,6 @@ const AppRouter = () => (
} />
} />
} />
- } />
} />
diff --git a/frontend/src/app/SettingsRoute.jsx b/frontend/src/app/SettingsRoute.jsx
index 165bfa0..ce7cc6c 100644
--- a/frontend/src/app/SettingsRoute.jsx
+++ b/frontend/src/app/SettingsRoute.jsx
@@ -1,5 +1,4 @@
import React, { useEffect, useCallback } from 'react';
-import { useNavigate } from 'react-router-dom';
import SettingsModal from '../settings/SettingsModal';
import { useAppShell } from '../appShellContext';
import useApiTokens from '../settings/useApiTokens';
@@ -7,8 +6,7 @@ import useCapabilitySets from '../settings/useCapabilitySets';
import useCapabilities from '../settings/useCapabilities';
import { api } from './appState';
-const SettingsRoute = () => {
- const navigate = useNavigate();
+const SettingsRoute = ({ open = true, onClose }) => {
const {
token,
notifyApiError,
@@ -71,27 +69,20 @@ const SettingsRoute = () => {
const handleClose = useCallback(() => {
dismissSecret();
- navigate(-1);
- }, [dismissSecret, navigate]);
-
- useEffect(() => {
- const handleKeyDown = (event) => {
- if (event.key === 'Escape') {
- event.preventDefault();
- handleClose();
- }
- };
- window.addEventListener('keydown', handleKeyDown);
- return () => window.removeEventListener('keydown', handleKeyDown);
- }, [handleClose]);
+ onClose?.();
+ }, [dismissSecret, onClose]);
useEffect(() => () => {
dismissSecret();
}, [dismissSecret]);
+ if (!open) {
+ return null;
+ }
+
return (
{
- navigate('/settings');
- }, [navigate]);
+ setSettingsOpen(true);
+ }, []);
+ const closeSettings = useCallback(() => {
+ setSettingsOpen(false);
+ }, []);
+
+ useEffect(() => {
+ if (!settingsOpen) {
+ return undefined;
+ }
+ const handleKeyDown = (event) => {
+ if (event.key === 'Escape') {
+ event.preventDefault();
+ setSettingsOpen(false);
+ }
+ };
+ window.addEventListener('keydown', handleKeyDown);
+ return () => window.removeEventListener('keydown', handleKeyDown);
+ }, [settingsOpen]);
useEffect(
() => () => {
@@ -1548,6 +1566,8 @@ const useDocumentsWorkspace = ({
dropOverlayState,
managementModals,
contextValue,
+ settingsOpen,
+ closeSettings,
};
};
diff --git a/frontend/src/styles/modals/status-drop.css b/frontend/src/styles/modals/status-drop.css
index 128e485..483213d 100644
--- a/frontend/src/styles/modals/status-drop.css
+++ b/frontend/src/styles/modals/status-drop.css
@@ -51,7 +51,7 @@
align-items: center;
justify-content: center;
padding: 1.5rem;
- z-index: 3000;
+ z-index: 2000000;
}
.modal {
diff --git a/frontend/src/styles/workspace/workspace-items.css b/frontend/src/styles/workspace/workspace-items.css
index 07061c7..962d1d8 100644
--- a/frontend/src/styles/workspace/workspace-items.css
+++ b/frontend/src/styles/workspace/workspace-items.css
@@ -45,7 +45,7 @@
pointer-events: none;
filter: blur(15px) grayscale(100%);
transition: opacity 0.6s ease, filter 0.28s ease;
- z-index: 0 !important;
+ z-index: 0;
}
.desk-item.is-selected {
diff --git a/frontend/src/styles/workspace/workspace-overlays.css b/frontend/src/styles/workspace/workspace-overlays.css
index b694779..d612f55 100644
--- a/frontend/src/styles/workspace/workspace-overlays.css
+++ b/frontend/src/styles/workspace/workspace-overlays.css
@@ -2,7 +2,7 @@
.desk-help-overlay {
position: fixed;
inset: 0;
- z-index: 5000000;
+ z-index: 2000000;
display: flex;
align-items: center;
justify-content: center;