feat(phase2): OAuth/Authentik integration + drag-and-drop reordering
- Add OIDC/OAuth2 login via openid-client with PKCE flow - Auto-provision OAuth users with group mapping - Conditional login page (OAuth/local/both based on auth mode) - Admin OAuth test connection button - Install svelte-dnd-action for board editor DnD - Draggable sections and widgets with cross-section moves - Reorder APIs with atomic Prisma transactions - Visual drag handles and drop zone indicators
This commit is contained in:
@@ -6,6 +6,32 @@
|
||||
let { form: formData }: { form: SuperValidated<z.infer<typeof updateSystemSettingsSchema>> } = $props();
|
||||
|
||||
const { form, errors, enhance, delayed } = superForm(formData);
|
||||
|
||||
let oauthTesting = $state(false);
|
||||
let oauthTestResult = $state('');
|
||||
let oauthTestSuccess = $state(false);
|
||||
|
||||
async function testOAuthConnection() {
|
||||
oauthTesting = true;
|
||||
oauthTestResult = '';
|
||||
oauthTestSuccess = false;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/admin/oauth/test', { method: 'POST' });
|
||||
const data = await response.json();
|
||||
|
||||
if (response.ok && data.success) {
|
||||
oauthTestSuccess = true;
|
||||
oauthTestResult = `Connected to issuer: ${data.issuer}`;
|
||||
} else {
|
||||
oauthTestResult = data.error || 'Connection test failed';
|
||||
}
|
||||
} catch {
|
||||
oauthTestResult = 'Network error — could not reach the server';
|
||||
} finally {
|
||||
oauthTesting = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<form method="POST" action="?/update" use:enhance class="space-y-8">
|
||||
@@ -42,10 +68,12 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- OAuth (stored but non-functional in MVP) -->
|
||||
<!-- OAuth Configuration -->
|
||||
<section class="rounded-lg border border-border bg-card p-6">
|
||||
<h2 class="mb-4 text-lg font-semibold text-card-foreground">OAuth Configuration</h2>
|
||||
<p class="mb-4 text-xs text-muted-foreground">OAuth settings are stored but not active in this MVP version.</p>
|
||||
<p class="mb-4 text-xs text-muted-foreground">
|
||||
Configure your OIDC provider (e.g. Authentik, Keycloak). Set Auth Mode to "OAuth" or "Both" above to enable OAuth login.
|
||||
</p>
|
||||
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
<div>
|
||||
<label for="oauthClientId" class="mb-1 block text-sm font-medium text-foreground">Client ID</label>
|
||||
@@ -81,6 +109,21 @@
|
||||
/>
|
||||
{#if $errors.oauthDiscoveryUrl}<span class="text-xs text-destructive">{$errors.oauthDiscoveryUrl}</span>{/if}
|
||||
</div>
|
||||
<div class="sm:col-span-2">
|
||||
<button
|
||||
type="button"
|
||||
onclick={testOAuthConnection}
|
||||
disabled={oauthTesting}
|
||||
class="rounded-md border border-border bg-background px-4 py-2 text-sm font-medium text-foreground transition-colors hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
|
||||
>
|
||||
{oauthTesting ? 'Testing...' : 'Test Connection'}
|
||||
</button>
|
||||
{#if oauthTestResult}
|
||||
<span class="ml-3 text-sm {oauthTestSuccess ? 'text-green-600 dark:text-green-400' : 'text-destructive'}">
|
||||
{oauthTestResult}
|
||||
</span>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
@@ -0,0 +1,127 @@
|
||||
<script lang="ts">
|
||||
import { dndzone } from 'svelte-dnd-action';
|
||||
import DraggableSection from '$lib/components/section/DraggableSection.svelte';
|
||||
|
||||
interface WidgetData {
|
||||
id: string;
|
||||
type: string;
|
||||
order: number;
|
||||
config: string;
|
||||
appId: string | null;
|
||||
sectionId: string;
|
||||
app: {
|
||||
id: string;
|
||||
name: string;
|
||||
url: string;
|
||||
icon: string | null;
|
||||
iconType: string;
|
||||
description: string | null;
|
||||
statuses: Array<{ status: string; responseTime: number | null }>;
|
||||
} | null;
|
||||
}
|
||||
|
||||
interface SectionData {
|
||||
id: string;
|
||||
title: string;
|
||||
icon: string | null;
|
||||
order: number;
|
||||
isExpandedByDefault: boolean;
|
||||
widgets: WidgetData[];
|
||||
}
|
||||
|
||||
interface Props {
|
||||
boardId: string;
|
||||
sections: SectionData[];
|
||||
apps: Array<{ id: string; name: string }>;
|
||||
addWidgetSectionId: string | null;
|
||||
onToggleAddWidget: (sectionId: string) => void;
|
||||
onDeleteSection: (sectionId: string) => void;
|
||||
onAddWidget: (sectionId: string, appId: string) => void;
|
||||
onDeleteWidget: (widgetId: string) => void;
|
||||
}
|
||||
|
||||
let {
|
||||
boardId,
|
||||
sections: initialSections,
|
||||
apps,
|
||||
addWidgetSectionId,
|
||||
onToggleAddWidget,
|
||||
onDeleteSection,
|
||||
onAddWidget,
|
||||
onDeleteWidget
|
||||
}: Props = $props();
|
||||
|
||||
let sections = $state<SectionData[]>([...initialSections]);
|
||||
|
||||
// Keep local state in sync when parent data changes
|
||||
$effect(() => {
|
||||
sections = [...initialSections];
|
||||
});
|
||||
|
||||
const flipDurationMs = 200;
|
||||
|
||||
function handleConsider(e: CustomEvent<{ items: SectionData[] }>) {
|
||||
sections = e.detail.items;
|
||||
}
|
||||
|
||||
async function handleFinalize(e: CustomEvent<{ items: SectionData[] }>) {
|
||||
sections = e.detail.items;
|
||||
const sectionIds = sections.map((s) => s.id);
|
||||
|
||||
try {
|
||||
await fetch(`/api/boards/${boardId}/reorder`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ sectionIds })
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('Failed to persist section reorder:', err);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleWidgetsUpdate(sectionId: string, widgets: WidgetData[]) {
|
||||
// Update local state
|
||||
sections = sections.map((s) => (s.id === sectionId ? { ...s, widgets } : s));
|
||||
|
||||
const widgetIds = widgets.map((w) => w.id);
|
||||
|
||||
try {
|
||||
await fetch(`/api/boards/${boardId}/sections/${sectionId}/reorder`, {
|
||||
method: 'PUT',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ widgetIds })
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('Failed to persist widget reorder:', err);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if sections.length === 0}
|
||||
<div class="rounded-xl border border-border bg-card/50 p-8 text-center">
|
||||
<p class="text-muted-foreground">No sections yet. Add one to get started.</p>
|
||||
</div>
|
||||
{:else}
|
||||
<div
|
||||
use:dndzone={{ items: sections, flipDurationMs, dropTargetStyle: {} }}
|
||||
onconsider={handleConsider}
|
||||
onfinalize={handleFinalize}
|
||||
class="space-y-4"
|
||||
>
|
||||
{#each sections as section (section.id)}
|
||||
<div>
|
||||
<DraggableSection
|
||||
{section}
|
||||
{boardId}
|
||||
{apps}
|
||||
onWidgetsUpdate={handleWidgetsUpdate}
|
||||
{addWidgetSectionId}
|
||||
{onToggleAddWidget}
|
||||
{onDeleteSection}
|
||||
{onAddWidget}
|
||||
{onDeleteWidget}
|
||||
/>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
@@ -0,0 +1,208 @@
|
||||
<script lang="ts">
|
||||
import { dndzone } from 'svelte-dnd-action';
|
||||
import DraggableWidget from '$lib/components/widget/DraggableWidget.svelte';
|
||||
|
||||
interface WidgetData {
|
||||
id: string;
|
||||
type: string;
|
||||
order: number;
|
||||
config: string;
|
||||
appId: string | null;
|
||||
sectionId: string;
|
||||
app: {
|
||||
id: string;
|
||||
name: string;
|
||||
url: string;
|
||||
icon: string | null;
|
||||
iconType: string;
|
||||
description: string | null;
|
||||
statuses: Array<{ status: string; responseTime: number | null }>;
|
||||
} | null;
|
||||
}
|
||||
|
||||
interface SectionData {
|
||||
id: string;
|
||||
title: string;
|
||||
icon: string | null;
|
||||
order: number;
|
||||
isExpandedByDefault: boolean;
|
||||
widgets: WidgetData[];
|
||||
}
|
||||
|
||||
interface Props {
|
||||
section: SectionData;
|
||||
boardId: string;
|
||||
apps: Array<{ id: string; name: string }>;
|
||||
onWidgetsUpdate: (sectionId: string, widgets: WidgetData[]) => void;
|
||||
addWidgetSectionId: string | null;
|
||||
onToggleAddWidget: (sectionId: string) => void;
|
||||
onDeleteSection: (sectionId: string) => void;
|
||||
onAddWidget: (sectionId: string, appId: string) => void;
|
||||
onDeleteWidget: (widgetId: string) => void;
|
||||
}
|
||||
|
||||
let {
|
||||
section,
|
||||
boardId,
|
||||
apps,
|
||||
onWidgetsUpdate,
|
||||
addWidgetSectionId,
|
||||
onToggleAddWidget,
|
||||
onDeleteSection,
|
||||
onAddWidget,
|
||||
onDeleteWidget
|
||||
}: Props = $props();
|
||||
|
||||
let widgets = $state<WidgetData[]>([...section.widgets]);
|
||||
|
||||
// Keep local state in sync when parent data changes
|
||||
$effect(() => {
|
||||
widgets = [...section.widgets];
|
||||
});
|
||||
|
||||
const flipDurationMs = 200;
|
||||
|
||||
function handleConsider(e: CustomEvent<{ items: WidgetData[] }>) {
|
||||
widgets = e.detail.items;
|
||||
}
|
||||
|
||||
function handleFinalize(e: CustomEvent<{ items: WidgetData[] }>) {
|
||||
widgets = e.detail.items;
|
||||
onWidgetsUpdate(section.id, widgets);
|
||||
}
|
||||
|
||||
let selectedAppId = $state('');
|
||||
</script>
|
||||
|
||||
<div class="rounded-xl border border-border bg-card p-4 shadow-sm">
|
||||
<div class="mb-3 flex items-center justify-between">
|
||||
<div class="flex items-center gap-2">
|
||||
<!-- Section drag handle -->
|
||||
<div
|
||||
class="flex shrink-0 cursor-grab items-center px-1 text-muted-foreground transition-opacity active:cursor-grabbing"
|
||||
aria-label="Drag to reorder section"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="9" cy="5" r="1" />
|
||||
<circle cx="9" cy="12" r="1" />
|
||||
<circle cx="9" cy="19" r="1" />
|
||||
<circle cx="15" cy="5" r="1" />
|
||||
<circle cx="15" cy="12" r="1" />
|
||||
<circle cx="15" cy="19" r="1" />
|
||||
</svg>
|
||||
</div>
|
||||
<span class="font-medium text-foreground">{section.title}</span>
|
||||
<span class="text-xs text-muted-foreground">Order: {section.order}</span>
|
||||
{#if section.icon}
|
||||
<span class="text-xs text-muted-foreground">({section.icon})</span>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => onToggleAddWidget(section.id)}
|
||||
class="rounded-md bg-primary px-2 py-1 text-xs font-medium text-primary-foreground transition-colors hover:bg-primary/90"
|
||||
>
|
||||
Add Widget
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => onDeleteSection(section.id)}
|
||||
class="rounded-md bg-destructive px-2 py-1 text-xs font-medium text-destructive-foreground transition-colors hover:bg-destructive/90"
|
||||
>
|
||||
Delete
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{#if addWidgetSectionId === section.id}
|
||||
<div class="mb-3 rounded-lg border border-border bg-muted/50 p-3">
|
||||
<div>
|
||||
<label for="widget-app-{section.id}" class="mb-1 block text-sm font-medium text-foreground"
|
||||
>Select App</label
|
||||
>
|
||||
<select
|
||||
id="widget-app-{section.id}"
|
||||
bind:value={selectedAppId}
|
||||
class="w-full rounded-lg border border-input bg-background px-3 py-2 text-sm text-foreground transition-colors focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring/30"
|
||||
>
|
||||
<option value="">Choose an app...</option>
|
||||
{#each apps as app (app.id)}
|
||||
<option value={app.id}>{app.name}</option>
|
||||
{/each}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
if (selectedAppId) {
|
||||
onAddWidget(section.id, selectedAppId);
|
||||
selectedAppId = '';
|
||||
}
|
||||
}}
|
||||
disabled={!selectedAppId}
|
||||
class="rounded-md bg-primary px-2 py-1 text-xs font-medium text-primary-foreground transition-colors hover:bg-primary/90 disabled:opacity-50"
|
||||
>
|
||||
Add
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<!-- Widgets drop zone -->
|
||||
{#if widgets.length === 0}
|
||||
<div
|
||||
use:dndzone={{ items: widgets, flipDurationMs, dropTargetStyle: {} }}
|
||||
onconsider={handleConsider}
|
||||
onfinalize={handleFinalize}
|
||||
class="min-h-[48px] rounded-lg border-2 border-dashed border-border/50 p-2 transition-colors"
|
||||
>
|
||||
<p class="text-center text-sm text-muted-foreground">
|
||||
No widgets. Drag widgets here or add one above.
|
||||
</p>
|
||||
</div>
|
||||
{:else}
|
||||
<div
|
||||
use:dndzone={{ items: widgets, flipDurationMs, dropTargetStyle: {} }}
|
||||
onconsider={handleConsider}
|
||||
onfinalize={handleFinalize}
|
||||
class="min-h-[48px] space-y-2 rounded-lg border-2 border-dashed border-transparent p-1 transition-colors"
|
||||
>
|
||||
{#each widgets as widget (widget.id)}
|
||||
<div class="rounded-lg border border-border bg-background/50 px-3 py-2">
|
||||
<DraggableWidget>
|
||||
<div class="flex items-center justify-between">
|
||||
<div class="flex items-center gap-2">
|
||||
<span class="text-xs font-medium uppercase text-primary">{widget.type}</span>
|
||||
{#if widget.app}
|
||||
<span class="text-sm text-foreground">{widget.app.name}</span>
|
||||
<span class="text-xs text-muted-foreground">({widget.app.url})</span>
|
||||
{:else}
|
||||
<span class="text-sm text-muted-foreground">Widget #{widget.order}</span>
|
||||
{/if}
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => onDeleteWidget(widget.id)}
|
||||
class="rounded-md bg-destructive px-2 py-1 text-xs font-medium text-destructive-foreground transition-colors hover:bg-destructive/90"
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
</div>
|
||||
</DraggableWidget>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
@@ -0,0 +1,41 @@
|
||||
<script lang="ts">
|
||||
import type { Snippet } from 'svelte';
|
||||
|
||||
interface Props {
|
||||
children: Snippet;
|
||||
}
|
||||
|
||||
let { children }: Props = $props();
|
||||
</script>
|
||||
|
||||
<div class="group/widget relative flex items-center gap-2">
|
||||
<!-- Drag handle -->
|
||||
<div
|
||||
class="flex h-full shrink-0 cursor-grab items-center px-1 text-muted-foreground opacity-0 transition-opacity group-hover/widget:opacity-100 active:cursor-grabbing"
|
||||
aria-label="Drag to reorder widget"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="14"
|
||||
height="14"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<circle cx="9" cy="5" r="1" />
|
||||
<circle cx="9" cy="12" r="1" />
|
||||
<circle cx="9" cy="19" r="1" />
|
||||
<circle cx="15" cy="5" r="1" />
|
||||
<circle cx="15" cy="12" r="1" />
|
||||
<circle cx="15" cy="19" r="1" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<!-- Widget content -->
|
||||
<div class="min-w-0 flex-1">
|
||||
{@render children()}
|
||||
</div>
|
||||
</div>
|
||||
@@ -261,3 +261,41 @@ export async function removeWidget(id: string) {
|
||||
await findWidgetById(id);
|
||||
await prisma.widget.delete({ where: { id } });
|
||||
}
|
||||
|
||||
// --- Reorder ---
|
||||
|
||||
export async function reorderSections(boardId: string, sectionIds: string[]) {
|
||||
await findBoardById(boardId);
|
||||
|
||||
const updates = sectionIds.map((id, index) =>
|
||||
prisma.section.update({
|
||||
where: { id },
|
||||
data: { order: index }
|
||||
})
|
||||
);
|
||||
|
||||
return prisma.$transaction(updates);
|
||||
}
|
||||
|
||||
export async function reorderWidgets(sectionId: string, widgetIds: string[]) {
|
||||
await findSectionById(sectionId);
|
||||
|
||||
const updates = widgetIds.map((id, index) =>
|
||||
prisma.widget.update({
|
||||
where: { id },
|
||||
data: { order: index, sectionId }
|
||||
})
|
||||
);
|
||||
|
||||
return prisma.$transaction(updates);
|
||||
}
|
||||
|
||||
export async function moveWidget(widgetId: string, targetSectionId: string, order: number) {
|
||||
await findWidgetById(widgetId);
|
||||
await findSectionById(targetSectionId);
|
||||
|
||||
return prisma.widget.update({
|
||||
where: { id: widgetId },
|
||||
data: { sectionId: targetSectionId, order }
|
||||
});
|
||||
}
|
||||
|
||||
@@ -0,0 +1,170 @@
|
||||
import * as client from 'openid-client';
|
||||
import { prisma } from '../prisma.js';
|
||||
import { DEFAULTS } from '$lib/utils/constants.js';
|
||||
|
||||
interface OAuthConfig {
|
||||
readonly clientId: string;
|
||||
readonly clientSecret: string;
|
||||
readonly discoveryUrl: string;
|
||||
}
|
||||
|
||||
export interface OAuthUserInfo {
|
||||
readonly sub: string;
|
||||
readonly email: string;
|
||||
readonly name?: string;
|
||||
readonly preferred_username?: string;
|
||||
readonly picture?: string;
|
||||
readonly groups?: readonly string[];
|
||||
}
|
||||
|
||||
/** Cached OIDC configuration to avoid re-discovery on every request */
|
||||
let cachedConfig: client.Configuration | null = null;
|
||||
let cachedConfigKey: string | null = null;
|
||||
|
||||
/**
|
||||
* Loads OAuth settings from SystemSettings DB, falling back to env vars.
|
||||
*/
|
||||
async function loadOAuthConfig(): Promise<OAuthConfig> {
|
||||
const settings = await prisma.systemSettings.findUnique({
|
||||
where: { id: DEFAULTS.SYSTEM_SETTINGS_ID }
|
||||
});
|
||||
|
||||
const clientId = settings?.oauthClientId || process.env.OAUTH_CLIENT_ID || '';
|
||||
const clientSecret = settings?.oauthClientSecret || process.env.OAUTH_CLIENT_SECRET || '';
|
||||
const discoveryUrl = settings?.oauthDiscoveryUrl || process.env.OAUTH_DISCOVERY_URL || '';
|
||||
|
||||
if (!clientId || !clientSecret || !discoveryUrl) {
|
||||
throw new Error(
|
||||
'OAuth is not configured. Set client ID, client secret, and discovery URL in admin settings or environment variables.'
|
||||
);
|
||||
}
|
||||
|
||||
return { clientId, clientSecret, discoveryUrl };
|
||||
}
|
||||
|
||||
/**
|
||||
* Derives the issuer URL from a discovery URL.
|
||||
* If the URL ends with /.well-known/openid-configuration, strip that suffix.
|
||||
* Otherwise use the URL as-is (openid-client discovery will append the well-known path).
|
||||
*/
|
||||
function deriveIssuerUrl(discoveryUrl: string): URL {
|
||||
const wellKnownSuffix = '/.well-known/openid-configuration';
|
||||
if (discoveryUrl.endsWith(wellKnownSuffix)) {
|
||||
return new URL(discoveryUrl.slice(0, -wellKnownSuffix.length));
|
||||
}
|
||||
return new URL(discoveryUrl);
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns a cached OIDC Configuration, performing discovery only when
|
||||
* the OAuth settings have changed.
|
||||
*/
|
||||
async function getOIDCConfig(): Promise<client.Configuration> {
|
||||
const oauthConfig = await loadOAuthConfig();
|
||||
const cacheKey = `${oauthConfig.discoveryUrl}|${oauthConfig.clientId}`;
|
||||
|
||||
if (cachedConfig && cachedConfigKey === cacheKey) {
|
||||
return cachedConfig;
|
||||
}
|
||||
|
||||
const issuerUrl = deriveIssuerUrl(oauthConfig.discoveryUrl);
|
||||
const config = await client.discovery(
|
||||
issuerUrl,
|
||||
oauthConfig.clientId,
|
||||
oauthConfig.clientSecret
|
||||
);
|
||||
|
||||
cachedConfig = config;
|
||||
cachedConfigKey = cacheKey;
|
||||
|
||||
return config;
|
||||
}
|
||||
|
||||
/**
|
||||
* Invalidates the cached OIDC configuration, forcing re-discovery
|
||||
* on the next request. Useful after admin changes OAuth settings.
|
||||
*/
|
||||
export function invalidateOAuthCache(): void {
|
||||
cachedConfig = null;
|
||||
cachedConfigKey = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates a PKCE code_verifier (random string).
|
||||
*/
|
||||
export function generateCodeVerifier(): string {
|
||||
return client.randomPKCECodeVerifier();
|
||||
}
|
||||
|
||||
/**
|
||||
* Calculates the PKCE code_challenge from a code_verifier.
|
||||
*/
|
||||
export async function calculateCodeChallenge(codeVerifier: string): Promise<string> {
|
||||
return client.calculatePKCECodeChallenge(codeVerifier);
|
||||
}
|
||||
|
||||
/**
|
||||
* Builds the authorization URL to redirect the user to the OIDC provider.
|
||||
*/
|
||||
export async function generateAuthUrl(
|
||||
redirectUri: string,
|
||||
codeChallenge: string
|
||||
): Promise<string> {
|
||||
const config = await getOIDCConfig();
|
||||
|
||||
const parameters: Record<string, string> = {
|
||||
redirect_uri: redirectUri,
|
||||
scope: 'openid profile email',
|
||||
code_challenge: codeChallenge,
|
||||
code_challenge_method: 'S256'
|
||||
};
|
||||
|
||||
// Add state if the server might not support PKCE
|
||||
if (!config.serverMetadata().supportsPKCE()) {
|
||||
parameters.state = client.randomState();
|
||||
}
|
||||
|
||||
const url = client.buildAuthorizationUrl(config, parameters);
|
||||
return url.href;
|
||||
}
|
||||
|
||||
/**
|
||||
* Exchanges an authorization code for tokens and fetches user info.
|
||||
*/
|
||||
export async function handleCallback(
|
||||
callbackUrl: URL,
|
||||
codeVerifier: string
|
||||
): Promise<OAuthUserInfo> {
|
||||
const config = await getOIDCConfig();
|
||||
|
||||
const tokens = await client.authorizationCodeGrant(config, callbackUrl, {
|
||||
pkceCodeVerifier: codeVerifier
|
||||
});
|
||||
|
||||
// Try to get user info from the userinfo endpoint
|
||||
const userInfo = await client.fetchUserInfo(config, tokens.access_token, tokens.claims()?.sub);
|
||||
|
||||
const email = (userInfo.email as string) || '';
|
||||
if (!email) {
|
||||
throw new Error('OAuth provider did not return an email address. Ensure the "email" scope is configured.');
|
||||
}
|
||||
|
||||
return {
|
||||
sub: userInfo.sub,
|
||||
email,
|
||||
name: (userInfo.name as string) || (userInfo.preferred_username as string) || undefined,
|
||||
preferred_username: (userInfo.preferred_username as string) || undefined,
|
||||
picture: (userInfo.picture as string) || undefined,
|
||||
groups: Array.isArray(userInfo.groups) ? (userInfo.groups as string[]) : undefined
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Tests the OAuth connection by performing OIDC discovery.
|
||||
* Returns the issuer string on success, throws on failure.
|
||||
*/
|
||||
export async function testConnection(): Promise<string> {
|
||||
const config = await getOIDCConfig();
|
||||
const issuer = config.serverMetadata().issuer;
|
||||
return issuer;
|
||||
}
|
||||
@@ -102,3 +102,96 @@ export async function getUserGroups(userId: string) {
|
||||
export async function count() {
|
||||
return prisma.user.count();
|
||||
}
|
||||
|
||||
interface OAuthProvisionInput {
|
||||
readonly email: string;
|
||||
readonly displayName: string;
|
||||
readonly avatarUrl?: string;
|
||||
readonly groups?: readonly string[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Finds an existing user by email or creates a new OAuth-provisioned user.
|
||||
* - If the user exists: updates authProvider to 'oauth' and syncs display name / avatar if changed.
|
||||
* - If the user does not exist: creates a new user with authProvider='oauth', null password, role='user'.
|
||||
* - Maps OAuth group names to local groups when the groups claim is present.
|
||||
*/
|
||||
export async function findOrCreateByOAuth(input: OAuthProvisionInput) {
|
||||
const existing = await prisma.user.findUnique({
|
||||
where: { email: input.email },
|
||||
select: { ...USER_SELECT, password: true }
|
||||
});
|
||||
|
||||
let userId: string;
|
||||
|
||||
if (existing) {
|
||||
// Update the existing user's OAuth-related fields if anything changed
|
||||
const updates: Record<string, unknown> = { authProvider: 'oauth' };
|
||||
if (input.displayName && input.displayName !== existing.displayName) {
|
||||
updates.displayName = input.displayName;
|
||||
}
|
||||
if (input.avatarUrl !== undefined && input.avatarUrl !== existing.avatarUrl) {
|
||||
updates.avatarUrl = input.avatarUrl;
|
||||
}
|
||||
|
||||
await prisma.user.update({
|
||||
where: { id: existing.id },
|
||||
data: updates
|
||||
});
|
||||
|
||||
userId = existing.id;
|
||||
} else {
|
||||
// Create a new OAuth user
|
||||
const newUser = await prisma.user.create({
|
||||
data: {
|
||||
email: input.email,
|
||||
password: null,
|
||||
displayName: input.displayName,
|
||||
avatarUrl: input.avatarUrl ?? null,
|
||||
authProvider: 'oauth',
|
||||
role: 'user'
|
||||
},
|
||||
select: USER_SELECT
|
||||
});
|
||||
|
||||
userId = newUser.id;
|
||||
}
|
||||
|
||||
// Sync OAuth groups to local groups if the groups claim is present
|
||||
if (input.groups && input.groups.length > 0) {
|
||||
await syncOAuthGroups(userId, input.groups);
|
||||
}
|
||||
|
||||
// Return the full user record
|
||||
return prisma.user.findUniqueOrThrow({
|
||||
where: { id: userId },
|
||||
select: USER_SELECT
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Maps OAuth group names to existing local groups and syncs membership.
|
||||
* Only groups that already exist locally are linked — no auto-creation.
|
||||
*/
|
||||
async function syncOAuthGroups(userId: string, oauthGroupNames: readonly string[]) {
|
||||
// Find local groups matching the OAuth group names
|
||||
const matchingGroups = await prisma.group.findMany({
|
||||
where: { name: { in: [...oauthGroupNames] } },
|
||||
select: { id: true }
|
||||
});
|
||||
|
||||
if (matchingGroups.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Upsert memberships (idempotent — won't fail if already a member)
|
||||
for (const group of matchingGroups) {
|
||||
await prisma.userGroup.upsert({
|
||||
where: {
|
||||
userId_groupId: { userId, groupId: group.id }
|
||||
},
|
||||
update: {},
|
||||
create: { userId, groupId: group.id }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user