Fix/global functional review fixes (#610)

* fix: prevent getting users when current auth is not functional * fix: for error pop up for 401 && 500 * fix: fix for pia table and guests tags * fix: for pia is example and I a simple user * fix: fix prod compilation * feat: add default message for no data to show * fix: show button on bottom of card * feat: add translate key to unauthorized dialog
LINCnil · Nov 16, 2021 · 11a6636 · 11a6636
1 parent 7a9e398
commit 11a6636
Show file tree

Hide file tree

Showing 16 changed files with 126 additions and 38 deletions.
diff --git a/src/app/modules/entries/cards/archive-card/archive-card.component.scss b/src/app/modules/entries/cards/archive-card/archive-card.component.scss
@@ -0,0 +1,5 @@
+.pia-cardsBlock-item-btn {
+  position: absolute;
+  bottom: 0;
+  width: 93%;
+}
diff --git a/src/app/modules/entries/cards/knowledgebase-card/knowledgebase-card.component.scss b/src/app/modules/entries/cards/knowledgebase-card/knowledgebase-card.component.scss
@@ -1,4 +1,4 @@
-@import '~src/assets/stylesheets/variables';
+@import "~src/assets/stylesheets/variables";
 .pia-cardsBlock-item.pia-doingBlock-item {
   input {
     &:focus,
@@ -19,3 +19,8 @@
     }
   }
 }
+.pia-cardsBlock-item-btn {
+  position: absolute;
+  bottom: 0;
+  width: 93%;
+}
diff --git a/src/app/modules/entries/cards/pia-card/pia-card.component.scss b/src/app/modules/entries/cards/pia-card/pia-card.component.scss
@@ -9,3 +9,8 @@
     }
   }
 }
+.pia-cardsBlock-item-btn {
+  position: absolute;
+  bottom: 0;
+  width: 93%;
+}
diff --git a/src/app/modules/entries/cards/structure-card/structure-card.component.scss b/src/app/modules/entries/cards/structure-card/structure-card.component.scss
@@ -0,0 +1,5 @@
+.pia-cardsBlock-item-btn {
+  position: absolute;
+  bottom: 0;
+  width: 93%;
+}
diff --git a/src/app/modules/entries/entries.component.html b/src/app/modules/entries/entries.component.html
@@ -261,7 +261,7 @@
     <!-- "Card" mode -->
     <div
       *ngIf="viewStyle.view === 'card'; else viewList"
-      class="small-12 medium-12 columns"
+      class="small-12 medium-12 columns pia-list"
     >
       <!-- New PIA -->
       <div
@@ -386,6 +386,9 @@
         <!-- PIA, ARCHIVE Cards switch -->
         <ng-container [ngSwitch]="type_entries">
           <ng-container *ngSwitchCase="'pia'">
+            <div *ngIf="entries.length <= 0 && !loading" class="no-pia">
+              {{ "homepage.no_entries.pia" | translate }}
+            </div>
             <app-pia-card
               *ngFor="
                 let pia of entries | filterForUser: searchText;
@@ -402,6 +405,9 @@
             </app-pia-card>
           </ng-container>
           <ng-container *ngSwitchCase="'archive'">
+            <div *ngIf="entries.length <= 0" class="no-pia">
+              {{ "homepage.no_entries.archive" | translate }}
+            </div>
             <app-archive-card
               *ngFor="
                 let archivedPia of entries | filterForUser: searchText;
@@ -545,6 +551,9 @@
             </tbody>
           </ng-template>
         </table>
+        <div *ngIf="entries.length <= 0 && !loading" class="entries-missing">
+          {{ "homepage.no_entries." + type_entries | translate }}
+        </div>
       </div>
     </ng-template>
   </div>

diff --git a/src/app/modules/entries/entries.component.scss b/src/app/modules/entries/entries.component.scss
@@ -343,23 +343,27 @@
 }
 
 // List PIA
