Files
registry/ui/src/app/features/oauth-callback/oauth-callback.component.ts

69 lines
2.9 KiB
TypeScript

import { Component, inject, signal, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { AuthService } from '../../core/services/auth.service';
import { ToastService } from '../../core/services/toast.service';
@Component({
selector: 'app-oauth-callback',
standalone: true,
template: `
<div class="min-h-screen flex items-center justify-center bg-background px-4">
<div class="max-w-md w-full text-center">
@if (error()) {
<div class="w-16 h-16 bg-destructive/10 flex items-center justify-center mx-auto mb-4">
<svg class="w-10 h-10 text-destructive" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
</svg>
</div>
<h1 class="font-mono text-xl font-bold text-foreground mb-2">Authentication Failed</h1>
<p class="font-mono text-sm text-muted-foreground mb-6">{{ error() }}</p>
<a href="/login" class="btn-primary btn-md">Back to Login</a>
} @else {
<div class="w-16 h-16 bg-primary flex items-center justify-center mx-auto mb-4">
<svg class="animate-spin w-10 h-10 text-primary-foreground" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"></path>
</svg>
</div>
<h1 class="font-mono text-xl font-bold text-foreground mb-2">Signing you in...</h1>
<p class="font-mono text-sm text-muted-foreground">Please wait while we complete authentication</p>
}
</div>
</div>
`,
})
export class OAuthCallbackComponent implements OnInit {
private authService = inject(AuthService);
private router = inject(Router);
private toastService = inject(ToastService);
error = signal<string | null>(null);
ngOnInit(): void {
this.handleCallback();
}
private handleCallback(): void {
const params = new URLSearchParams(window.location.search);
const accessToken = params.get('accessToken');
const refreshToken = params.get('refreshToken');
const sessionId = params.get('sessionId');
const errorParam = params.get('error');
if (errorParam) {
this.error.set(decodeURIComponent(errorParam));
return;
}
if (!accessToken || !refreshToken || !sessionId) {
this.error.set('Missing authentication tokens');
return;
}
// Store the tokens and redirect
this.authService.handleOAuthCallback(accessToken, refreshToken, sessionId);
this.toastService.success('Welcome!');
this.router.navigate(['/dashboard']);
}
}