set z-index on config dropdowns so they render above the modal (#6674)

This commit is contained in:
Anthony Stirling
2026-06-18 09:08:50 +01:00
committed by GitHub
parent 8f81fdc762
commit d9e6041a75
7 changed files with 52 additions and 11 deletions
+3
View File
@@ -12,3 +12,6 @@ app/proprietary/src/test/java/stirling/software/proprietary/mcp/security/McpApiK
testing/compose/docker-compose-keycloak-mcp.yml:generic-api-key:25
testing/compose/validate-mcp-apikey.sh:curl-auth-header:73
testing/compose/validate-mcp-test.sh:curl-auth-header:92
# Truncated placeholder API key in portal docs example (sk_live_8f2c...e10) - not a real secret.
frontend/portal/src/components/docs/GettingStartedSection.tsx:generic-api-key:31
@@ -22,7 +22,7 @@ import { useAdminSettings } from "@app/hooks/useAdminSettings";
import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
import PendingBadge from "@app/components/shared/config/PendingBadge";
import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
import { Z_INDEX_CONFIG_MODAL } from "@app/styles/zIndex";
import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
import ProviderCard from "@app/components/shared/config/configSections/ProviderCard";
import {
Provider,
@@ -815,7 +815,10 @@ export default function AdminConnectionsSection() {
]}
disabled={!loginEnabled}
style={{ width: "250px" }}
comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
/>
<PendingBadge
show={isFieldPending("mobileScannerImageResolution")}
@@ -872,7 +875,10 @@ export default function AdminConnectionsSection() {
]}
disabled={!loginEnabled}
style={{ width: "250px" }}
comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
/>
<PendingBadge
show={isFieldPending("mobileScannerPageFormat")}
@@ -587,6 +587,10 @@ export default function AdminDatabaseSection() {
{ value: "mysql", label: "MySQL" },
{ value: "mariadb", label: "MariaDB" },
]}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -18,6 +18,7 @@ import PendingBadge from "@app/components/shared/config/PendingBadge";
import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
import { useLoginRequired } from "@app/hooks/useLoginRequired";
import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
interface UISettingsData {
defaultHideUnavailableTools?: boolean;
@@ -300,7 +301,10 @@ export default function AdminEndpointsSection() {
"admin.settings.endpoints.toRemove.placeholder",
"Select endpoints to disable",
)}
comboboxProps={{ zIndex: 1400 }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -337,7 +341,10 @@ export default function AdminEndpointsSection() {
"admin.settings.endpoints.groupsToRemove.placeholder",
"Select groups to disable",
)}
comboboxProps={{ zIndex: 1400 }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -32,7 +32,7 @@ import {
toUnderscoreFormat,
toUnderscoreLanguages,
} from "@app/i18n";
import { Z_INDEX_CONFIG_MODAL } from "@app/styles/zIndex";
import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
interface GeneralSettingsData {
ui: {
@@ -591,7 +591,10 @@ export default function AdminGeneralSection() {
"admin.settings.general.languages.placeholder",
"Select languages",
)}
comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -626,7 +629,10 @@ export default function AdminGeneralSection() {
searchable
clearable
placeholder="en_US"
comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -24,6 +24,7 @@ import PendingBadge from "@app/components/shared/config/PendingBadge";
import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
import apiClient from "@app/services/apiClient";
import { useLoginRequired } from "@app/hooks/useLoginRequired";
import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
interface McpAuthData {
mode?: string;
@@ -211,6 +212,10 @@ export default function AdminMcpSection() {
value={authMode}
onChange={(v) => setAuth({ mode: v || "oauth" })}
allowDeselect={false}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!settings.enabled}
/>
@@ -26,6 +26,7 @@ import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStic
import apiClient from "@app/services/apiClient";
import { useLoginRequired } from "@app/hooks/useLoginRequired";
import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
interface SecuritySettingsData {
enableLogin?: boolean;
@@ -364,7 +365,10 @@ export default function AdminSecuritySection() {
),
},
]}
comboboxProps={{ zIndex: 1400 }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
{isFieldPending("loginMethod") && (
@@ -480,7 +484,10 @@ export default function AdminSecuritySection() {
),
},
]}
comboboxProps={{ zIndex: 1400 }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>
@@ -1191,7 +1198,10 @@ export default function AdminSecuritySection() {
),
},
]}
comboboxProps={{ zIndex: 1400 }}
comboboxProps={{
withinPortal: true,
zIndex: Z_INDEX_OVER_CONFIG_MODAL,
}}
disabled={!loginEnabled}
/>
</div>