@onemrvapublic/design-system 1.0.0-beta.4 → 1.0.0-develop.1

package/layout/src/components/layout/layout.component.spec.ts

@@ -1,59 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { LayoutComponent } from './layout.component';
-import { TranslateModule } from '@ngx-translate/core';
-import { HarnessLoader } from '@angular/cdk/testing';
-import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { MatDrawerContainerHarness } from '@angular/material/sidenav/testing';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { RouterModule } from '@angular/router';
-import { MatTabsModule } from '@angular/material/tabs';
-
-describe('LayoutComponent', () => {
-  let component: LayoutComponent;
-  let fixture: ComponentFixture<LayoutComponent>;
-
-  let loader: HarnessLoader;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [
-        TranslateModule.forRoot(),
-        MatSidenavModule,
-        NoopAnimationsModule,
-        MatTabsModule,
-        RouterModule.forRoot([
-          { path: '', pathMatch: 'full', redirectTo: 'test' },
-        ]),
-      ],
-      declarations: [LayoutComponent],
-      schemas: [CUSTOM_ELEMENTS_SCHEMA],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LayoutComponent);
-    loader = TestbedHarnessEnvironment.loader(fixture);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('should have only one drawer container in the body', async () => {
-    const drawerContainer = await loader.getAllHarnesses(
-      MatDrawerContainerHarness,
-    );
-    expect(drawerContainer.length).toBe(1);
-  });
-
-  it('should have only one drawer container in the body', async () => {
-    // console.log(component)
-    const drawerContainer = await loader.getHarness(MatDrawerContainerHarness);
-    const x = await drawerContainer.host();
-    expect(await x.hasClass('example-container')).toBeTruthy();
-  });
-});

package/layout/src/components/layout/layout.component.ts

