GPT

Correct Authentication Components

// auth.component.ts import { Component, inject } from '@angular/core'; import { BetterAuthService } from 'better-auth-angular'; import { FormBuilder, Validators } from '@angular/forms'; @Component({ selector: 'app-aut

Prompt text

Original English text. Replace placeholders with your own details.

// auth.component.ts
import { Component, inject } from '@angular/core';
import { BetterAuthService } from 'better-auth-angular';
import { FormBuilder, Validators } from '@angular/forms';

@Component({
 selector: 'app-auth',
 template: `
 <ng-container *ngIf="auth.isAuthenticated$ | async; else loginForm">
 <div *ngIf="auth.user$ | async as user">
 <p>Welcome, {{ user.email }}</p>
 <button (click)="logout()">Sign Out</button>
 </div>
 </ng-container>
 <ng-template #loginForm>
 <form [formGroup]="form" (ngSubmit)="login()">
 <input formControlName="email" type="email" placeholder="Email" />
 <input formControlName="password" type="password" placeholder="Password" />
 <button type="submit" [disabled]="form.invalid">Sign In</button>
 </form>
 </ng-template>
 `
})
export class AuthComponent {
 private auth = inject(BetterAuthService);
 private fb = inject(FormBuilder);

 form = this.fb.group({
 email: ['', [Validators.required, Validators.email]],
 password: ['', [Validators.required, Validators.minLength(8)]]
 });

 async login() {
 if (this.form.valid) {
 try {
 const { email, password } = this.form.value;
 await this.auth.login(email!, password!);
 } catch (error) {
 console.error('Authentication failed:', error);
 }
 }
 }

 async logout() {
 try {
 await this.auth.logout();
 } catch (error) {
 console.error('Logout failed:', error);
 }
 }
}

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →