Add embedded Swagger UI page with auto-injected JWT auth
All checks were successful
CI / build (push) Successful in 1m16s
CI / docker (push) Successful in 1m9s
CI / deploy (push) Successful in 31s

- New /swagger route with lazy-loaded SwaggerPage that initializes
  swagger-ui-dist and injects the session JWT via requestInterceptor
- Move API link from primary nav to navRight utility area (pill style)
- Code-split swagger chunk (~1.4 MB) so main bundle stays lean

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-03-15 14:51:15 +01:00
parent e466dc5861
commit 7dec8fbaff
8 changed files with 93 additions and 5 deletions

View File

@@ -61,6 +61,30 @@
gap: 16px;
}
.utilLink {
font-family: var(--font-mono);
font-size: 11px;
font-weight: 500;
color: var(--text-muted);
text-decoration: none;
padding: 4px 10px;
border-radius: 99px;
border: 1px solid var(--border);
transition: all 0.15s;
}
.utilLink:hover {
color: var(--text-primary);
border-color: var(--text-muted);
}
.utilLinkActive {
composes: utilLink;
color: var(--amber);
border-color: rgba(245, 158, 11, 0.3);
background: var(--amber-glow);
}
.envBadge {
font-family: var(--font-mono);
font-size: 11px;

View File

@@ -28,11 +28,6 @@ export function TopNav() {
Applications
</NavLink>
</li>
<li>
<a href="/api/v1/swagger-ui/index.html" target="_blank" rel="noopener noreferrer" className={styles.navLink}>
API
</a>
</li>
{roles.includes('ADMIN') && (
<li>
<NavLink to="/admin/oidc" className={({ isActive }) => isActive ? styles.navLinkActive : styles.navLink}>
@@ -43,6 +38,9 @@ export function TopNav() {
</ul>
<div className={styles.navRight}>
<NavLink to="/swagger" className={({ isActive }) => isActive ? styles.utilLinkActive : styles.utilLink} title="API Documentation">
API
</NavLink>
<span className={styles.envBadge}>{import.meta.env.VITE_ENV_NAME || 'DEV'}</span>
<button className={styles.themeToggle} onClick={toggle} title="Toggle theme">
{theme === 'dark' ? '\u2600\uFE0F' : '\uD83C\uDF19'}