refactor(HeaderLinksComponent): Convert to standalone component (#1762)

WISE-Community · May 1, 2024 · 07d010f · 07d010f
1 parent f225a1f
commit 07d010f
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 23 deletions.
diff --git a/src/app/modules/header/header-links/header-links.component.spec.ts b/src/app/modules/header/header-links/header-links.component.spec.ts
@@ -1,17 +1,16 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { HeaderLinksComponent } from './header-links.component';
 import { User } from '../../../domain/user';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { provideRouter } from '@angular/router';
 
 describe('HeaderLinksComponent', () => {
   let component: HeaderLinksComponent;
   let fixture: ComponentFixture<HeaderLinksComponent>;
 
   beforeEach(() => {
     TestBed.configureTestingModule({
-      declarations: [HeaderLinksComponent],
-      imports: [],
-      schemas: [NO_ERRORS_SCHEMA]
+      imports: [HeaderLinksComponent],
+      providers: [provideRouter([])]
     });
     fixture = TestBed.createComponent(HeaderLinksComponent);
     component = fixture.componentInstance;

diff --git a/src/app/modules/header/header-links/header-links.component.ts b/src/app/modules/header/header-links/header-links.component.ts
@@ -1,24 +1,23 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, Input, SimpleChanges } from '@angular/core';
 import { User } from '../../../domain/user';
+import { CommonModule } from '@angular/common';
+import { HeaderSigninComponent } from '../header-signin/header-signin.component';
+import { MatButtonModule } from '@angular/material/button';
+import { FlexLayoutModule } from '@angular/flex-layout';
+
 @Component({
+  standalone: true,
   selector: 'app-header-links',
+  imports: [CommonModule, FlexLayoutModule, HeaderSigninComponent, MatButtonModule],
   templateUrl: './header-links.component.html',
-  styleUrls: ['./header-links.component.scss']
+  styleUrl: './header-links.component.scss'
 })
-export class HeaderLinksComponent implements OnInit {
-  @Input()
-  user: User;
-
-  @Input()
-  location: string;
-
-  roles: string[] = [];
-
-  constructor() {}
-
-  ngOnInit() {}
+export class HeaderLinksComponent {
+  @Input() location: string;
+  protected roles: string[] = [];
+  @Input() user: User;
 
-  ngOnChanges(changes) {
+  ngOnChanges(changes: SimpleChanges): void {
     if (changes.user) {
       let user = changes.user.currentValue;
       this.roles = user.roles ? user.roles : [];

diff --git a/src/app/modules/header/header.module.ts b/src/app/modules/header/header.module.ts
@@ -8,7 +8,6 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatToolbarModule } from '@angular/material/toolbar';
 import { HeaderComponent } from './header.component';
-import { HeaderSigninComponent } from './header-signin/header-signin.component';
 import { HeaderLinksComponent } from './header-links/header-links.component';
 import { HeaderAccountMenuComponent } from './header-account-menu/header-account-menu.component';
 import { ConfigService } from '../../services/config.service';
@@ -25,12 +24,12 @@ const materialModules = [
 @NgModule({
   imports: [
     CommonModule,
-    HeaderSigninComponent,
+    HeaderLinksComponent,
     FlexLayoutModule,
     AppRoutingModule,
     materialModules
   ],
-  declarations: [HeaderComponent, HeaderLinksComponent, HeaderAccountMenuComponent],
+  declarations: [HeaderComponent, HeaderAccountMenuComponent],
   providers: [ConfigService, UserService],
   exports: [HeaderComponent]
 })