Phase 2 Admin Drawers & Scripts execution: - Extract `AppDrawer`, `InviteDrawer`, `RoleEditorDrawer`, and `GrantDrawer`. - Extract `AdminAppsScript`, `AdminInvitesScript`, `AdminRolesScript`, and `AdminUserDetailsScript`. - Hook extracted components into their respective pages. - Format `AdminRolesPage.tsx` and all modified files using `deno fmt`. Co-authored-by: mrteye <1945243+mrteye@users.noreply.github.com>
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
export const GrantDrawer = (
|
|
{ user, allApps }: { user: any; allApps: any[] },
|
|
) => {
|
|
return (
|
|
<div style="margin-top: 1rem; padding: 1.25rem; background: var(--surface-muted); border: 1px solid var(--border-subtle); border-radius: var(--radius-md);">
|
|
<h4 style="margin: 0 0 0.75rem 0; font-size: 0.95rem; color: var(--text-primary);">
|
|
Assign / Update Application Access
|
|
</h4>
|
|
<form
|
|
id="grantAccessForm"
|
|
onsubmit={`handleGrantAccess(event, '${user.id}')`}
|
|
style="display: flex; gap: 0.8rem; align-items: flex-end; flex-wrap: wrap;"
|
|
>
|
|
<div style="flex: 2; min-width: 200px;">
|
|
<label style="display: block; font-size: 0.8rem; font-weight: 600; margin-bottom: 0.3rem; color: var(--text-secondary);">
|
|
Application
|
|
</label>
|
|
<select
|
|
id="grantAppId"
|
|
onchange="updateRoleOptions()"
|
|
required
|
|
style="width: 100%;"
|
|
>
|
|
{allApps.map((app) => (
|
|
<option value={app.id}>
|
|
{app.name} ({app.spiffe_id})
|
|
</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
|
|
<div style="flex: 1; min-width: 140px;">
|
|
<label style="display: block; font-size: 0.8rem; font-weight: 600; margin-bottom: 0.3rem; color: var(--text-secondary);">
|
|
Assigned Role
|
|
</label>
|
|
<select
|
|
id="grantRole"
|
|
required
|
|
style="width: 100%;"
|
|
>
|
|
{/* Dynamically populated */}
|
|
</select>
|
|
</div>
|
|
|
|
<button
|
|
type="submit"
|
|
class="btn-primary"
|
|
style="min-height: 44px;"
|
|
>
|
|
Save Grant
|
|
</button>
|
|
</form>
|
|
</div>
|
|
);
|
|
};
|