feat: account menu, database roles, and single logout
Bundles the console work from the current branch: the header account control, database-backed roles and permissions, and signing out across the applications that share this sign-in. The account control replaces a separate identity chip and a separate sign-out button, which meant the header carried two controls describing one fact. web/account.js is mounted into every page by a placeholder and owns the keyboard handling, the outside-click behaviour and the sign-out form once. It also fills the trigger's name, which the previous markup left empty. Signing out revokes the hosted-login bearer sessions this installation issued, then redirects to the provider's end_session_endpoint when the discovery document advertises one. Applications that authenticate against this installation therefore lose their session too; one pointed straight at an identity provider is out of its reach and is unchanged. Roles and permissions become rows rather than a closed enum, so a tenant can extend the catalog without a migration, and a role can no longer be granted a capability that is not in it. requireSameOrigin now compares against the origin the request arrived on instead of the configured base URL, which defaulted to http://localhost:8080 and so rejected every write in a deployment that never set it. Two bugs found while verifying in a browser: - A profile picture never rendered. avatarURL built an absolute URL from the configured base URL, and the page's own img-src 'self' blocked it. The console's own pages now take a root-relative path; only /connect/userinfo, read from another origin, needs an absolute one, and it follows the request. - absoluteURL preferred the configuration over the request while its comment claimed the opposite, which also misdirected the logout redirect. Card layout: the footer was one two-column row shared between a label and a forty-character identifier, so the identifier took the width and crushed its label into three stacked words. Each pair is a line now, the value truncates with the full text in the title, and cards align their footers across a row.
This commit is contained in:
parent
3fdc8cb489
commit
c7c81fb65c
43 changed files with 2248 additions and 298 deletions
|
|
@ -6,6 +6,12 @@
|
|||
<meta name="color-scheme" content="dark light">
|
||||
<title>Go Loose · API access control</title>
|
||||
<link rel="stylesheet" href="/assets/style.css">
|
||||
<!-- The shared styling contract. Every palette, both appearances, in one
|
||||
stylesheet, so switching is a change to an attribute rather than a request.
|
||||
The origin is substituted by the server from GO_LOOSE_THEME_BASE_URL; when it
|
||||
is unset the link is simply absent and this application's own theme blocks
|
||||
take over unchanged. -->
|
||||
<link rel="stylesheet" href="__GO_LOOSE_THEME_ORIGIN__/rt/v1/contract.css" data-theme-contract>
|
||||
</head>
|
||||
<body>
|
||||
<div class="noise"></div>
|
||||
|
|
@ -15,12 +21,13 @@
|
|||
<a href="/docs">API docs</a>
|
||||
<a href="/roles">Roles</a>
|
||||
<label class="compact">Tenant<select id="tenant-context"></select></label>
|
||||
<label class="compact">Theme
|
||||
<select id="theme"><option value="tokyo">Tokyo Night</option><option value="catppuccin">Catppuccin</option><option value="tomorrow">Tomorrow</option><option value="kanagawa">Kanagawa</option></select>
|
||||
</label>
|
||||
<button id="mode" class="icon-button" title="Toggle light/dark mode">◐</button>
|
||||
<a id="identity" class="identity" href="/profile"><img id="identity-avatar" alt="" width="22" height="22" hidden><span id="identity-name"></span></a>
|
||||
<form action="/auth/logout" method="post"><button class="ghost" type="submit">Log out</button></form>
|
||||
<!-- The controls, injected rather than hand-written. They live in a shadow root
|
||||
so this page's own CSS cannot reach them, and they read and write the same
|
||||
data-theme and data-mode attributes the stylesheet blocks above key on, so
|
||||
the values are already the ones this application was storing. -->
|
||||
<bananas-theme-selector id="theme"></bananas-theme-selector>
|
||||
<bananas-appearance-toggle id="mode"></bananas-appearance-toggle>
|
||||
<div data-account-menu></div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
|
|
@ -92,6 +99,12 @@
|
|||
<dialog id="access-dialog"><form id="access-form"><div class="dialog-head"><h3>Manage user access</h3><button type="button" class="close">×</button></div><input type="hidden" name="user_id"><input type="hidden" name="tenant_id"><input type="hidden" name="approval_mode"><label id="approval-tenant-label" hidden>Tenant<select name="approval_tenant_id" class="tenant-select"></select></label><label>Role<select name="role_id" id="access-role" required></select></label><fieldset><legend>Applications</legend><div id="access-apps" class="check-list"></div></fieldset><button type="submit">Update access</button></form></dialog>
|
||||
<dialog id="secret-dialog"><div class="dialog-head"><h3 id="secret-title">Secret issued</h3><button type="button" class="close">×</button></div><p id="secret-description">This secret is shown once. Copy it now.</p><div class="secret"><code id="new-secret"></code><button id="copy-secret" type="button">Copy</button></div></dialog>
|
||||
|
||||
<script src="/assets/account.js" defer></script>
|
||||
<script src="/assets/app.js" defer></script>
|
||||
<!-- Loaded from the theme service rather than vendored, so a change to the controls
|
||||
needs no rebuild here. A module import is a CORS request, so this deployment's
|
||||
origin must be in the service's CORS_ALLOWED_ORIGINS; a same-origin
|
||||
deployment needs nothing configured. -->
|
||||
<script type="module" src="__GO_LOOSE_THEME_ORIGIN__/rt/v1/components.js" data-bananas-components></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue