@igniteui/angular-templates 21.1.1492 → 21.1.14100-alpha.1

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/{app.module.ts → app-module.ts}

@@ -1,19 +1,19 @@
-import { NgModule } from '@angular/core';
+import { NgModule, provideBrowserGlobalErrorListeners, provideZoneChangeDetection } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { BrowserModule, HammerModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import {
   IgxLayoutModule, IgxNavbarModule, IgxNavigationDrawerModule, IgxRippleModule
 } from 'igniteui-angular';
-import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
+import { AppRoutingModule } from './app-routing-module';
+import { App } from './app';
 import { AuthenticationModule, ExternalAuthService } from './authentication';
-import { HomeComponent } from './home/home.component';
+import { Home } from './home/home';
 
 @NgModule({
   declarations: [
-    AppComponent,
-    HomeComponent
+    App,
+    Home
   ],
   imports: [
     FormsModule,
@@ -28,8 +28,11 @@ import { HomeComponent } from './home/home.component';
     IgxLayoutModule,
     IgxRippleModule
   ],
-  providers: [],
-  bootstrap: [AppComponent]
+  providers: [
+    provideBrowserGlobalErrorListeners(),
+    provideZoneChangeDetection({ eventCoalescing: true })
+  ],
+  bootstrap: [App]
 })
 export class AppModule {
 

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/{app.component.spec.ts → app.spec.ts}

@@ -1,13 +1,13 @@
-import { TestBed, waitForAsync } from '@angular/core/testing';
+import { TestBed } from '@angular/core/testing';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterTestingModule } from '@angular/router/testing';
 import { IgxLayoutModule, IgxNavbarModule, IgxNavigationDrawerModule, IgxRippleModule } from 'igniteui-angular';
-import { AppComponent } from './app.component';
+import { App } from './app';
 import { AuthenticationModule } from './authentication';
 
-describe('AppComponent', () => {
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
+describe('App', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [
         NoopAnimationsModule,
         RouterTestingModule,
@@ -18,14 +18,14 @@ describe('AppComponent', () => {
         IgxRippleModule
       ],
       declarations: [
-        AppComponent
+        App
       ],
     }).compileComponents();
-  }));
+  });
 
-  it('should create the app', waitForAsync(() => {
-    const fixture = TestBed.createComponent(AppComponent);
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(App);
     const app = fixture.componentInstance;
     expect(app).toBeTruthy();
-  }));
+  });
 });

package/{igx-ts/projects/side-nav-auth/files/src/app/authentication/authentication.module.spec.ts → igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/authentication-module.spec.ts}

@@ -1,4 +1,4 @@
-import { AuthenticationModule } from './authentication.module';
+import { AuthenticationModule } from './authentication-module';
 
 describe('AuthenticationModule', () => {
   let authenticationModule: AuthenticationModule;

package/{igx-ts/projects/side-nav-auth/files/src/app/authentication/authentication.module.ts → igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/authentication-module.ts}

@@ -14,13 +14,13 @@ import {
   IgxToggleModule
 } from 'igniteui-angular';
 import { AuthGuard } from './auth.guard';
-import { AuthenticationRoutingModule } from './authentication-routing.module';
-import { LoginBarComponent } from './login-bar/login-bar.component';
-import { LoginDialogComponent } from './login-dialog/login-dialog.component';
-import { LoginComponent } from './login/login.component';
-import { ProfileComponent } from './profile/profile.component';
-import { RedirectComponent } from './redirect/redirect.component';
-import { RegisterComponent } from './register/register.component';
+import { AuthenticationRoutingModule } from './authentication-routing-module';
+import { LoginBar } from './login-bar/login-bar';
+import { LoginDialog } from './login-dialog/login-dialog';
+import { Login } from './login/login';
+import { Profile } from './profile/profile';
+import { Redirect } from './redirect/redirect';
+import { Register } from './register/register';
 import { BackendProvider } from './services/fake-backend.service';
 import { JwtInterceptor } from './services/jwt.interceptor';
 
@@ -41,12 +41,12 @@ import { JwtInterceptor } from './services/jwt.interceptor';
     IgxToggleModule
   ],
   declarations: [
-    LoginBarComponent,
-    LoginComponent,
-    LoginDialogComponent,
-    ProfileComponent,
-    RedirectComponent,
-    RegisterComponent
+    LoginBar,
+    Login,
+    LoginDialog,
+    Profile,
+    Redirect,
+    Register
   ],
   providers: [
     AuthGuard,
@@ -56,12 +56,12 @@ import { JwtInterceptor } from './services/jwt.interceptor';
     BackendProvider
   ],
   exports: [
-    LoginBarComponent,
-    LoginComponent,
-    RedirectComponent,
-    RegisterComponent,
-    LoginDialogComponent,
-    ProfileComponent
+    LoginBar,
+    Login,
+    Redirect,
+    Register,
+    LoginDialog,
+    Profile
   ]
 })
 export class AuthenticationModule { }

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/{authentication-routing.module.ts → authentication-routing-module.ts}

