Pull request #95: RED-948: Update UI on delete rule set (and some checks in other places)

Merge in RED/ui from RED-948 to master

* commit '0afa1b1419d85b40c1900d14898178286a77c491':
  Update UI on delete rule set (and some checks in other places)

apps/red-ui/src/app/components/admin-page-header/admin-breadcrumbs.component.html

@@ -5,7 +5,7 @@
         [routerLinkActiveOptions]="{ exact: true }"
         routerLinkActive="active"
         translate="project-templates"
-        *ngIf="root || !!appStateService.activeRuleSetId"
+        *ngIf="root || !!appStateService.activeRuleSet"
     ></a>
 
     <a
@@ -17,7 +17,7 @@
         *ngIf="root && userPreferenceService.areDevFeaturesEnabled"
     ></a>
 
-    <ng-container *ngIf="appStateService.activeRuleSetId">
+    <ng-container *ngIf="appStateService.activeRuleSet">
         <mat-icon svgIcon="red:arrow-right"></mat-icon>
         <a
             class="breadcrumb ml-0"
@@ -28,7 +28,7 @@
         </a>
     </ng-container>
 
-    <ng-container *ngIf="appStateService.activeDictionaryType">
+    <ng-container *ngIf="appStateService.activeDictionary">
         <mat-icon svgIcon="red:arrow-right"></mat-icon>
         <a
             class="breadcrumb ml-0"

apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts

@@ -3,6 +3,7 @@ import { DialogService } from '../../dialogs/dialog.service';
 import { PermissionsService } from '../../common/service/permissions.service';
 import { RuleSetModel } from '@redaction/red-ui-http';
 import { AppStateService } from '../../state/app-state.service';