-.pia-list-table {
-  position: relative;
-  border-collapse: collapse;
-  width: 100%;
-  max-width: 100%;
-  margin-bottom: 1rem;
-  border-bottom: 1px solid #d0d0d0;
-  thead {
-    background-color: $pia-dark-black;
-    color: $pia-white;
-    text-transform: uppercase;
-    font-size: 1.3rem;
-    text-align: left;
-    display: table-header-group;
-    vertical-align: middle;
-    tr {
-      display: table-row;
+.pia-list {
+  display: flex;
+  flex-wrap: wrap;
+  &-table {
+    position: relative;
+    border-collapse: collapse;
+    width: 100%;
+    max-width: 100%;
+    margin-bottom: 1rem;
+    border-bottom: 1px solid #d0d0d0;
+    thead {
+      background-color: $pia-dark-black;
+      color: $pia-white;
+      text-transform: uppercase;
+      font-size: 1.3rem;
+      text-align: left;
+      display: table-header-group;
+      vertical-align: middle;
+      tr {
+        display: table-row;
+      }
     }
   }
 }
@@ -380,6 +384,12 @@
   margin: auto;
 }
 
+.pia-cardsBlock-item-btn {
+  position: absolute !important;
+  bottom: 0 !important;
+  width: 93% !important;
+}
+
 /* UPDATE */
 .pia-mainContainerBlock {
   // default
@@ -463,17 +473,30 @@
   }
 }
 
-.entries-loading {
-  display: inline-block;
-  vertical-align: top;
-  &.entries-loading-card {
-    position: relative;
-    height: 500px;
-    width: calc(100% - 290px);
+.entries {
+  &-missing {
+    text-align: center;
   }
-  &.entries-loading-line {
-    position: absolute;
-    width: 100%;
-    height: 150px;
+  &-loading {
+    display: inline-block;
+    vertical-align: top;
+    &.entries-loading-card {
+      position: relative;
+      height: 500px;
+      width: calc(100% - 290px);
+    }
+    &.entries-loading-line {
+      position: absolute;
+      width: 100%;
+      height: 150px;
+    }
   }
 }
+
+// No Pia
+
+.no-pia {
+  flex: 1;
+  text-align: center;
+  align-self: center;
+}
diff --git a/src/app/modules/entries/entries.component.ts b/src/app/modules/entries/entries.component.ts
@@ -80,7 +80,10 @@ export class EntriesComponent implements OnInit, OnDestroy {
 
     this.authService.currentUser.subscribe({
       complete: () => {
-        if (this.authService.state) {
+        if (
+          this.authService.state &&
+          this.authService.currentUserValue.access_type.includes('functional')
+        ) {
           // GET USER LIST
           this.userService
             .getUsers()

diff --git a/src/app/modules/home/home.component.html b/src/app/modules/home/home.component.html
@@ -88,3 +88,4 @@ <h2 [innerHTML]="'authentication.subtitle1' | translate"></h2>
     </div>
   </div>
 </section>
+<app-dialog></app-dialog>
diff --git a/src/app/modules/pia/pia.component.ts b/src/app/modules/pia/pia.component.ts
@@ -186,7 +186,10 @@ export class PiaComponent implements OnInit, DoCheck {
         if (this.authService.state) {
           this.editMode = [];
           if (
-            this.authService.currentUserValue.access_type.includes('functional')
+            this.authService.currentUserValue.access_type.includes(
+              'functional'
+            ) ||
+            this.pia.is_example
           ) {
             this.editMode = ['author', 'validator', 'evaluator', 'guest'];
           } else {

diff --git a/src/app/services/answer-structure.service.ts b/src/app/services/answer-structure.service.ts
@@ -1,5 +1,4 @@
 import { Injectable } from '@angular/core';
-// import { Subject } from 'rxjs/Subject';
 import { Structure } from '../models/structure.model';
 import { StructureService } from './structure.service';
 

diff --git a/src/app/services/api.service.ts b/src/app/services/api.service.ts
@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
+import { DialogService } from 'src/app/services/dialog.service';
 
 @Injectable({ providedIn: 'root' })
 export class ApiService {
@@ -9,7 +10,10 @@ export class ApiService {
     mode: 'cors'
   };
 
-  constructor(private translateService: TranslateService) {
+  constructor(
+    private dialogService: DialogService,
+    private translateService: TranslateService
+  ) {
     this.base = localStorage.getItem('server_url')
       ? localStorage.getItem('server_url')
       : '';
@@ -41,6 +45,29 @@ export class ApiService {
         })
         .catch(err => {
           reject(err);
+          if (
+            (err.status === 401 || err.status === 500) &&
+            !err.url.includes('oauth/token/info')
+          ) {
+            this.dialogService.confirmThis(
+              {
+                text: 'authentification.errors.unauthorized',
+                type: 'yes',
+                yes: 'modals.back_to_home',
+                no: '',
+                icon: 'pia-icons pia-icon-sad',
+                data: {
+                  no_cross_button: true
+                }
+              },
+              () => {
+                window.location.href = './';
+              },
+              () => {
+                return;
+              }
+            );
+          }
         });
     });
   }

diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
@@ -6,7 +6,9 @@ import { ApiService } from './api.service';
 
 @Injectable()
 export class AuthService {
-  private currentUserSubject: BehaviorSubject<User>;
+  private currentUserSubject: BehaviorSubject<User> = new BehaviorSubject<User>(
+    null
+  );
   public currentUser: Observable<User>;
   public state: boolean;
 

diff --git a/src/app/services/global-evaluation.service.ts b/src/app/services/global-evaluation.service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@angular/core';
 import { Router } from '@angular/router';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { BehaviorSubject } from 'rxjs';
 import { Answer } from '../models/answer.model';
 import { Evaluation } from '../models/evaluation.model';
 import { Measure } from '../models/measure.model';

diff --git a/src/app/services/sid-status.service.ts b/src/app/services/sid-status.service.ts
@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Subject } from 'rxjs/Subject';
+import { Subject } from 'rxjs';
 
 import { GlobalEvaluationService } from './global-evaluation.service';
 import { ApiService } from './api.service';

diff --git a/src/styles.scss b/src/styles.scss
@@ -280,6 +280,7 @@ tag-input-form {
   padding: 0px;
   .custom-tag {
     padding: 0.08rem 0.45rem;
+    width: max-content;
     &.user-not-found {
       background-color: #a7a7a7;
     }

diff --git a/tslint.json b/tslint.json
@@ -14,7 +14,7 @@
       "severity": "warning"
     },
     "eofline": true,
-    "import-blacklist": [true, "rxjs/Rx"],
+    "import-blacklist": [true, "rxjs/Rx", "rxjs"],
     "import-spacing": true,
     "indent": {
       "options": ["spaces"]