@@ -1,185 +0,0 @@
-import {
-  ChangeDetectorRef,
-  Component,
-  ContentChild,
-  ContentChildren,
-  Input,
-  AfterViewInit,
-  OnDestroy,
-  QueryList,
-  OnInit,
-  Inject,
-  isDevMode,
-  EventEmitter,
-  Output,
-  ViewChild,
-} from '@angular/core';
-import { LayoutRouteComponent } from '../layout-route/layout-route.component';
-import { TranslateService } from '@ngx-translate/core';
-import { LayoutContentComponent } from '../layout-content/layout-content.component';
-import { Subject, takeUntil } from 'rxjs';
-import { LayoutTitleComponent } from '../layout-title/layout-title.component';
-
-import { Environment } from '../../enums/environment.enum';
-import {
-  BreakpointObserver,
-  Breakpoints,
-  BreakpointState,
-} from '@angular/cdk/layout';
-import { DOCUMENT } from '@angular/common';
-import { LayoutFooterComponent } from '../layout-footer/layout-footer.component';
-import { OnemRvaProfile } from '../../models/onemrva-profile.model';
-import { LayoutLoginMenuComponent } from '../layout-login-menu/layout-login-menu.component';
-import { MatDrawer } from '@angular/material/sidenav';
-import { DrawerHostDirective } from '../../directives/drawer-host.directive';
-import { OnemrvaDrawerService } from '../../services/drawer.service';
-import { LayoutSidenavComponent } from '../layout-sidenav/layout-sidenav.component';
-import { LayoutAfterNavComponent } from '../layout-after-nav/layout-after-nav.component';
-import { OnemRvaLanguage } from '../../models/onem-language.model';
-
-@Component({
-  selector: 'onemrva-layout',
-  templateUrl: './layout.component.html',
-  styleUrls: ['./layout.component.scss'],
-})
-export class LayoutComponent implements OnInit, AfterViewInit, OnDestroy {
-  @ContentChildren(LayoutRouteComponent)
-  routes?: QueryList<LayoutRouteComponent>;
-
-  @ContentChild(LayoutTitleComponent) title?: LayoutTitleComponent;
-  @ContentChild(LayoutLoginMenuComponent) loginMenu?: LayoutLoginMenuComponent;
-  @ContentChild(LayoutContentComponent) content?: LayoutContentComponent;
-  @ContentChild(LayoutAfterNavComponent) afterNav?: LayoutAfterNavComponent;
-
-  @ContentChild(LayoutFooterComponent)
-  footer?: LayoutFooterComponent;
-
-  fluid: boolean = false;
-
-  @Input()
-  logo: string = ''; // custom logo, empty string will show default onem/rva/neo/lfa localised logo
-
-  @Input()
-  languages: OnemRvaLanguage[] = []; // list of languages
-
-  @Input()
-  environment?: Environment; // possible environment to show on the frontend LOCAL, TEST, VAL, PROD
-
-  @Input()
-  logoRedictionUrl?: string | any[] | null = ''; // value for routerLink from logo. "" by default. Deactivated when set to null
-
-  selectedIndex = 0;
-  destroyNotifier$: Subject<void> = new Subject();
-
-  @Input()
-  profile: OnemRvaProfile | null = null; // To be defined for application with authentication
-
-  @Output()
-  login: EventEmitter<void> = new EventEmitter<void>();
-
-  @Output()
-  logout: EventEmitter<void> = new EventEmitter<void>();
-  //    isLogoutUsed: boolean = false;
-
-  env = Environment;
-
-  isSmall = true;
-
-  @ViewChild(MatDrawer, { static: true }) drawer!: MatDrawer;
-  @ViewChild(DrawerHostDirective, { static: true })
-  drawerHost!: DrawerHostDirective;
-
-  @Input()
-  id: string = 'main';
-
-  @Input()
-  role: string = 'main';
-
-  constructor(
-    public translateService: TranslateService,
-    private cd: ChangeDetectorRef,
-    public breakpointObserver: BreakpointObserver,
-    @Inject(DOCUMENT) private document: Document,
-    public drawerService: OnemrvaDrawerService,
-  ) {
-    //      this.isLogoutUsed = this.logout.observers.length > 0;
-  }
-
-  ngOnInit() {
-    this.selectedIndex = this.languages.findIndex(
-      l => l.code === this.translateService.currentLang,
-    );
-
-    this.document.documentElement.lang = this.translateService.currentLang;
-
-    this.breakpointObserver
-      .observe([Breakpoints.XSmall, Breakpoints.Small])
-      .pipe(takeUntil(this.destroyNotifier$))
-      .subscribe((state: BreakpointState) => {
-        if (state.matches) {
-          this.isSmall = true;
-        } else {
-          this.drawerService.close();
-          this.isSmall = false;
-        }
-      });
-
-    if (this.logo === '') {
-      this.logo = `/assets/logo_${this.translateService.currentLang}.svg`;
-      console.log(this.logo);
-      this.translateService.onLangChange
-        .pipe(takeUntil(this.destroyNotifier$))
-        .subscribe(lang => {
-          this.logo = `/assets/logo_${lang.lang}.svg`;
-        });
-    }
-    this.translateService.onLangChange
-      .pipe(takeUntil(this.destroyNotifier$))
-      .subscribe(event => {
-        this.selectedIndex = this.languages.findIndex(
-          lang => lang.code === event.lang,
-        );
-      });
-
-    this.drawerService.host = this.drawerHost;
-    this.drawerService.drawer = this.drawer;
-  }
-
-  ngAfterViewInit() {
-    if (isDevMode()) {
-      this.cd.detectChanges();
-    }
-  }
-
-  ngOnDestroy(): void {
-    this.destroyNotifier$.next();
-    this.destroyNotifier$.complete();
-  }
-
-  doLogout() {
-    this.logout.next();
-  }
-
-  doLogin() {
-    this.login.next();
-  }
-
-  changeLanguage(index: number) {
-    const language = this.languages[index];
-    this.translateService.use(language.code);
-    this.document.documentElement.lang = language.code;
-  }
-
-  toggleSideNav() {
-    this.drawerHost.viewContainerRef.clear();
-    const componentRef = this.drawerHost.viewContainerRef.createComponent(
-      LayoutSidenavComponent,
-    );
-    componentRef.instance.isSmall = this.isSmall;
-    componentRef.instance.languages = this.languages;
-    componentRef.instance.routes = this.routes;
-    this.drawerService.hasBackdrop = false;
-
-    this.drawer.open();
-  }
-}

package/layout/src/components/layout-after-nav/layout-after-nav.component.spec.ts