+import { Router } from '@angular/router';
 
 @Component({
     selector: 'redaction-rule-set-actions',
@@ -16,6 +17,7 @@ export class RuleSetActionsComponent implements OnInit {
     constructor(
         private readonly _dialogService: DialogService,
         private readonly _appStateService: AppStateService,
+        private readonly _router: Router,
         public readonly permissionsService: PermissionsService
     ) {
         if (!this.ruleSet) {
@@ -36,6 +38,9 @@ export class RuleSetActionsComponent implements OnInit {
 
     openDeleteRuleSetDialog($event: any, ruleSet: RuleSetModel) {
         this._dialogService.openDeleteRuleSetDialog($event, ruleSet, async () => {
+            await this._appStateService.loadAllRuleSets();
+            await this._appStateService.loadDictionaryData();
+            await this._router.navigate(['ui', 'admin']);
             this.loadRuleSetsData.emit();
         });
     }

apps/red-ui/src/app/dialogs/dialog.service.ts

@@ -57,17 +57,15 @@ export class DialogService {
             })
         });
 
-        ref.afterClosed().subscribe((result) => {
+        ref.afterClosed().subscribe(async (result) => {
             if (result) {
-                const deleteFilesPromise = this._fileManagementControllerService.deleteFiles(fileIds, projectId).toPromise();
+                try {
-                deleteFilesPromise
+                    await this._fileManagementControllerService.deleteFiles(fileIds, projectId).toPromise();
-                    .then(async () => {
                     await this._appStateService.reloadActiveProjectFiles();
                     if (cb) cb();
-                    })
+                } catch (e) {
-                    .catch(() => {
                     this._notificationService.showToastNotification(this._translateService.instant('delete-files-error'), null, NotificationType.ERROR);
-                    });
+                }
             }
         });
 
@@ -190,8 +188,7 @@ export class DialogService {
         ref.afterClosed().subscribe(async (result) => {
             if (result) {
                 await this._ruleSetControllerService.getAllRuleSets(ruleSet.ruleSetId).toPromise();
-                await this._appStateService.loadAllRuleSets();
+                if (cb) await cb();
-                if (cb) cb();
             }
         });
         return ref;

apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts

@@ -56,6 +56,7 @@ export class AddEditRuleSetDialogComponent {
         };
         await this._ruleSetController.createOrUpdateRuleSet(ruleSet).toPromise();
         await this._appStateService.loadAllRuleSets();
+        await this._appStateService.loadDictionaryData();
         this.dialogRef.close({ ruleSet });
     }
 }

apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html

@@ -1,4 +1,4 @@
-<section>
+<section *ngIf="appStateService.activeFile">
     <div class="page-header">
         <div class="flex-1">
             <div

apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts

@@ -522,17 +522,16 @@ export class FilePreviewScreenComponent implements OnInit, OnDestroy {
         switch (action) {
             case 'delete':
                 await this._router.navigate([`/ui/projects/${this.projectId}`]);
-                break;
+                return;
 
             case 'reanalyse':
                 this.viewReady = false;
                 this.loadingMessage = 'file-preview.reanalyse-file';
-                break;
-        }
-
                 await this._loadFileData().toPromise();
                 this._updateCanPerformActions();
                 await this.appStateService.reloadActiveProjectFiles();
+                return;
+        }
     }
 
     get displayData() {

apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html

@@ -1,4 +1,5 @@
-<div class="collapsed-wrapper mt-8">
+<ng-container *ngIf="appStateService.activeProject"
+    ><div class="collapsed-wrapper mt-8">
         <redaction-circle-button
             (action)="toggleCollapse.emit()"
             icon="red:expand"
@@ -71,7 +72,9 @@
         <div>
             <mat-icon svgIcon="red:calendar"></mat-icon>
             <span
-            >{{ 'project-overview.project-details.stats.created-on' | translate: { date: appStateService.activeProject.project.date | date: 'd MMM. yyyy' } }}
+                >{{
+                    'project-overview.project-details.stats.created-on' | translate: { date: appStateService.activeProject.project.date | date: 'd MMM. yyyy' }
+                }}
             </span>
         </div>
         <div *ngIf="appStateService.activeProject.project.dueDate">
@@ -90,3 +93,4 @@
         <div class="heading" translate="project-overview.project-details.description"></div>
         <div class="mt-8">{{ appStateService.activeProject.project.description }}</div>
     </div>
+</ng-container>

apps/red-ui/src/app/state/app-state.service.ts

@@ -146,7 +146,7 @@ export class AppStateService {
     }
 
     get activeDictionary(): TypeValue {
-        return this.dictionaryData[this.activeRuleSetId][this.activeDictionaryType];
+        return this.activeRuleSetId && this.dictionaryData[this.activeRuleSetId] ? this.dictionaryData[this.activeRuleSetId][this.activeDictionaryType] : null;
     }
 
     getDictionaryTypeValue(key: string, ruleSetId?: string) {
@@ -228,6 +228,7 @@ export class AppStateService {
     }
 
     async reloadActiveFile() {
+        if (!this.activeFile) return null;
         const oldProcessedDate = this.activeFile.lastProcessed;
         const activeFile = await this._statusControllerService.getFileStatus(this.activeProjectId, this.activeFileId).toPromise();
 

apps/red-ui/src/app/upload-download/upload-status-overlay/upload-status-overlay.component.html

@@ -1,6 +1,8 @@
 <section class="red-upload-download-overlay mat-elevation-z4">
     <div (click)="collapsed = !collapsed" class="red-upload-download-header">
-        <div class="title" translate="upload-status.dialog.title"></div>
+        <div class="title">
+            {{ 'upload-status.dialog.title' | translate: { len: uploadService.files.length } }}
+        </div>
         <div *ngIf="!collapsed" class="collapse-icon">
             <mat-icon svgIcon="red:arrow-down"></mat-icon>
         </div>

apps/red-ui/src/assets/i18n/en.json

@@ -14,7 +14,7 @@
             "generic": "Failed to upload file... "
         },
         "dialog": {
-            "title": "File Upload",
+            "title": "File Uploads ({{len}})",
             "actions": {
                 "re-upload": "Retry Upload",
                 "cancel": "Cancel Upload"