@@ -1,16 +1,16 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { AuthGuard } from './auth.guard';
-import { ProfileComponent } from './profile/profile.component';
-import { RedirectComponent } from './redirect/redirect.component';
+import { Profile } from './profile/profile';
+import { Redirect } from './redirect/redirect';
 import { ExternalAuthProvider } from './services/external-auth-configs';
 import { ExternalAuthRedirectUrl } from './services/external-auth.service';
 
 const authRoutes: Routes = [
-  { path: 'profile', component: ProfileComponent, canActivate: [AuthGuard] },
-  { path: ExternalAuthRedirectUrl.Google, component: RedirectComponent, data: { provider: ExternalAuthProvider.Google } },
-  { path: ExternalAuthRedirectUrl.Facebook, component: RedirectComponent, data: { provider: ExternalAuthProvider.Facebook } },
-  { path: ExternalAuthRedirectUrl.Microsoft, component: RedirectComponent, data: { provider: ExternalAuthProvider.Microsoft } }
+  { path: 'profile', component: Profile, canActivate: [AuthGuard] },
+  { path: ExternalAuthRedirectUrl.Google, component: Redirect, data: { provider: ExternalAuthProvider.Google } },
+  { path: ExternalAuthRedirectUrl.Facebook, component: Redirect, data: { provider: ExternalAuthProvider.Facebook } },
+  { path: ExternalAuthRedirectUrl.Microsoft, component: Redirect, data: { provider: ExternalAuthProvider.Microsoft } }
 ];
 
 @NgModule({

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/index.ts

@@ -1,8 +1,8 @@
 export * from './auth.guard';
-export * from './authentication-routing.module';
-export * from './authentication.module';
+export * from './authentication-routing-module';
+export * from './authentication-module';
 export * from './models/login';
-export * from './models/register';
+export * from './models/register-info';
 export * from './models/user';
 export * from './services/authentication.service';
 export * from './services/external-auth.service';

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login/{login.component.spec.ts → login.spec.ts}

@@ -1,5 +1,5 @@
 import { DebugElement } from '@angular/core';
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ReactiveFormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -10,23 +10,23 @@ import { AuthenticationService } from '../services/authentication.service';
 import { ExternalAuthProvider } from '../services/external-auth-configs';
 import { ExternalAuthService } from '../services/external-auth.service';
 import { UserService } from '../services/user.service';
-import { LoginComponent } from './login.component';
+import { Login } from './login';
 
 const MAIL_GROUP_NAME = 'email';
 const PASSWORD_GROUP_NAME = 'password';
 
-describe('LoginComponent', () => {
-  let component: LoginComponent;
-  let fixture: ComponentFixture<LoginComponent>;
+describe('Login', () => {
+  let component: Login;
+  let fixture: ComponentFixture<Login>;
   const extAuthSpy = jasmine.createSpyObj('ExternalAuthService', ['login', 'hasProvider']);
   const authSpy = jasmine.createSpyObj('AuthenticationService', ['login']);
   const userServSpy = jasmine.createSpyObj('UserService', ['setCurrentUser']);
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [ReactiveFormsModule, RouterTestingModule, NoopAnimationsModule,
         IgxInputGroupModule, IgxButtonModule, IgxIconModule, IgxRippleModule],
-      declarations: [LoginComponent],
+      declarations: [Login],
       providers: [
         { provide: ExternalAuthService, useValue: extAuthSpy },
         { provide: AuthenticationService, useValue: authSpy },
@@ -34,10 +34,10 @@ describe('LoginComponent', () => {
       ]
     })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(LoginComponent);
+    fixture = TestBed.createComponent(Login);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login/{login.component.ts → login.ts}

@@ -8,10 +8,10 @@ import { UserService } from '../services/user.service';
 
 @Component({
   selector: 'app-login',
-  templateUrl: './login.component.html',
-  styleUrls: ['./login.component.scss']
+  templateUrl: './login.html',
+  styleUrl: './login.scss'
 })
-export class LoginComponent {
+export class Login {
   public loginForm: FormGroup;
   @Output() public viewChange: EventEmitter<any> = new EventEmitter();
   @Output() public loggedIn: EventEmitter<any> = new EventEmitter();

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login-bar/{login-bar.component.spec.ts → login-bar.spec.ts}

@@ -1,5 +1,5 @@
 import { Component } from '@angular/core';
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { Router } from '@angular/router';
@@ -15,22 +15,22 @@ import {
   IgxRippleModule,
   IgxToggleModule
 } from 'igniteui-angular';
-import { LoginDialogComponent } from '../login-dialog/login-dialog.component';
+import { LoginDialog} from '../login-dialog/login-dialog';
 import { ExternalAuthService } from '../services/external-auth.service';
 import { UserService } from '../services/user.service';
-import { LoginBarComponent } from './login-bar.component';
+import { LoginBar } from './login-bar';
 
 @Component({
   selector: 'app-login-dialog',
   template: ''
 })
-class TestLoginDialogComponent extends LoginDialogComponent {
+class TestLoginDialog extends LoginDialog {
   open() { }
 }
 
-describe('LoginBarComponent', () => {
-  let component: LoginBarComponent;
-  let fixture: ComponentFixture<LoginBarComponent>;
+describe('LoginBar', () => {
+  let component: LoginBar;
+  let fixture: ComponentFixture<LoginBar>;
   class TestUserServSpy {
     logout() { }
     get currentUser() { return null; }
@@ -41,8 +41,8 @@ describe('LoginBarComponent', () => {
     logout() { }
   }
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [
         RouterTestingModule,
         NoopAnimationsModule,
@@ -55,17 +55,17 @@ describe('LoginBarComponent', () => {
         IgxRippleModule,
         IgxToggleModule
       ],
-      declarations: [LoginBarComponent, TestLoginDialogComponent],
+      declarations: [LoginBar, TestLoginDialog],
       providers: [
         { provide: UserService, useClass: TestUserServSpy },
         { provide: ExternalAuthService, useClass: TestAuthService }
       ]
     })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(LoginBarComponent);
+    fixture = TestBed.createComponent(LoginBar);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
@@ -92,7 +92,7 @@ describe('LoginBarComponent', () => {
 
   it('should open dialog on button click (not logged)', () => {
     // override ViewChild:
-    component.loginDialog = new TestLoginDialogComponent();
+    component.loginDialog = new TestLoginDialog();
 
     const button = fixture.debugElement.query(By.css('button'));
     spyOn(component.loginDialog, 'open');

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login-bar/{login-bar.component.ts → login-bar.ts}

@@ -1,19 +1,19 @@
 import { Component, ViewChild } from '@angular/core';
 import { Router } from '@angular/router';
 import { IgxDropDownComponent, ISelectionEventArgs } from 'igniteui-angular';
-import { LoginDialogComponent } from '../login-dialog/login-dialog.component';
+import { LoginDialog } from '../login-dialog/login-dialog';
 import { ExternalAuthService } from '../services/external-auth.service';
 import { UserService } from '../services/user.service';
 
 @Component({
   selector: 'app-login-bar',
-  templateUrl: './login-bar.component.html',
-  styleUrls: ['./login-bar.component.scss']
+  templateUrl: './login-bar.html',
+  styleUrl: './login-bar.scss'
 })
-export class LoginBarComponent {
+export class LoginBar {
 
-  @ViewChild(LoginDialogComponent, { static: true })
-  loginDialog!: LoginDialogComponent;
+  @ViewChild(LoginDialog, { static: true })
+  loginDialog!: LoginDialog;
 
   @ViewChild(IgxDropDownComponent, { static: true })
   igxDropDown!: IgxDropDownComponent;

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login-dialog/{login-dialog.component.spec.ts → login-dialog.spec.ts}

@@ -1,9 +1,9 @@
 import { Component, DebugElement, EventEmitter, Output } from '@angular/core';
-import { ComponentFixture, fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { IgxDialogModule } from 'igniteui-angular';
-import { LoginDialogComponent } from './login-dialog.component';
+import { LoginDialog } from './login-dialog';
 
 @Component({
   selector: 'app-login, app-register',
@@ -15,9 +15,9 @@ class TestSignViewComponent {
   @Output() public registered = new EventEmitter();
 }
 
-describe('LoginDialogComponent', () => {
-  let component: LoginDialogComponent;
-  let fixture: ComponentFixture<LoginDialogComponent>;
+describe('LoginDialog', () => {
+  let component: LoginDialog;
+  let fixture: ComponentFixture<LoginDialog>;
 
   const checkViews = (): { loginView: DebugElement, registerView: DebugElement } => {
     const loginView = fixture.debugElement.query(By.css('app-login'));
@@ -25,16 +25,16 @@ describe('LoginDialogComponent', () => {
     return { loginView, registerView };
   };
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [LoginDialogComponent, TestSignViewComponent],
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [LoginDialog, TestSignViewComponent],
       imports: [NoopAnimationsModule, IgxDialogModule]
     })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(LoginDialogComponent);
+    fixture = TestBed.createComponent(LoginDialog);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/login-dialog/{login-dialog.component.ts → login-dialog.ts}

@@ -3,10 +3,10 @@ import { IgxDialogComponent } from 'igniteui-angular';
 
 @Component({
   selector: 'app-login-dialog',
-  templateUrl: './login-dialog.component.html',
-  styleUrls: ['./login-dialog.component.scss']
+  templateUrl: './login-dialog.html',
+  styleUrl: './login-dialog.scss'
 })
-export class LoginDialogComponent {
+export class LoginDialog {
   public showLogin = true;
   public get title() { return this.showLogin ? 'Login' : 'Register'; }
   @ViewChild(IgxDialogComponent, { static: true })

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/models/{register.ts → register-info.ts}

@@ -1,4 +1,4 @@
-export interface Register {
+export interface RegisterInfo {
   given_name: string;
   family_name: string;
   email: string;

package/{igx-ts/projects/side-nav-auth/files/src/app/authentication/profile/profile.component.spec.ts → igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/profile/profile.spec.ts}

@@ -1,23 +1,23 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { UserService } from '../services/user.service';
-import { ProfileComponent } from './profile.component';
+import { Profile } from './profile';
 
 describe('ProfileComponent', () => {
-  let component: ProfileComponent;
-  let fixture: ComponentFixture<ProfileComponent>;
+  let component: Profile;
+  let fixture: ComponentFixture<Profile>;
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [ProfileComponent],
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [Profile],
       providers: [
         { provide: UserService, useValue: { currentUser: { name: 'test' } } }
       ]
     })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(ProfileComponent);
+    fixture = TestBed.createComponent(Profile);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/profile/{profile.component.ts → profile.ts}

@@ -3,9 +3,9 @@ import { UserService } from '../services/user.service';
 
 @Component({
   selector: 'app-profile',
-  templateUrl: './profile.component.html',
-  styleUrls: ['./profile.component.scss']
+  templateUrl: './profile.html',
+  styleUrl: './profile.scss'
 })
-export class ProfileComponent {
+export class Profile {
   constructor(public userService: UserService) { }
 }

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/redirect/{redirect.component.spec.ts → redirect.spec.ts}

@@ -1,22 +1,22 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ActivatedRoute, Router } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 import { AuthenticationService } from '../services/authentication.service';
 import { ExternalAuthService } from '../services/external-auth.service';
 import { UserService } from '../services/user.service';
-import { RedirectComponent } from './redirect.component';
+import { Redirect } from './redirect';
 
-describe('RedirectComponent', () => {
-  let fixture: ComponentFixture<RedirectComponent>;
+describe('Redirect', () => {
+  let fixture: ComponentFixture<Redirect>;
   const activeRouteSpy: any = { snapshot: { data: { value: { provider: {} } } } };
   const extAuthSpy = jasmine.createSpyObj('ExternalAuthService', ['getUserInfo']);
   const authSpy = jasmine.createSpyObj('AuthenticationService', ['loginWith']);
   const userServSpy = jasmine.createSpyObj('UserService', ['setCurrentUser']);
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [RouterTestingModule],
-      declarations: [RedirectComponent],
+      declarations: [Redirect],
       providers: [
         { provide: ActivatedRoute, useValue: activeRouteSpy },
         { provide: ExternalAuthService, useValue: extAuthSpy },
@@ -25,7 +25,7 @@ describe('RedirectComponent', () => {
       ]
     })
       .compileComponents();
-  }));
+  });
 
   it('should try external login on init', async () => {
     const router: Router = TestBed.inject(Router);
@@ -35,7 +35,7 @@ describe('RedirectComponent', () => {
       error: null,
       user: { name: 'TEST' }
     }));
-    fixture = TestBed.createComponent(RedirectComponent);
+    fixture = TestBed.createComponent(Redirect);
     fixture.detectChanges();
     await fixture.whenStable();
     expect(extAuthSpy.getUserInfo).toHaveBeenCalled();
@@ -52,7 +52,7 @@ describe('RedirectComponent', () => {
       error: 'Err'
     }));
     spyOn(window, 'alert');
-    fixture = TestBed.createComponent(RedirectComponent);
+    fixture = TestBed.createComponent(Redirect);
     fixture.detectChanges();
     await fixture.whenStable();
     expect(window.alert).toHaveBeenCalledWith('Err');

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/redirect/{redirect.component.ts → redirect.ts}

@@ -11,7 +11,7 @@ const routeData = 'value';
 @Component({
   template: '<p>Signing in...</p>'
 })
-export class RedirectComponent implements OnInit {
+export class Redirect implements OnInit {
   private provider: ExternalAuthProvider;
 
   constructor(

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/register/{register.component.spec.ts → register.spec.ts}

@@ -1,4 +1,4 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ReactiveFormsModule } from '@angular/forms';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { Router } from '@angular/router';
@@ -6,22 +6,22 @@ import { RouterTestingModule } from '@angular/router/testing';
 import { IgxButtonModule, IgxIconModule, IgxInputGroupModule, IgxRippleModule } from 'igniteui-angular';
 import { AuthenticationService } from '../services/authentication.service';
 import { UserService } from '../services/user.service';
-import { RegisterComponent } from './register.component';
+import { Register } from './register';
 
 const MAIL_GROUP_NAME = 'email';
 const PASSWORD_GROUP_NAME = 'password';
 const USERNAME_GROUP_NAME = 'given_name';
 const FAMILY_NAME_GROUP_NAME = 'family_name';
 
-describe('RegisterComponent', () => {
-  let component: RegisterComponent;
-  let fixture: ComponentFixture<RegisterComponent>;
+describe('Register', () => {
+  let component: Register;
+  let fixture: ComponentFixture<Register>;
   const authSpy = jasmine.createSpyObj('AuthenticationService', ['register']);
   const userServSpy = jasmine.createSpyObj('UserService', ['setCurrentUser']);
   const routerSpy = jasmine.createSpyObj('Router', ['navigate']);
 
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
       imports: [
         NoopAnimationsModule,
         ReactiveFormsModule,
@@ -31,7 +31,7 @@ describe('RegisterComponent', () => {
         IgxInputGroupModule,
         IgxRippleModule
       ],
-      declarations: [RegisterComponent],
+      declarations: [Register],
       providers: [
         { provide: AuthenticationService, useValue: authSpy },
         { provide: UserService, useValue: userServSpy },
@@ -39,10 +39,10 @@ describe('RegisterComponent', () => {
       ]
     })
       .compileComponents();
-  }));
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(RegisterComponent);
+    fixture = TestBed.createComponent(Register);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/register/{register.component.ts → register.ts}

@@ -1,16 +1,16 @@
 import { Component, EventEmitter, Output } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
-import { Register } from '../models/register';
+import { RegisterInfo } from '../models/register-info';
 import { AuthenticationService } from '../services/authentication.service';
 import { UserService } from '../services/user.service';
 
 @Component({
   selector: 'app-register',
-  templateUrl: './register.component.html',
-  styleUrls: ['./register.component.scss']
+  templateUrl: './register.html',
+  styleUrl: './register.scss'
 })
-export class RegisterComponent {
+export class Register {
 
   public registrationForm: FormGroup;
 
@@ -32,7 +32,7 @@ export class RegisterComponent {
   }
 
   async tryRegister() {
-    const response = await this.authentication.register(this.registrationForm.value as Register);
+    const response = await this.authentication.register(this.registrationForm.value as RegisterInfo);
     if (!response.error) {
       this.userService.setCurrentUser(response.user!);
       this.router.navigate(['/profile']);

package/igx-ts-legacy/projects/side-nav-auth/files/src/app/authentication/services/authentication.service.ts

@@ -1,7 +1,7 @@
 import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { ExternalLogin, Login } from '../models/login';
-import { Register } from '../models/register';
+import { RegisterInfo } from '../models/register-info';
 import { LoginResult, User } from '../models/user';
 import { parseUser } from './jwt-util';
 
@@ -24,7 +24,7 @@ export class AuthenticationService {
   }
 
   /** Send user info to register endpoint. */
-  public async register(userData: Register): Promise<LoginResult> {
+  public async register(userData: RegisterInfo): Promise<LoginResult> {
     return this.loginPost('/register', userData);
   }