Feature/339 my grades

src/app/app-routing.module.ts

@@ -57,6 +57,12 @@ const routes: Routes = [
     loadChildren: () =>
       import('./my-profile/my-profile.module').then((m) => m.MyProfileModule),
   },
+  {
+    path: 'my-grades',
+    canActivate: [AuthGuard],
+    loadChildren: () =>
+      import('./my-grades/my-grades.module').then((m) => m.MyGradesModule),
+  },
   {
     path: 'my-settings',
     canActivate: [AuthGuard],

src/app/evaluate-absences/components/evaluate-absences-list/evaluate-absences-list.component.spec.ts

@@ -50,7 +50,7 @@ describe('EvaluateAbsencesListComponent', () => {
               provide: StorageService,
               useValue: {
                 getPayload(): Option<object> {
-                  return { id_person: 42 };
+                  return { id_person: '42' };
                 },
               },
             },

src/app/home.component.spec.ts

@@ -39,6 +39,7 @@ describe('HomeComponent', () => {
       '/events',
       '/my-absences',
       '/my-profile',
+      '/my-grades',
       '/my-settings',
     ]);
   });

src/app/home.component.ts

@@ -25,6 +25,7 @@ export class HomeComponent {
     'events',
     'my-absences',
     'my-profile',
+    'my-grades',
     'my-settings',
   ];
 }

src/app/my-absences/components/my-absences-show/my-absences-show.component.html

@@ -4,7 +4,7 @@
     absenceCounts: myAbsencesService.counts$ | async
   } as data"
 >
-  <ngb-accordion ngb-accordion #acc="ngbAccordion">
+  <ngb-accordion #acc="ngbAccordion">
     <ngb-panel id="report-absence">
       <ng-template ngbPanelHeader>
         <erz-my-absences-report-link></erz-my-absences-report-link>

src/app/my-absences/components/my-absences-show/my-absences-show.component.spec.ts

