feat: wire claim mapping rules modal into OIDC config page

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-04-14 16:51:28 +02:00
parent e8a697d185
commit 3985bb8a43

View File

@@ -6,6 +6,8 @@ import {
import { useToast } from '@cameleer/design-system';
import { PageLoader } from '../../components/PageLoader';
import { adminFetch } from '../../api/queries/admin/admin-api';
import ClaimMappingRulesModal from './ClaimMappingRulesModal';
import { useClaimMappingRules } from '../../api/queries/admin/claim-mappings';
import styles from './OidcConfigPage.module.css';
import sectionStyles from '../../styles/section-card.module.css';
@@ -50,6 +52,8 @@ export default function OidcConfigPage() {
const [saving, setSaving] = useState(false);
const [testing, setTesting] = useState(false);
const { toast } = useToast();
const [rulesModalOpen, setRulesModalOpen] = useState(false);
const { data: claimRules = [] } = useClaimMappingRules();
useEffect(() => {
adminFetch<Partial<OidcFormData> & { configured?: boolean }>('/oidc')
@@ -271,6 +275,22 @@ export default function OidcConfigPage() {
disabled={!editing}
/>
</FormField>
<div style={{ marginTop: 18, paddingTop: 14, borderTop: '1px solid var(--border)' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div>
<span style={{ fontSize: 13, color: 'var(--text-secondary, var(--text-muted))' }}>Advanced Rules</span>
{claimRules.length > 0 && (
<span style={{ fontSize: 11, color: 'var(--text-muted)', marginLeft: 8 }}>
{claimRules.length} active rule{claimRules.length !== 1 ? 's' : ''}
</span>
)}
</div>
<Button size="sm" variant="secondary" onClick={() => setRulesModalOpen(true)}>
Edit Rules
</Button>
</div>
</div>
<ClaimMappingRulesModal open={rulesModalOpen} onClose={() => setRulesModalOpen(false)} />
</section>
<section className={sectionStyles.section}>