feat: add App Config detail page with view/edit mode
All checks were successful
CI / cleanup-branch (push) Has been skipped
CI / build (push) Successful in 53s
CI / docker (push) Successful in 52s
CI / deploy-feature (push) Has been skipped
CI / deploy (push) Successful in 38s

Click a row in the admin App Config table to navigate to a dedicated
detail page at /admin/appconfig/:appId. Shows all config fields as
badges in view mode; pencil toggles to edit mode with dropdowns.

Traced processors are now editable (capture mode dropdown + remove
button per processor). Sections and header use card styling for
visual contrast. OidcConfigPage gets the same card treatment.

List page simplified to read-only badge overview with row click
navigation.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-03-26 16:15:27 +01:00
parent e53274bcb9
commit 0e6de69cd9
6 changed files with 476 additions and 230 deletions

View File

@@ -1,81 +1 @@
.inspectLink {
background: transparent;
border: none;
color: var(--text-faint);
opacity: 0.75;
cursor: pointer;
font-size: 13px;
padding: 2px 4px;
border-radius: var(--radius-sm);
line-height: 1;
display: inline-flex;
}
.inspectLink:hover {
color: var(--text-primary);
opacity: 1;
}
.editBtn {
background: transparent;
border: none;
color: var(--text-faint);
opacity: 0.75;
cursor: pointer;
font-size: 13px;
padding: 2px 4px;
border-radius: var(--radius-sm);
line-height: 1;
display: inline-flex;
}
.editBtn:hover {
color: var(--text-primary);
opacity: 1;
}
.editBtn:disabled {
opacity: 0.3;
cursor: not-allowed;
}
.editActions {
display: inline-flex;
gap: 2px;
}
.inlineSelect {
padding: 3px 8px;
border: 1px solid var(--border-subtle);
border-radius: var(--radius-sm);
background: var(--bg-body);
color: var(--text-primary);
font-size: 11px;
font-family: var(--font-mono);
outline: none;
cursor: pointer;
}
.inlineSelect:focus {
border-color: var(--amber);
}
.inlineSelect:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.inlineToggle {
display: flex;
align-items: center;
gap: 5px;
font-size: 11px;
font-family: var(--font-mono);
color: var(--text-secondary);
cursor: pointer;
}
.inlineToggle input {
accent-color: var(--amber);
cursor: pointer;
}
/* No custom styles needed — DataTable with badges handles everything */