diff --git a/ui/src/pages/Admin/ClaimMappingRulesModal.module.css b/ui/src/pages/Admin/ClaimMappingRulesModal.module.css index e75c40d5..4fbf61ea 100644 --- a/ui/src/pages/Admin/ClaimMappingRulesModal.module.css +++ b/ui/src/pages/Admin/ClaimMappingRulesModal.module.css @@ -40,7 +40,7 @@ } .subtitle { - font-size: 11px; + font-size: 12px; color: var(--text-muted); } @@ -57,7 +57,7 @@ .table th { text-align: left; padding: 6px 8px; - font-size: 11px; + font-size: 12px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; @@ -82,7 +82,7 @@ .priorityCell { color: var(--text-muted); - font-size: 11px; + font-size: 12px; width: 30px; } @@ -98,7 +98,7 @@ display: inline-block; padding: 2px 8px; border-radius: 10px; - font-size: 11px; + font-size: 12px; white-space: nowrap; } @@ -188,11 +188,6 @@ width: 120px; } -.editRow input, -.editRow select { - font-size: 12px; -} - .emptyState { padding: 32px 20px; text-align: center; @@ -202,7 +197,7 @@ .footer { padding: 12px 20px; - font-size: 11px; + font-size: 12px; color: var(--text-muted); border-top: 1px solid var(--border); } @@ -228,7 +223,7 @@ } .testToggleHint { - font-size: 11px; + font-size: 12px; color: var(--text-muted); } @@ -255,7 +250,7 @@ padding: 10px; color: var(--text); font-family: var(--font-mono); - font-size: 11px; + font-size: 12px; resize: vertical; } @@ -271,7 +266,7 @@ } .testResultsTitle { - font-size: 11px; + font-size: 12px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; @@ -283,7 +278,7 @@ } .testMatchLabel { - font-size: 11px; + font-size: 12px; color: var(--success); margin-bottom: 4px; } @@ -297,7 +292,7 @@ border-top: 1px solid var(--border); padding-top: 8px; margin-top: 4px; - font-size: 11px; + font-size: 12px; color: var(--text-muted); } diff --git a/ui/src/pages/Admin/ClaimMappingRulesModal.tsx b/ui/src/pages/Admin/ClaimMappingRulesModal.tsx index 881db962..7247eda0 100644 --- a/ui/src/pages/Admin/ClaimMappingRulesModal.tsx +++ b/ui/src/pages/Admin/ClaimMappingRulesModal.tsx @@ -81,6 +81,7 @@ export default function ClaimMappingRulesModal({ open, onClose }: Props) { { onSuccess: () => { setAddForm({ ...EMPTY_FORM }); + setTestResult(null); toast({ title: 'Rule created', variant: 'success' }); }, onError: (e) => toast({ title: 'Failed to create rule', description: e.message, variant: 'error', duration: 86_400_000 }), @@ -113,6 +114,7 @@ export default function ClaimMappingRulesModal({ open, onClose }: Props) { { onSuccess: () => { setEditingId(null); + setTestResult(null); toast({ title: 'Rule updated', variant: 'success' }); }, onError: (e) => toast({ title: 'Failed to update rule', description: e.message, variant: 'error', duration: 86_400_000 }), @@ -125,6 +127,7 @@ export default function ClaimMappingRulesModal({ open, onClose }: Props) { deleteRule.mutate(deleteTarget.id, { onSuccess: () => { setDeleteTarget(null); + setTestResult(null); toast({ title: 'Rule deleted', variant: 'warning' }); }, onError: (e) => { @@ -134,23 +137,21 @@ export default function ClaimMappingRulesModal({ open, onClose }: Props) { }); } - function handleMove(rule: ClaimMappingRule, direction: 'up' | 'down') { + async function handleMove(rule: ClaimMappingRule, direction: 'up' | 'down') { const idx = sorted.findIndex((r) => r.id === rule.id); const swapIdx = direction === 'up' ? idx - 1 : idx + 1; if (swapIdx < 0 || swapIdx >= sorted.length) return; const other = sorted[swapIdx]; - // Swap priorities - updateRule.mutate( - { id: rule.id, claim: rule.claim, matchType: rule.matchType, matchValue: rule.matchValue, action: rule.action, target: rule.target, priority: other.priority }, - { - onSuccess: () => { - updateRule.mutate( - { id: other.id, claim: other.claim, matchType: other.matchType, matchValue: other.matchValue, action: other.action, target: other.target, priority: rule.priority }, - ); - }, - }, - ); + try { + await Promise.all([ + updateRule.mutateAsync({ id: rule.id, claim: rule.claim, matchType: rule.matchType, matchValue: rule.matchValue, action: rule.action, target: rule.target, priority: other.priority }), + updateRule.mutateAsync({ id: other.id, claim: other.claim, matchType: other.matchType, matchValue: other.matchValue, action: other.action, target: other.target, priority: rule.priority }), + ]); + setTestResult(null); + } catch { + toast({ title: 'Failed to reorder rules', variant: 'error', duration: 86_400_000 }); + } } function handleTest() { @@ -283,7 +284,7 @@ export default function ClaimMappingRulesModal({ open, onClose }: Props) { {/* Test panel */}
setTestOpen(!testOpen)}> - {testOpen ? '\u25B2' : '\u25BC'} + {testOpen ? : } Test Rules Paste a decoded JWT to preview which rules would fire
diff --git a/ui/src/pages/Admin/OidcConfigPage.module.css b/ui/src/pages/Admin/OidcConfigPage.module.css index 21fb6ae9..95e91584 100644 --- a/ui/src/pages/Admin/OidcConfigPage.module.css +++ b/ui/src/pages/Admin/OidcConfigPage.module.css @@ -44,3 +44,26 @@ .roleInput { width: 200px; } + +.advancedRulesRow { + margin-top: 18px; + padding-top: 14px; + border-top: 1px solid var(--border); +} + +.advancedRulesInner { + display: flex; + justify-content: space-between; + align-items: center; +} + +.advancedRulesLabel { + font-size: 13px; + color: var(--text-secondary, var(--text-muted)); +} + +.advancedRulesCount { + font-size: 12px; + color: var(--text-muted); + margin-left: 8px; +} diff --git a/ui/src/pages/Admin/OidcConfigPage.tsx b/ui/src/pages/Admin/OidcConfigPage.tsx index da2b1dc0..72116eff 100644 --- a/ui/src/pages/Admin/OidcConfigPage.tsx +++ b/ui/src/pages/Admin/OidcConfigPage.tsx @@ -275,12 +275,12 @@ export default function OidcConfigPage() { disabled={!editing} /> -
-
+
+
- Advanced Rules + Advanced Rules {claimRules.length > 0 && ( - + {claimRules.length} active rule{claimRules.length !== 1 ? 's' : ''} )}