@rtsee/ngx 0.0.57 → 0.0.59

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.0.59 (2025-09-21)
+
+**Note:** Version bump only for package @rtsee/ngx
+
+## 0.0.58 (2025-08-11)
+
+**Note:** Version bump only for package @rtsee/ngx
+
 ## 0.0.57 (2025-07-23)
 
 **Note:** Version bump only for package @rtsee/ngx

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.57",
+  "version": "0.0.59",
   "name": "@rtsee/ngx",
   "module": "./dist/ngx/fesm2022/rtsee-ngx.mjs",
   "types": "./dist/ngx/index.d.ts",
@@ -30,15 +30,18 @@
     "@angular/platform-browser": "~20.1.2",
     "@angular/platform-browser-dynamic": "~20.1.2",
     "@angular/router": "~20.1.2",
-    "@rtsee/common": "^0.0.27",
-    "@rtsee/conference": "^0.0.28",
-    "@rtsee/events-dashboard": "^0.0.61",
-    "@rtsee/factory": "^0.0.70",
-    "@rtsee/messenger": "^0.0.61",
+    "@primeuix/themes": "^1.2.3",
+    "@rtsee/common": "^0.0.29",
+    "@rtsee/conference": "^0.0.30",
+    "@rtsee/events-dashboard": "^0.0.63",
+    "@rtsee/factory": "^0.0.72",
+    "@rtsee/messenger": "^0.0.63",
     "@rtsee/signaling-client": "^0.0.66",
     "dayjs": "^1.11.9",
     "ngx-autosize": "^2.0.4",
+    "ngx-captcha": "^14.0.0",
     "ngx-infinite-scroll": "20.0.0",
+    "primeng": "^20.1.2",
     "rxjs": "~7.8.0",
     "shave": "^5.0.0",
     "swiper": "^11.1.15",
@@ -58,5 +61,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "741e30dc35daea6122d5bd94a6c070e02a31bc62"
+  "gitHead": "07cce216164a8c6a5639bf0e54e8ad7f71c9d6db"
 }

package/projects/ngx/src/lib/common/interfaces/index.ts

@@ -0,0 +1 @@
+export * from './server-errors';

package/projects/ngx/src/lib/common/interfaces/server-errors.ts