@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LayoutAfterNavComponent } from './layout-after-nav.component';
-
-describe('LayoutContentComponent', () => {
-  let component: LayoutAfterNavComponent;
-  let fixture: ComponentFixture<LayoutAfterNavComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [LayoutAfterNavComponent],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LayoutAfterNavComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/layout/src/components/layout-after-nav/layout-after-nav.component.ts

@@ -1,24 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  Input,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-@Component({
-  selector: 'onemrva-layout-after-nav',
-  template: '<ng-template><ng-content></ng-content></ng-template>',
-})
-export class LayoutAfterNavComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-}

package/layout/src/components/layout-content/layout-content.component.spec.ts

@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LayoutContentComponent } from './layout-content.component';
-
-describe('LayoutContentComponent', () => {
-  let component: LayoutContentComponent;
-  let fixture: ComponentFixture<LayoutContentComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [LayoutContentComponent],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LayoutContentComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/layout/src/components/layout-content/layout-content.component.ts

@@ -1,24 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  Input,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-@Component({
-  selector: 'onemrva-layout-content',
-  template: '<ng-template><ng-content></ng-content></ng-template>',
-})
-export class LayoutContentComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-}

package/layout/src/components/layout-drawer-actions/layout-drawer-actions.component.html

@@ -1 +0,0 @@
-<ng-content></ng-content>

package/layout/src/components/layout-drawer-actions/layout-drawer-actions.component.ts

@@ -1,14 +0,0 @@
-import { Component } from '@angular/core';
-import { OnemrvaDrawerService } from '../../services/drawer.service';
-import { MatIcon } from '@angular/material/icon';
-
-@Component({
-  selector: 'onemrva-drawer-actions',
-  templateUrl: 'layout-drawer-actions.component.html',
-  styleUrls: ['layout-drawer-actions.component.scss'],
-  standalone: true,
-  imports: [MatIcon],
-})
-export class LayoutDrawerActionsComponent {
-  constructor(public drawerService: OnemrvaDrawerService) {}
-}

package/layout/src/components/layout-drawer-content/layout-drawer-content.component.html

@@ -1 +0,0 @@
-<span><ng-content></ng-content></span>

package/layout/src/components/layout-drawer-content/layout-drawer-content.component.ts

@@ -1,14 +0,0 @@
-import { Component } from '@angular/core';
-import { OnemrvaDrawerService } from '../../services/drawer.service';
-import { MatIcon } from '@angular/material/icon';
-
-@Component({
-  selector: 'onemrva-drawer-content',
-  templateUrl: 'layout-drawer-content.component.html',
-  styleUrls: ['layout-drawer-content.component.scss'],
-  standalone: true,
-  imports: [MatIcon],
-})
-export class LayoutDrawerContentComponent {
-  constructor(public drawerService: OnemrvaDrawerService) {}
-}

package/layout/src/components/layout-drawer-title/layout-drawer-title.component.html

@@ -1,7 +0,0 @@
-<span><ng-content></ng-content></span>
-<mat-icon
-  *ngIf="showClose"
-  class="close-drawer clickable"
-  (click)="drawerService.close()"
-  >close</mat-icon
->

package/layout/src/components/layout-drawer-title/layout-drawer-title.component.ts

@@ -1,18 +0,0 @@
-import { Component, Input } from '@angular/core';
-import { OnemrvaDrawerService } from '../../services/drawer.service';
-import { MatIcon } from '@angular/material/icon';
-import { NgIf } from '@angular/common';
-
-@Component({
-  selector: 'onemrva-drawer-title',
-  templateUrl: 'layout-drawer-title.component.html',
-  styleUrls: ['layout-drawer-title.component.scss'],
-  standalone: true,
-  imports: [MatIcon, NgIf],
-})
-export class LayoutDrawerTitleComponent {
-  @Input()
-  showClose: boolean = true;
-
-  constructor(public drawerService: OnemrvaDrawerService) {}
-}

package/layout/src/components/layout-footer/layout-footer.component.ts

@@ -1,11 +0,0 @@
-import { Component, TemplateRef, ViewChild } from '@angular/core';
-
-@Component({
-  selector: 'onemrva-layout-footer',
-  template: '<ng-template><ng-content></ng-content></ng-template>',
-})
-export class LayoutFooterComponent {
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-
-  constructor() {}
-}

package/layout/src/components/layout-login-menu/layout-login-menu.component.spec.ts

@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LayoutLoginMenuComponent } from './layout-login-menu.component';
-
-describe('LayoutLoginMenuComponent', () => {
-  let component: LayoutLoginMenuComponent;
-  let fixture: ComponentFixture<LayoutLoginMenuComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [LayoutLoginMenuComponent],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LayoutLoginMenuComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/layout/src/components/layout-login-menu/layout-login-menu.component.ts

@@ -1,24 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  Input,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-
-@Component({
-  selector: 'onemrva-layout-login-menu',
-  template: '<ng-template><ng-content></ng-content></ng-template>',
-})
-export class LayoutLoginMenuComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @ViewChild(TemplateRef) template?: TemplateRef<any>;
-
-  constructor(private cd: ChangeDetectorRef) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-}

package/layout/src/components/layout-route/layout-route.component.html

@@ -1,64 +0,0 @@
-<ng-template #navTpl>
-  <ng-container *ngIf="!hasSubroutes()">
-    <ng-container *ngTemplateOutlet="contentTmpl"></ng-container>
-  </ng-container>
-
-  <ng-container *ngIf="hasSubroutes()">
-    <span role="button" [matMenuTriggerFor]="menu">
-      {{ label }}
-    </span>
-    <mat-icon [matMenuTriggerFor]="menu" style="width: 16px"
-      >expand_more</mat-icon
-    >
-    <mat-menu #menu>
-      <ng-container *ngFor="let e of subroutes?.toArray(); let i = index">
-        <ng-container *ngIf="!e.hasSubroutes()">
-          <button
-            mat-menu-item
-            [routerLink]="e.routerLink"
-            routerLinkActive="active"
-          >
-            <ng-container *ngIf="e.template as routeTemplate">
-              <ng-container *ngTemplateOutlet="routeTemplate"></ng-container>
-            </ng-container>
-          </button>
-        </ng-container>
-        <ng-container *ngIf="e.hasSubroutes()">
-          <button
-            mat-menu-item
-            [matMenuTriggerFor]="submenu"
-            [ngClass]="{ active: e.hasActiveSubroute() }"
-          >
-            <ng-container *ngIf="e.template as routeTemplate">
-              <ng-container *ngTemplateOutlet="routeTemplate"></ng-container>
-            </ng-container>
-          </button>
-          <mat-menu #submenu>
-            <ng-container
-              *ngFor="let es of e.subroutes?.toArray(); let i = index"
-            >
-              <button
-                mat-menu-item
-                [routerLink]="es.routerLink"
-                routerLinkActive="active"
-              >
-                <ng-container *ngIf="es.template as routeTemplate">
-                  <ng-container *ngTemplateOutlet="routeTemplate">
-                  </ng-container>
-                </ng-container>
-              </button>
-            </ng-container>
-          </mat-menu>
-        </ng-container>
-      </ng-container>
-    </mat-menu>
-  </ng-container>
-</ng-template>
-
-<ng-template #navMblTpl>
-  <ng-container *ngTemplateOutlet="contentTmpl"></ng-container>
-</ng-template>
-
-<ng-template #contentTmpl>
-  <ng-content></ng-content>
-</ng-template>

package/layout/src/components/layout-route/layout-route.component.spec.ts

@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LayoutRouteComponent } from './layout-route.component';
-
-describe('LayoutRouteComponent', () => {
-  let component: LayoutRouteComponent;
-  let fixture: ComponentFixture<LayoutRouteComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [LayoutRouteComponent],
-    }).compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(LayoutRouteComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/layout/src/components/layout-route/layout-route.component.ts

@@ -1,57 +0,0 @@
-import {
-  AfterViewInit,
-  ChangeDetectorRef,
-  Component,
-  ContentChildren,
-  Input,
-  QueryList,
-  TemplateRef,
-  ViewChild,
-} from '@angular/core';
-import { Router, RouterLink } from '@angular/router';
-import { LayoutSubrouteComponent } from '../layout-subroute/layout-subroute.component';
-
-@Component({
-  selector: 'onemrva-layout-route',
-  templateUrl: 'layout-route.component.html',
-})
-export class LayoutRouteComponent implements AfterViewInit {
-  @Input() customNgClass: any;
-
-  @ViewChild('navTpl') template: TemplateRef<any> | null = null;
-  @ViewChild('navMblTpl') mobileTemplate: TemplateRef<any> | null = null;
-  @ViewChild('contentTpl') contentTemplate: TemplateRef<any> | null = null;
-
-  @Input() routerLink: typeof RouterLink.prototype.routerLink;
-  @Input() routerLinkActiveOptions?: any;
-  @Input() dataCy?: string;
-  @Input() baseRouteForActiveMenu?: string;
-  @Input() label?: string;
-
-  @ContentChildren(LayoutSubrouteComponent)
-  subroutes?: QueryList<LayoutSubrouteComponent>;
-
-  hasSubroutes() {
-    return this.subroutes !== undefined && this.subroutes.length > 0;
-  }
-
-  constructor(
-    private cd: ChangeDetectorRef,
-    private router: Router,
-  ) {}
-
-  ngAfterViewInit() {
-    this.cd.detectChanges();
-  }
-
-  isRouteActive() {
-    if (this.routerLink === null || this.routerLink === undefined) {
-      if (this.baseRouteForActiveMenu) {
-        const split_route = this.router.url.split('/');
-        const split_menu_route = this.baseRouteForActiveMenu.split('/');
-        return split_route[1] === split_menu_route[1];
-      }
-    }
-    return false;
-  }
-}