@@ -32,7 +32,7 @@ describe('MyAbsencesShowComponent', () => {
               provide: StorageService,
               useValue: {
                 getPayload(): Option<object> {
-                  return { id_person: 42 };
+                  return { id_person: '42' };
                 },
               },
             },

src/app/my-absences/services/my-absences-report-state.service.spec.ts

@@ -16,7 +16,7 @@ describe('MyAbsencesReportStateService', () => {
             provide: StorageService,
             useValue: {
               getPayload(): Option<object> {
-                return { id_person: 42 };
+                return { id_person: '42' };
               },
             },
           },

src/app/my-absences/services/my-absences-report-state.service.ts

@@ -126,7 +126,7 @@ export class MyAbsencesReportStateService extends PaginatedEntriesService<
     if (id == null) {
       throw new Error('No student id available');
     }
-    return id;
+    return Number(id);
   }
 
   private loadTimetableEntries(

src/app/my-absences/services/my-absences.service.spec.ts

@@ -16,7 +16,7 @@ describe('MyAbsencesService', () => {
             provide: StorageService,
             useValue: {
               getPayload(): any {
-                return { id_person: 123 };
+                return { id_person: '123' };
               },
             },
           },

src/app/my-absences/services/my-absences.service.ts

@@ -61,9 +61,9 @@ export class MyAbsencesService {
     private storageService: StorageService,
     private studentsService: StudentsRestService
   ) {
-    const studentId = this.storageService.getPayload()?.id_person || null;
+    const studentId = this.storageService.getPayload()?.id_person;
     if (studentId) {
-      this.studentId$.next(studentId);
+      this.studentId$.next(Number(studentId));
     }
   }
 

src/app/my-grades/components/my-grades-header/my-grades-header.component.html

@@ -0,0 +1,12 @@
+<div class="d-flex justify-content-between header">
+  <div>{{ 'my-grades.header' | translate }}</div>
+  <div>
+    <a
+      [href]="myGradesService.testReportUrl$ | async"
+      class="report btn btn-primary"
+      target="_blank"
+    >
+      <i class="material-icons">description</i>
+    </a>
+  </div>
+</div>

src/app/my-grades/components/my-grades-header/my-grades-header.component.scss

@@ -0,0 +1,16 @@
+@import "../../../../bootstrap-variables";
+
+.header {
+  padding-left: $spacer;
+  padding-bottom: $spacer;
+}
+
+@media (max-width: 750px) {
+  .header {
+    padding-right: $spacer;
+  }
+}
+
+.report {
+  margin-left: $spacer;
+}

src/app/my-grades/components/my-grades-header/my-grades-header.component.spec.ts

@@ -0,0 +1,38 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyGradesHeaderComponent } from './my-grades-header.component';
+import { buildTestModuleMetadata } from '../../../../spec-helpers';
+import { MyGradesService } from '../../services/my-grades.service';
+import { of } from 'rxjs';
+
+describe('MyGradesHeaderComponent', () => {
+  let component: MyGradesHeaderComponent;
+  let fixture: ComponentFixture<MyGradesHeaderComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule(
+      buildTestModuleMetadata({
+        declarations: [MyGradesHeaderComponent],
+        providers: [
+          {
+            provide: MyGradesService,
+            useValue: {
+              studentId$: of(1),
+              studentCourses$: of([]),
+            },
+          },
+        ],
+      })
+    ).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyGradesHeaderComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my-grades/components/my-grades-header/my-grades-header.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+import { MyGradesService } from '../../services/my-grades.service';
+
+@Component({
+  selector: 'erz-my-grades-header',
+  templateUrl: './my-grades-header.component.html',
+  styleUrls: ['./my-grades-header.component.scss'],
+})
+export class MyGradesHeaderComponent {
+  constructor(public myGradesService: MyGradesService) {}
+}

src/app/my-grades/components/my-grades-show/my-grades-show.component.html

@@ -0,0 +1,24 @@
+<div
+  class="erz-container erz-container-limited erz-container-padding-y erz-container-padding-x-responsive"
+>
+  <ng-container
+    *erzLet="{
+      loading: myGradesService.loading$ | async,
+      studentId: myGradesService.studentId$ | async,
+      courses: myGradesService.studentCourses$ | async,
+      gradingScales: myGradesService.gradingScales$ | async
+    } as data"
+  >
+    <erz-my-grades-header></erz-my-grades-header>
+    <erz-dossier-grades-view
+      *ngIf="!data.loading"
+      [courses]="data.courses"
+      [studentId]="data.studentId"
+      [gradingScales]="data.gradingScales"
+      [isEditable]="false"
+    ></erz-dossier-grades-view>
+    <ng-container *ngIf="data.loading">
+      <erz-spinner></erz-spinner>
+    </ng-container>
+  </ng-container>
+</div>

src/app/my-grades/components/my-grades-show/my-grades-show.component.spec.ts

@@ -0,0 +1,44 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyGradesShowComponent } from './my-grades-show.component';
+import { CoursesRestService } from '../../../shared/services/courses-rest.service';
+import { StorageService } from '../../../shared/services/storage.service';
+import { buildTestModuleMetadata } from 'src/spec-helpers';
+import { MyGradesService } from '../../services/my-grades.service';
+import { of } from 'rxjs';
+
+describe('MyGradesShowComponent', () => {
+  let component: MyGradesShowComponent;
+  let fixture: ComponentFixture<MyGradesShowComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule(
+      buildTestModuleMetadata({
+        declarations: [MyGradesShowComponent],
+        providers: [
+          {
+            provide: MyGradesService,
+            useValue: {
+              studentId$: of(1),
+              studentCourses$: of([]),
+            },
+          },
+          {
+            provide: StorageService,
+            useValue: jasmine.createSpyObj('StorageService', ['getPayload']),
+          },
+        ],
+      })
+    ).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyGradesShowComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/my-grades/components/my-grades-show/my-grades-show.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { MyGradesService } from '../../services/my-grades.service';
+import { DossierGradesService } from '../../../shared/services/dossier-grades.service';
+
+@Component({
+  selector: 'erz-my-grades-show',
+  templateUrl: './my-grades-show.component.html',
+  styleUrls: ['./my-grades-show.component.scss'],
+  providers: [DossierGradesService],
+})
+export class MyGradesShowComponent {
+  constructor(public myGradesService: MyGradesService) {}
+}

src/app/my-grades/components/my-grades/my-grades.component.html

@@ -0,0 +1 @@
+<router-outlet></router-outlet>

src/app/my-grades/components/my-grades/my-grades.component.spec.ts

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

src/app/my-grades/components/my-grades/my-grades.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+import { MyGradesService } from '../../services/my-grades.service';
+
+@Component({
+  selector: 'erz-my-grades',
+  templateUrl: './my-grades.component.html',
+  styleUrls: ['./my-grades.component.scss'],
+  providers: [MyGradesService],
+})
+export class MyGradesComponent {
+  constructor() {}
+}

src/app/my-grades/my-grades-routing.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import { MyGradesComponent } from './components/my-grades/my-grades.component';
+import { MyGradesShowComponent } from './components/my-grades-show/my-grades-show.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: MyGradesComponent,
+    children: [{ path: '', component: MyGradesShowComponent }],
+  },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class MyGradesRoutingModule {}

src/app/my-grades/my-grades.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { MyGradesRoutingModule } from './my-grades-routing.module';
+import { MyGradesComponent } from './components/my-grades/my-grades.component';
+import { MyGradesShowComponent } from './components/my-grades-show/my-grades-show.component';
+import { SharedModule } from '../shared/shared.module';
+import { MyGradesHeaderComponent } from './components/my-grades-header/my-grades-header.component';
+
+@NgModule({
+  declarations: [
+    MyGradesComponent,
+    MyGradesShowComponent,
+    MyGradesHeaderComponent,
+  ],
+  imports: [CommonModule, MyGradesRoutingModule, SharedModule],
+})
+export class MyGradesModule {}