@@ -0,0 +1,5 @@
+export interface ServerSideError {
+  error: {
+    message: string;
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/auth/auth.component.html

@@ -1,12 +1,16 @@
 <div class="rtsee-auth">
-  <button (click)="activeComponent = 'sign-in'">Sing In</button>
-  <button (click)="activeComponent = 'sign-up'">Sing Up</button>
-  <button (click)="activeComponent = 'forgot-password'">Forgot Password</button>
-  <button (click)="activeComponent = 'reset-password'">Reset Password</button>
-
-
-  <rtsee-sign-in *ngIf="activeComponent === 'sign-in'"></rtsee-sign-in>
-  <rtsee-sign-up *ngIf="activeComponent === 'sign-up'"></rtsee-sign-up>
-  <rtsee-forgot-password *ngIf="activeComponent === 'forgot-password'"></rtsee-forgot-password>
-  <rtsee-reset-password *ngIf="activeComponent === 'reset-password'"></rtsee-reset-password>
+  @if (authService.rtseeAuth) {
+    @if (activeComponent === 'sign-in') {
+      <rtsee-sign-in></rtsee-sign-in>
+    }
+    @if (activeComponent === 'sign-up') {
+      <rtsee-sign-up></rtsee-sign-up>
+    }
+    @if (activeComponent === 'forgot-password') {
+      <rtsee-forgot-password></rtsee-forgot-password>
+    }
+    @if (activeComponent === 'reset-password') {
+      <rtsee-reset-password *ngIf="activeComponent === 'reset-password'"></rtsee-reset-password>
+    }
+  }
 </div>

package/projects/ngx/src/lib/components/rtsee-auth/auth/auth.component.ts

@@ -1,9 +1,12 @@
-import { Component } from '@angular/core';
+import {Component, Input, OnInit} from '@angular/core';
 import {SignInComponent} from "../sign-in/sign-in.component";
 import {SignUpComponent} from "../sign-up/sign-up.component";
 import {ForgotPasswordComponent} from "../forgot-password/forgot-password.component";
 import {ResetPasswordComponent} from "../reset-password/reset-password.component";
 import {NgIf} from "@angular/common";
+import {RTSeeAuthService} from "../services/auth.service";
+import {RTSeeAuth} from "@rtsee/auth";
+import {AuthEndpointsKeys, DEFAULT_ROUTE_NAMES} from "@rtsee/auth";
 
 @Component({
   selector: 'rtsee-auth',
@@ -17,6 +20,29 @@ import {NgIf} from "@angular/common";
   ],
   standalone: true
 })
-export class AuthComponent {
+export class RTSeeAuthComponent implements OnInit {
+  @Input() auth!: RTSeeAuth<any>;
+
   activeComponent: 'reset-password' | 'sign-up' | 'sign-in' | 'forgot-password' = 'sign-in' ;
+
+  constructor(public authService: RTSeeAuthService) {
+    console.log('constructor', window.location.pathname);
+
+    if (window.location.pathname.includes(DEFAULT_ROUTE_NAMES[AuthEndpointsKeys.SIGN_IN])) {
+      this.activeComponent = 'sign-in';
+    } else if (window.location.pathname.includes(DEFAULT_ROUTE_NAMES[AuthEndpointsKeys.SIGN_UP])) {
+      this.activeComponent = 'sign-up';
+    } else if (window.location.pathname.includes(DEFAULT_ROUTE_NAMES[AuthEndpointsKeys.FORGOT_PASSWORD])) {
+      this.activeComponent = 'forgot-password';
+    } else if (
+      window.location.pathname
+      .includes(DEFAULT_ROUTE_NAMES[AuthEndpointsKeys.RESET_PASSWORD].split('/')[0])
+    ) {
+      this.activeComponent = 'reset-password';
+    }
+  }
+
+  ngOnInit() {
+    this.authService.init(this.auth);
+  }
 }

package/projects/ngx/src/lib/components/rtsee-auth/forgot-password/forgot-password.component.html

@@ -30,6 +30,6 @@
 
   <!-- Redirect to Sign-In -->
   <p class="auth-media-blue-gray-sm-normal">
-    Пам'ятаєте пароль? <a [routerLink]="['/', 'sign-in']" class="auth-deep-blue-sm-medium">Увійдіть</a>
+    Пам'ятаєте пароль? <a [routerLink]="authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_IN)" class="auth-deep-blue-sm-medium">Увійдіть</a>
   </p>
 </div>

package/projects/ngx/src/lib/components/rtsee-auth/forgot-password/forgot-password.component.ts

@@ -3,6 +3,8 @@ import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/
 import { UtilsService } from '../services/utils.service';
 import { ForgotPasswordForm, TypedReactiveForm } from '../types/auth-form.type';
 import {RouterLink} from "@angular/router";
+import { RTSeeAuthConfiguration, AuthEndpointsKeys } from "@rtsee/auth";
+import { RTSeeAuthService } from "../services/auth.service";
 
 @Component({
   selector: 'rtsee-forgot-password',
@@ -17,19 +19,24 @@ export class ForgotPasswordComponent {
   public isLoading: boolean = false;
   public readonly emailForm: FormGroup<TypedReactiveForm<ForgotPasswordForm>>;
   public readonly forgotPasswordFormKeys: Record<keyof ForgotPasswordForm, string>;
+  authConfiguration: RTSeeAuthConfiguration;
+
   constructor(
-    private readonly formBuilder: FormBuilder
+    private readonly formBuilder: FormBuilder,
+    private authService: RTSeeAuthService
   ) {
-  this.emailForm= this.formBuilder.group<TypedReactiveForm<ForgotPasswordForm>>({
-      email: this.formBuilder.control(null, { validators: [Validators.required, Validators.email] }),
+    this.emailForm= this.formBuilder.group<TypedReactiveForm<ForgotPasswordForm>>({
+      email: this.formBuilder.nonNullable.control('', { validators: [Validators.required, Validators.email] }),
     });
-  this.forgotPasswordFormKeys = UtilsService.getKeysAsValueObject(this.emailForm.getRawValue());
-
+    this.forgotPasswordFormKeys = UtilsService.getKeysAsValueObject(this.emailForm.getRawValue());
+    this.authConfiguration = this.authService.rtseeAuth.authConfiguration;
   }
 
   public submitEmail(): void {
     if (this.emailForm.valid) {
     }
   }
+
+  protected readonly AuthEndpointsKeys = AuthEndpointsKeys;
 }
 

package/projects/ngx/src/lib/components/rtsee-auth/reset-password/reset-password.component.ts

@@ -2,9 +2,11 @@ import { Component, OnInit } from '@angular/core';
 import {FormBuilder, FormGroup, ReactiveFormsModule, ValidatorFn, Validators} from '@angular/forms';
 import { ResetPasswordForm, TypedReactiveForm } from '../types/auth-form.type';
 import { UtilsService } from '../services/utils.service';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
 import { FormErrorKey } from '../../enums/form.enum';
 import { COMMON_CONSTANTS } from '../../constans/common.const';
+import { RTSeeAuthService } from "../services/auth.service";
+import { RTSeeAuthConfiguration } from "@rtsee/auth";
 
 @Component({
   selector: 'rtsee-reset-password',
@@ -23,17 +25,19 @@ export class ResetPasswordComponent implements OnInit {
     passwordConfirm: true
   };
   private token!: string;
+  authConfiguration: RTSeeAuthConfiguration;
 
   constructor(
     private formBuilder: FormBuilder,
     private route: ActivatedRoute,
-    private router: Router
+    private authService: RTSeeAuthService
   ) {
     this.resetPasswordForm = this.formBuilder.group({
       password: this.formBuilder.control('', {validators: [Validators.required, Validators.minLength(COMMON_CONSTANTS.minPasswordLength)], nonNullable: true}),
       passwordConfirm: this.formBuilder.control('', {validators: [Validators.required, Validators.minLength(COMMON_CONSTANTS.minPasswordLength)], nonNullable: true}),
     }, {validators: [this.passwordMatchValidator()]});
     this.passwordFormKeys = UtilsService.getKeysAsValueObject(this.resetPasswordForm.value);
+    this.authConfiguration = this.authService.authConfiguration;
   }
 
   public ngOnInit(): void {

package/projects/ngx/src/lib/components/rtsee-auth/services/auth.service.ts

@@ -0,0 +1,40 @@
+import { Injectable } from '@angular/core';
+import {HttpClient} from "@angular/common/http";
+import {
+  RTSeeAuth,
+  IRtseeSignInRequestOptions,
+  IRTSeeSignInResponse,
+  IRtseeSignUpRequestOptions,
+  IRTSeeSignUpResponse,
+  AuthEndpointsKeys,
+  RTSeeAuthConfiguration
+} from "@rtsee/auth";
+import { Observable, tap } from "rxjs";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class RTSeeAuthService {
+  rtseeAuth!: RTSeeAuth<any>;
+  authConfiguration!: RTSeeAuthConfiguration;
+
+  constructor(
+    private http: HttpClient,
+  ) {}
+
+  init(auth: RTSeeAuth<any>) {
+    this.rtseeAuth = auth;
+    this.authConfiguration = this.rtseeAuth.authConfiguration;
+  }
+
+  signIn(credentials: IRtseeSignInRequestOptions): Observable<IRTSeeSignInResponse> {
+    return this.http
+      .post<IRTSeeSignInResponse>(this.authConfiguration.getEndpointPathByEndpointName(AuthEndpointsKeys.SIGN_IN), credentials)
+      .pipe(tap((res) => this.rtseeAuth.authenticate(res)))
+  }
+
+  signUp(credentials: IRtseeSignUpRequestOptions): Observable<IRTSeeSignUpResponse> {
+    return this.http
+      .post<IRTSeeSignUpResponse>(this.authConfiguration.getEndpointPathByEndpointName(AuthEndpointsKeys.SIGN_UP), credentials)
+  }
+}

package/projects/ngx/src/lib/components/rtsee-auth/sign-in/sign-in.component.html

@@ -1,45 +1,83 @@
-<div class="auth-container">
-  <img ngSrc="/assets/img.png"
+<div class="auth-container rtsee-form-container" >
+  <img [ngSrc]="authConfiguration.appLogo"
        alt="Company Logo"
        class="auth-logo"
-       height="38"
+       height="37"
        width="37"
   />
   <h2 class="auth-title">Вхід в Особистий Кабінет</h2>
   <p class="auth-title-description">Аби переглядати казки, увійдіть в свій особистий кабінет</p>
 
-  <form class="auth-form" [formGroup]="signInForm" (ngSubmit)="login()">
-    <label for="sign-in-email" class="auth-sm-medium">Електрон пош</label>
-    <input [formControlName]="signInFormKeys.username"
-           type="email"
-           id="sign-in-email"
-           placeholder="Введіть електронну пошту"
-           class="auth-input-container email-input"
-    />
-    <label for="password" class="auth-sm-medium">Пароль</label>
-    <input [formControlName]="signInFormKeys.password"
-           type="password"
-           id="password"
-           placeholder="Пароль"
-           class="auth-input-container password-input"
-    />
-    <div class="auth-options">
-      <label class="auth-checkbox-label">
-        <input type="checkbox" class="auth-deep-blue-sm-medium auth-remember-checkbox" />
-        Запам’ятати
-      </label>
-      <a href="#" [routerLink]="['/', 'forgot-password']"
+  <form class="auth-form rtsee-form" [formGroup]="signInForm" (ngSubmit)="login()">
+    <div class="rtsee-form-field-container">
+      <p-inputgroup >
+        <p-floatlabel variant="on">
+          <input id="user-email"
+                 pInputText
+                 [formControl]="usernameField"
+          />
+          <label for="user-email">Email</label>
+        </p-floatlabel>
+      </p-inputgroup>
+      @if (!usernameField.valid && usernameField.touched) {
+        <p-message class="rtsee-form-field-error-message"
+                   severity="error"
+                   variant="simple"
+                   size="small"
+        >Email is invalid</p-message>
+      }
+    </div>
+    <div class="rtsee-form-field-container">
+      <p-inputgroup>
+        <p-floatlabel variant="on">
+          <p-password id="user-password"
+                      [formControl]="passwordField"
+                      [feedback]="false"
+          />
+          <label for="user-password">Password</label>
+        </p-floatlabel>
+      </p-inputgroup>
+
+      @if (!passwordField.valid && passwordField.touched) {
+        <p-message class="rtsee-form-field-error-message"
+                   severity="error"
+                   variant="simple"
+                   size="small"
+        >Password is required</p-message>
+      }
+      @if (serverSideError) {
+        <p-message class="rtsee-form-field-error-message"
+                   severity="error"
+                   variant="simple"
+                   size="small"
+        >{{serverSideError}}</p-message>
+      }
+    </div>
+    <div class="rtsee-form-field-container">
+      <p-checkbox inputId="remember" [binary]="true" [formControl]="rememberField" />
+      <label for="remember" class="ml-2"> Remember me </label>
+    </div>
+    <div class="rtsee-form-field-container">
+      <a href="#"
+         [routerLink]="authConfiguration.getRoutePathSplit(AuthEndpointsKeys.FORGOT_PASSWORD)"
          class="auth-deep-blue-sm-medium"
       >Забули пароль?</a>
     </div>
-
-    <button type="submit" class="auth-btn-container">Увійти</button>
+    <div class="rtsee-form-submit-container">
+      <p-button type="submit"
+                label="Sign In"
+                [disabled]="loadInProgress"
+      />
+      @if (loadInProgress) {
+        <p-progress-spinner class="rtsee-progress-spinner rtsee-progress-spinner-sm"></p-progress-spinner>
+      }
+    </div>
   </form>
-  <p class="auth-media-blue-gray-sm-normal">
+  <p class="rtsee-form-label">
     <span>Немає акаунту?</span>
     <span>&nbsp;</span>
     <a href="#"
-       [routerLink]="['/', 'sign-up']"
+       [routerLink]="authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_UP)"
        class="auth-deep-blue-sm-medium"
     >Створіть!</a>
   </p>

package/projects/ngx/src/lib/components/rtsee-auth/sign-in/sign-in.component.ts

@@ -1,9 +1,19 @@
 import { Component } from '@angular/core';
-import {Router, RouterLink} from '@angular/router';
-import {FormBuilder, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
-import { UtilsService } from '../services/utils.service';
+import { Router, RouterLink } from '@angular/router';
+import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { SignInForm, TypedReactiveForm } from '../types/auth-form.type';
-import {NgOptimizedImage} from "@angular/common";
+import { NgOptimizedImage } from '@angular/common';
+import { RTSeeAuthService } from '../services/auth.service';
+import { AuthEndpointsKeys, RTSeeAuthConfiguration } from '@rtsee/auth';
+import { ButtonModule } from 'primeng/button';
+import { InputGroup } from 'primeng/inputgroup';
+import { InputText } from 'primeng/inputtext';
+import { Password } from 'primeng/password';
+import { FloatLabel } from 'primeng/floatlabel';
+import { Checkbox } from 'primeng/checkbox';
+import { Message } from 'primeng/message';
+import { ProgressSpinner } from 'primeng/progressspinner';
+import {ServerSideError} from "../../../common/interfaces";
 
 @Component({
   selector: 'rtsee-sign-in',
@@ -11,34 +21,100 @@ import {NgOptimizedImage} from "@angular/common";
   imports: [
     NgOptimizedImage,
     ReactiveFormsModule,
-    RouterLink
+    RouterLink,
+    ButtonModule,
+    InputGroup,
+    InputText,
+    Password,
+    FloatLabel,
+    Checkbox,
+    Message,
+    ProgressSpinner
   ],
   standalone: true
 })
 export class SignInComponent {
-  public readonly signInForm: FormGroup<TypedReactiveForm<SignInForm>>
-  public readonly signInFormKeys: Record<keyof SignInForm, string>;
+  public readonly signInForm: FormGroup<TypedReactiveForm<SignInForm>> = this.formBuilder.group<TypedReactiveForm<SignInForm>>({
+    username: this.formBuilder.nonNullable.control({
+      value: '',
+      disabled: false
+    },
+    {
+      validators: [ Validators.required, Validators.email ]
+    }),
+    password: this.formBuilder.nonNullable.control({
+      value: '',
+      disabled: false
+    }, { validators: [ Validators.required ]}),
+    remember: this.formBuilder.nonNullable.control(false),
+  });
+  public readonly authConfiguration: RTSeeAuthConfiguration;
+  protected readonly AuthEndpointsKeys = AuthEndpointsKeys;
+  public loadInProgress: boolean = false;
+  public serverSideError: string = '';
 
   constructor(
     private readonly formBuilder: FormBuilder,
-    private readonly router: Router
+    private readonly router: Router,
+    public authService: RTSeeAuthService
   ) {
-    this.signInForm = this.formBuilder.group<TypedReactiveForm<SignInForm>>({
-      username: this.formBuilder.control(null, {validators: [Validators.required, Validators.email]}),
-      password: this.formBuilder.control(null, {validators: [Validators.required]}),
-      remember: this.formBuilder.control(false, {nonNullable: true})
-    });
-    this.signInFormKeys = UtilsService.getKeysAsValueObject(this.signInForm.getRawValue());
+    this.authConfiguration = this.authService.rtseeAuth.authConfiguration;
+  }
+
+  get usernameField(): FormControl<string> {
+    return this.signInForm.get('username') as FormControl<string>;
+  }
+
+  get passwordField(): FormControl<string> {
+    return this.signInForm.get('password') as FormControl<string>;
+  }
+
+  get rememberField(): FormControl<boolean> {
+    return this.signInForm.get('remember') as FormControl<boolean>;
   }
 
   public login(): void {
     if (this.signInForm.valid) {
-      // this.authService.signIn(this.signInForm.getRawValue())
-      //   .subscribe((success) => {
-      //     if (success) {
-      //       this.router.navigate(['/']);
-      //     }
-      //   });
+      this.disableFormFields();
+      this.authService.signIn(this.signInForm.getRawValue())
+        .subscribe({
+          next: (() => {
+            void this.router.navigate(this.authService.rtseeAuth.authConfiguration.defaultPostLoginRoute);
+            this.enableFormFields();
+          }),
+          error: ((error: ServerSideError) => {
+            console.log(error);
+            this.showServerSideErrorForXSeconds(error.error.message);
+            this.enableFormFields();
+          }),
+          complete: (() => {
+            this.enableFormFields();
+          })
+        });
+    } else {
+      this.signInForm.markAsTouched(); // this does not work after switching to "nonNullable" form fields
     }
   }
+
+  private showServerSideErrorForXSeconds(message: string, x: number = 3): void {
+    this.serverSideError = message;
+
+    setTimeout(() => {
+      this.serverSideError = '';
+    }, x * 1000); // we can do pop-up message instead
+  }
+
+  private disableFormFields(): void {
+    this.loadInProgress = true;
+    this.usernameField.disable();
+    this.passwordField.disable();
+    this.rememberField.disable();
+  }
+
+  private enableFormFields(): void {
+    this.loadInProgress = false;
+    this.usernameField.enable(); // fuck me, but [disabled]="loadInProgress" on the field no longer works :(
+    this.passwordField.enable();
+    this.rememberField.enable();
+  }
 }

package/projects/ngx/src/lib/components/rtsee-auth/sign-up/sign-up.component.html

@@ -46,6 +46,6 @@
 
   <!-- Redirect to Sign-In -->
   <p class="auth-media-blue-gray-sm-normal">
-    Вже маєте акаунт? <a href="#" [routerLink]="['/', 'sign-in']" class="auth-deep-blue-sm-medium">Увійдіть</a>
+    Вже маєте акаунт? <a href="#" [routerLink]="authConfiguration.getRoutePathSplit(AuthEndpointsKeys.SIGN_IN)" class="auth-deep-blue-sm-medium">Увійдіть</a>
   </p>
 </div>

package/projects/ngx/src/lib/components/rtsee-auth/sign-up/sign-up.component.ts

@@ -5,6 +5,8 @@ import { UtilsService } from '../services/utils.service';
 import {ConfirmPasswordValidator} from "../validators/form-fields-validators";
 import {RouterLink} from "@angular/router";
 import {NgOptimizedImage} from "@angular/common";
+import {RTSeeAuthService} from "../services/auth.service";
+import {RTSeeAuthConfiguration, AuthEndpointsKeys} from "@rtsee/auth";
 
 @Component({
   selector: 'rtsee-sign-up',
@@ -19,9 +21,11 @@ import {NgOptimizedImage} from "@angular/common";
 export class SignUpComponent {
   public readonly signUpForm: FormGroup<TypedReactiveForm<SignUpForm>>;
   public readonly signUpFormKeys: Record<keyof SignUpForm, string>;
+  public readonly authConfiguration: RTSeeAuthConfiguration;
 
   constructor(
-    private readonly formBuilder: FormBuilder
+    private readonly formBuilder: FormBuilder,
+    private authService: RTSeeAuthService
   ) {
     this.signUpForm = this.formBuilder.group<TypedReactiveForm<SignUpForm>>({
       email: this.formBuilder.control('', { validators: [Validators.required, Validators.email] }),
@@ -37,15 +41,27 @@ export class SignUpComponent {
       }),
     }, { validators: [ ConfirmPasswordValidator.MatchFields ] });
     this.signUpFormKeys = UtilsService.getKeysAsValueObject(this.signUpForm.getRawValue());
+    this.authConfiguration = this.authService.rtseeAuth.authConfiguration;
   }
 
   public signUp(): void {
     if (this.signUpForm.valid) {
-      const formValue = this.signUpForm.getRawValue();
+      const formValues: SignUpForm = this.signUpForm.getRawValue();
+
+
+
+      this.authService.signUp({
+        email: formValues.email!,
+        password: formValues.password!,
+        terms: formValues.terms!
+      })
+
 
 
       // Call sign-up API
       // this.authService.signUp(formValue);
     }
   }
+
+  protected readonly AuthEndpointsKeys = AuthEndpointsKeys;
 }

package/projects/ngx/src/lib/components/rtsee-auth/types/auth-form.type.ts

@@ -26,11 +26,11 @@ export type ConfirmPasswordForm = {
 };
 
 export type ForgotPasswordForm = {
-  email: string | null;
+  email: string;
 };
 
 export type SignInForm = {
-  username: string | null;
-  password: string | null;
+  username: string;
+  password: string;
   remember: boolean;
 };