feat(exports): Added page for exports. (TV-862)

Squashed commit of the following:

commit ee293ecbc763a2e85c383ee628539fb1dbcab515
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Mon Nov 1 13:28:22 2021 +0100

    Moved exports below administration

commit 7dd8756cd031501c302981e51c8aa519092b121c
Merge: ef229931 bdc526ce
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Mon Nov 1 13:20:56 2021 +0100

    Merge branch 'develop' into feature/TV-862-export-page

commit ef229931d978646a864e1d952044e6d31f2adf82
Author: Erik Tiekstra <erik.tiekstra@arbetsformedlingen.se>
Date:   Fri Oct 29 11:59:06 2021 +0200

    Added exporter page including routing and feature-toggling

apps/mina-sidor-fa/src/app/app-routing.module.ts

@@ -63,6 +63,14 @@ activeFeatures.forEach(feature => {
         canActivate: [AuthGuard, OrganizationGuard, RoleGuard],
       });
       break;
+    case Feature.EXPORTS:
+      routes.push({
+        path: 'exporter',
+        data: { title: 'Exporter', expectedRoles: [RoleEnum.MSFA_ReceiveDeltagare] },
+        loadChildren: () => import('./pages/exports/exports.module').then(m => m.ExportsModule),
+        canActivate: [AuthGuard, OrganizationGuard, RoleGuard],
+      });
+      break;
     case Feature.MY_ACCOUNT:
       routes.push({
         path: 'mitt-konto',

apps/mina-sidor-fa/src/app/pages/exports/exports-routing.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { ExportsComponent } from './exports.component';
+
+const routes: Routes = [
+  { path: '', data: { title: 'Exporter' }, component: ExportsComponent },
+  {
+    path: 'deltagare',
+    data: { title: 'Skapa export för deltagare' },
+    loadChildren: () => import('./pages/deltagare-export/deltagare-export.module').then(m => m.DeltagareExportModule),
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class ExportsRoutingModule {}

apps/mina-sidor-fa/src/app/pages/exports/exports.component.html

@@ -0,0 +1,10 @@
+<msfa-layout>
+  <section class="exports">
+    <digi-typography>
+      <header class="exports__header">
+        <h1>Exporter</h1>
+      </header>
+      <main class="exports__contents"></main>
+    </digi-typography>
+  </section>
+</msfa-layout>

apps/mina-sidor-fa/src/app/pages/exports/exports.component.scss

@@ -0,0 +1,10 @@
+@import 'variables/gutters';
+
+.exports {
+  &__contents {
+    display: flex;
+    flex-direction: column;
+    gap: $digi--layout--gutter--l;
+    margin-top: $digi--layout--gutter--l;
+  }
+}

apps/mina-sidor-fa/src/app/pages/exports/exports.component.spec.ts

@@ -0,0 +1,30 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { ExportsComponent } from './exports.component';
+
+describe('ExportsComponent', () => {
+  let component: ExportsComponent;
+  let fixture: ComponentFixture<ExportsComponent>;
+
+  beforeEach(
+    waitForAsync(() => {
+      void TestBed.configureTestingModule({
+        schemas: [CUSTOM_ELEMENTS_SCHEMA],
+        declarations: [ExportsComponent],
+        imports: [HttpClientTestingModule, RouterTestingModule],
+      }).compileComponents();
+    })
+  );
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ExportsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/mina-sidor-fa/src/app/pages/exports/exports.component.ts

@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'msfa-exports',
+  templateUrl: './exports.component.html',
+  styleUrls: ['./exports.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ExportsComponent {}

apps/mina-sidor-fa/src/app/pages/exports/exports.module.ts

@@ -0,0 +1,12 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
+import { ExportsComponent } from './exports.component';
+
+@NgModule({
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  declarations: [ExportsComponent],
+  imports: [CommonModule, RouterModule.forChild([{ path: '', component: ExportsComponent }]), LayoutModule],
+})
+export class ExportsModule {}

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.html

@@ -0,0 +1,10 @@
+<msfa-layout>
+  <section class="deltagare-export">
+      <digi-typography>
+      <header class="deltagare-export__header">
+          <h1>Deltagare export</h1>
+      </header>
+      <main class="deltagare-export__contents"></main>
+    </digi-typography>
+    </section>
+</msfa-layout>

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.scss

@@ -0,0 +1,10 @@
+@import 'variables/gutters';
+
+.deltagare-export {
+  &__contents {
+    display: flex;
+    flex-direction: column;
+    gap: $digi--layout--gutter--l;
+    margin-top: $digi--layout--gutter--l;
+  }
+}

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.spec.ts

@@ -0,0 +1,30 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { DeltagareExportComponent } from './deltagare-export.component';
+
+describe('DeltagareExportComponent', () => {
+  let component: DeltagareExportComponent;
+  let fixture: ComponentFixture<DeltagareExportComponent>;
+
+  beforeEach(
+    waitForAsync(() => {
+      void TestBed.configureTestingModule({
+        schemas: [CUSTOM_ELEMENTS_SCHEMA],
+        declarations: [DeltagareExportComponent],
+        imports: [HttpClientTestingModule, RouterTestingModule],
+      }).compileComponents();
+    })
+  );
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(DeltagareExportComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.component.ts

@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'msfa-deltagare-export',
+  templateUrl: './deltagare-export.component.html',
+  styleUrls: ['./deltagare-export.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class DeltagareExportComponent {}

apps/mina-sidor-fa/src/app/pages/exports/pages/deltagare-export/deltagare-export.module.ts

@@ -0,0 +1,12 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
+import { DeltagareExportComponent } from './deltagare-export.component';
+
+@NgModule({
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  declarations: [DeltagareExportComponent],
+  imports: [CommonModule, RouterModule.forChild([{ path: '', component: DeltagareExportComponent }]), LayoutModule],
+})
+export class DeltagareExportModule {}

apps/mina-sidor-fa/src/app/shared/components/icon/icon.component.html

@@ -79,5 +79,6 @@
     <digi-icon-arrow-right *ngSwitchCase="iconType.ARROW_RIGHT" [ngClass]="iconClass"></digi-icon-arrow-right>
     <digi-icon-eye *ngSwitchCase="iconType.EYE" [ngClass]="iconClass"></digi-icon-eye>
     <digi-icon-eye-slash *ngSwitchCase="iconType.EYESLASH" [ngClass]="iconClass"></digi-icon-eye-slash>
+    <digi-icon-archive *ngSwitchCase="iconType.ARCHIVE" [ngClass]="iconClass"></digi-icon-archive>
   </ng-container>
 </ng-template>

apps/mina-sidor-fa/src/app/shared/components/layout/components/sidebar/sidebar.component.html

@@ -31,5 +31,12 @@
         Administration
       </a>
     </li>
+
+    <li class="sidebar__item" *ngIf="exportsVisible">
+      <a [routerLink]="['/exporter']" [routerLinkActive]="['sidebar__link--active']" class="sidebar__link">
+        <msfa-icon class="sidebar__icon" [icon]="iconType.ARCHIVE" size="xl"></msfa-icon>
+        Exporter
+      </a>
+    </li>
   </ul>
 </nav>

apps/mina-sidor-fa/src/app/shared/components/layout/components/sidebar/sidebar.component.ts

@@ -36,4 +36,10 @@ export class SidebarComponent {
       )
     );
   }
+  get exportsVisible(): boolean {
+    return (
+      this.activeFeatures.includes(Feature.EXPORTS) &&
+      this.userRoles?.some(role => role.type === RoleEnum.MSFA_ReceiveDeltagare)
+    );
+  }
 }

apps/mina-sidor-fa/src/app/shared/enums/feature.enum.ts

@@ -15,4 +15,5 @@ export enum Feature {
   REPORTING_SIGNAL,
   REPORTING_PERIODISK_REDOVISNING,
   REPORTING_INFORMATIV_RAPPORT,
+  EXPORTS,
 }

apps/mina-sidor-fa/src/app/shared/enums/icon-type.enum.ts

@@ -20,4 +20,5 @@ export enum IconType {
   ARROW_RIGHT = 'arrow-right',
   EYE = 'eye',
   EYESLASH = 'eyeslash',
+  ARCHIVE = 'archive',
 }

apps/mina-sidor-fa/src/environments/active-features.ts

@@ -26,4 +26,5 @@ export const ACTIVE_FEATURES_TEST: Feature[] = [
   Feature.VERSION_INFO,
   Feature.REPORTING_PERIODISK_REDOVISNING,
   Feature.REPORTING_INFORMATIV_RAPPORT,
+  Feature.EXPORTS,
 ];