Redacted view no longer available if data is out of sync

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

@@ -1,9 +1,24 @@
 <section [class.hidden]="!viewReady">
     <div class="page-header">
         <div class="flex-1">
-            <mat-slide-toggle [(ngModel)]="redactedView" color="primary" labelPosition="after">
+            <div
-                {{ 'file-preview.view-toggle' | translate }}
+                class="fit-content"
-            </mat-slide-toggle>
+                [matTooltip]="
+                    (canNotSwitchToRedactedView
+                        ? 'file-preview.cannot-show-redacted-view'
+                        : 'file-preview.show-redacted-view'
+                    ) | translate
+                "
+            >
+                <mat-slide-toggle
+                    [(ngModel)]="redactedView"
+                    color="primary"
+                    labelPosition="after"
+                    [disabled]="canNotSwitchToRedactedView"
+                >
+                    {{ 'file-preview.view-toggle' | translate }}
+                </mat-slide-toggle>
+            </div>
         </div>
 
         <div class="flex-1 filename page-title">

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

@@ -118,6 +118,13 @@ export class FilePreviewScreenComponent implements OnInit {
 
     canPerformAnnotationActions: boolean;
 
+    get canNotSwitchToRedactedView() {
+        return (
+            this.appStateService.fileNotUpToDateWithDictionary() ||
+            this.fileData?.entriesToAdd?.length > 0
+        );
+    }
+
     public ngOnInit(): void {
         this.canPerformAnnotationActions = this.appStateService.canPerformAnnotationActionsOnCurrentFile();
         this._loadFileData().subscribe(() => {});

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

@@ -247,6 +247,8 @@
         }
     },
     "file-preview": {
+        "show-redacted-view": "Show Redacted Preview",
+        "cannot-show-redacted-view": "Redactions out of sync. Redacted Preview only available after reanalysis",
         "reanalyse-file": "File reanalysis in progress... ",
         "view-toggle": "Redacted View",
         "tabs": {

apps/red-ui/src/assets/styles/red-page-layout.scss

@@ -198,3 +198,7 @@ body {
     height: calc(100vh - 61px);
     position: relative;
 }
+
+.fit-content {
+    width: fit-content;
+}