diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
index 6c03e7761..72fcc37e2 100644
--- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
+++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
@@ -226,7 +226,10 @@
                                 </button>
                                 <button
                                     (click)="suggestRemoveAnnotation($event, annotation)"
-                                    *ngIf="annotation.superType !== 'request'"
+                                    *ngIf="
+                                        annotation.superType === 'redaction' ||
+                                        annotation.superType === 'hint'
+                                    "
                                     mat-icon-button
                                 >
                                     <mat-icon svgIcon="red:trash"></mat-icon>
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
index f9d378343..6e0f61a86 100644
--- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
+++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.ts
@@ -143,7 +143,7 @@ export class FilePreviewScreenComponent implements OnInit {
             )
         );
         const redactionLogAnnotations = this.fileData.redactionLog.redactionLogEntry.map((rde) =>
-            AnnotationWrapper.fromRedactionLog(rde, this.fileData.manualRedactions.comments)
+            AnnotationWrapper.fromRedactionLog(rde, this.fileData.manualRedactions)
         );
 
         this.annotations.splice(0, this.annotations.length);
@@ -308,6 +308,7 @@ export class FilePreviewScreenComponent implements OnInit {
                 $event,
                 annotation,
                 () => {
+                    annotation.superType = 'ignore';
                     this._cleanupAndRedrawManualAnnotations();
                 }
             );
diff --git a/apps/red-ui/src/app/screens/file/model/annotation.wrapper.ts b/apps/red-ui/src/app/screens/file/model/annotation.wrapper.ts
index 0f8225381..450861a9a 100644
--- a/apps/red-ui/src/app/screens/file/model/annotation.wrapper.ts
+++ b/apps/red-ui/src/app/screens/file/model/annotation.wrapper.ts
@@ -1,6 +1,7 @@
 import {
     Comment,
     ManualRedactionEntry,
+    ManualRedactions,
     Point,
     RedactionLogEntry,
     TypeValue
@@ -20,14 +21,20 @@ export class AnnotationWrapper {
 
     static fromRedactionLog(
         redactionLogEntry: RedactionLogEntry,
-        comments: { [key: string]: Array<Comment> }
+        manualRedactions: ManualRedactions
     ) {
+        const comments: { [key: string]: Array<Comment> } = manualRedactions.comments;
         const annotationWrapper = new AnnotationWrapper();
         annotationWrapper.superType = redactionLogEntry.redacted
             ? 'redaction'
             : redactionLogEntry.hint
             ? 'hint'
             : 'ignore';
+        annotationWrapper.superType = manualRedactions.idsToRemove.find(
+            (toRemove) => toRemove.id === redactionLogEntry.id
+        )
+            ? 'ignore'
+            : annotationWrapper.superType;
         annotationWrapper.dictionary = redactionLogEntry.type;
         annotationWrapper.firstTopLeftPoint = redactionLogEntry.positions[0]?.topLeft;
         annotationWrapper.pageNumber = redactionLogEntry.positions[0]?.page;
diff --git a/apps/red-ui/src/app/screens/file/service/manual-annotation.service.ts b/apps/red-ui/src/app/screens/file/service/manual-annotation.service.ts
index 5f6dce4fa..86eac3305 100644
--- a/apps/red-ui/src/app/screens/file/service/manual-annotation.service.ts
+++ b/apps/red-ui/src/app/screens/file/service/manual-annotation.service.ts
@@ -120,7 +120,7 @@ export class ManualAnnotationService {
                     {
                         annotationId: annotationWrapper.id,
                         removeFromDictionary: removeFromDictionary,
-                        comment: { text: 'Auto' }
+                        comment: 'Auto'
                     },
                     this._appStateService.activeProjectId,
                     this._appStateService.activeFileId
@@ -142,7 +142,7 @@ export class ManualAnnotationService {
                     {
                         annotationId: annotationWrapper.id,
                         removeFromDictionary: removeFromDictionary,
-                        comment: { text: 'Auto' }
+                        comment: 'Auto'
                     },
                     this._appStateService.activeProjectId,
                     this._appStateService.activeFileId
diff --git a/libs/red-ui-http/src/lib/api.module.ts b/libs/red-ui-http/src/lib/api.module.ts
index f228c4950..1255fb726 100644
--- a/libs/red-ui-http/src/lib/api.module.ts
+++ b/libs/red-ui-http/src/lib/api.module.ts
@@ -15,6 +15,7 @@ import { RulesControllerService } from './api/rulesController.service';
 import { StatusControllerService } from './api/statusController.service';
 import { UserControllerService } from './api/userController.service';
 import { VersionsControllerService } from './api/versionsController.service';
+import { ViewedPagesControllerService } from './api/viewedPagesController.service';
 
 @NgModule({
     imports: [],
@@ -33,7 +34,8 @@ import { VersionsControllerService } from './api/versionsController.service';
         RulesControllerService,
         UserControllerService,
         StatusControllerService,
-        VersionsControllerService
+        VersionsControllerService,
+        ViewedPagesControllerService
     ]
 })
 export class ApiModule {
diff --git a/libs/red-ui-http/src/lib/api/api.ts b/libs/red-ui-http/src/lib/api/api.ts
index e71946884..61ddce0c3 100644
--- a/libs/red-ui-http/src/lib/api/api.ts
+++ b/libs/red-ui-http/src/lib/api/api.ts
@@ -13,6 +13,7 @@ import { RedactionLogControllerService } from './redactionLogController.service'
 import { RulesControllerService } from './rulesController.service';
 import { StatusControllerService } from './statusController.service';
 import { UserControllerService } from './userController.service';
+import { ViewedPagesControllerService } from './viewedPagesController.service';
 
 export * from './dictionaryController.service';
 
@@ -38,6 +39,8 @@ export * from './userController.service';
 
 export * from './versionsController.service';
 
+export * from './viewedPagesController.service';
+
 export const APIS = [
     DebugControllerService,
     DictionaryControllerService,
@@ -51,5 +54,6 @@ export const APIS = [
     RulesControllerService,
     StatusControllerService,
     UserControllerService,
-    VersionsControllerService
+    VersionsControllerService,
+    ViewedPagesControllerService
 ];
diff --git a/libs/red-ui-http/src/lib/api/viewedPagesController.service.ts b/libs/red-ui-http/src/lib/api/viewedPagesController.service.ts
new file mode 100644
index 000000000..dc6977dc6
--- /dev/null
+++ b/libs/red-ui-http/src/lib/api/viewedPagesController.service.ts
@@ -0,0 +1,334 @@
+/**
+ * API Documentation for Redaction Gateway
+ * Description for redaction
+ *
+ * OpenAPI spec version: 1.0
+ *
+ *
+ * NOTE: This class is auto generated by the swagger code generator program.
+ * https://github.com/swagger-api/swagger-codegen.git
+ * Do not edit the class manually.
+ */ /* tslint:disable:no-unused-variable member-ordering */
+
+import { Inject, Injectable, Optional } from '@angular/core';
+import { HttpClient, HttpEvent, HttpHeaders, HttpResponse } from '@angular/common/http';
+
+import { Observable } from 'rxjs';
+
+import { ViewedPages } from '../model/viewedPages';
+import { ViewedPagesRequest } from '../model/viewedPagesRequest';
+
+import { BASE_PATH } from '../variables';
+import { Configuration } from '../configuration';
+
+@Injectable()
+export class ViewedPagesControllerService {
+    protected basePath = '//timo-redaction-dev.iqser.cloud/';
+    public defaultHeaders = new HttpHeaders();
+    public configuration = new Configuration();
+
+    constructor(
+        protected httpClient: HttpClient,
+        @Optional() @Inject(BASE_PATH) basePath: string,
+        @Optional() configuration: Configuration
+    ) {
+        if (basePath) {
+            this.basePath = basePath;
+        }
+        if (configuration) {
+            this.configuration = configuration;
+            this.basePath = basePath || configuration.basePath || this.basePath;
+        }
+    }
+
+    /**
+     * @param consumes string[] mime-types
+     * @return true: consumes contains 'multipart/form-data', false: otherwise
+     */
+    private canConsumeForm(consumes: string[]): boolean {
+        const form = 'multipart/form-data';
+        for (const consume of consumes) {
+            if (form === consume) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    /**
+     * Adds a page to the viewed pages
+     * None
+     * @param body viewedPagesRequest
+     * @param projectId projectId
+     * @param fileId fileId
+     * @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
+     * @param reportProgress flag to report request and response progress.
+     */
+    public addPage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'body',
+        reportProgress?: boolean
+    ): Observable<any>;
+    public addPage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'response',
+        reportProgress?: boolean
+    ): Observable<HttpResponse<any>>;
+    public addPage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'events',
+        reportProgress?: boolean
+    ): Observable<HttpEvent<any>>;
+    public addPage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe: any = 'body',
+        reportProgress: boolean = false
+    ): Observable<any> {
+        if (body === null || body === undefined) {
+            throw new Error('Required parameter body was null or undefined when calling addPage.');
+        }
+
+        if (projectId === null || projectId === undefined) {
+            throw new Error(
+                'Required parameter projectId was null or undefined when calling addPage.'
+            );
+        }
+
+        if (fileId === null || fileId === undefined) {
+            throw new Error(
+                'Required parameter fileId was null or undefined when calling addPage.'
+            );
+        }
+
+        let headers = this.defaultHeaders;
+
+        // authentication (RED-OAUTH) required
+        if (this.configuration.accessToken) {
+            const accessToken =
+                typeof this.configuration.accessToken === 'function'
+                    ? this.configuration.accessToken()
+                    : this.configuration.accessToken;
+            headers = headers.set('Authorization', 'Bearer ' + accessToken);
+        }
+
+        // to determine the Accept header
+        const httpHeaderAccepts: string[] = [];
+        const httpHeaderAcceptSelected: string | undefined = this.configuration.selectHeaderAccept(
+            httpHeaderAccepts
+        );
+        if (httpHeaderAcceptSelected !== undefined) {
+            headers = headers.set('Accept', httpHeaderAcceptSelected);
+        }
+
+        // to determine the Content-Type header
+        const consumes: string[] = ['application/json'];
+        const httpContentTypeSelected:
+            | string
+            | undefined = this.configuration.selectHeaderContentType(consumes);
+        if (httpContentTypeSelected !== undefined) {
+            headers = headers.set('Content-Type', httpContentTypeSelected);
+        }
+
+        return this.httpClient.request<any>(
+            'post',
+            `${this.basePath}/viewedPages/${encodeURIComponent(
+                String(projectId)
+            )}/${encodeURIComponent(String(fileId))}`,
+            {
+                body: body,
+                withCredentials: this.configuration.withCredentials,
+                headers: headers,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+
+    /**
+     * Gets the viewed pages for a file, depending on the users role.
+     * None
+     * @param projectId projectId
+     * @param fileId fileId
+     * @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
+     * @param reportProgress flag to report request and response progress.
+     */
+    public getViewedPages(
+        projectId: string,
+        fileId: string,
+        observe?: 'body',
+        reportProgress?: boolean
+    ): Observable<ViewedPages>;
+    public getViewedPages(
+        projectId: string,
+        fileId: string,
+        observe?: 'response',
+        reportProgress?: boolean
+    ): Observable<HttpResponse<ViewedPages>>;
+    public getViewedPages(
+        projectId: string,
+        fileId: string,
+        observe?: 'events',
+        reportProgress?: boolean
+    ): Observable<HttpEvent<ViewedPages>>;
+    public getViewedPages(
+        projectId: string,
+        fileId: string,
+        observe: any = 'body',
+        reportProgress: boolean = false
+    ): Observable<any> {
+        if (projectId === null || projectId === undefined) {
+            throw new Error(
+                'Required parameter projectId was null or undefined when calling getViewedPages.'
+            );
+        }
+
+        if (fileId === null || fileId === undefined) {
+            throw new Error(
+                'Required parameter fileId was null or undefined when calling getViewedPages.'
+            );
+        }
+
+        let headers = this.defaultHeaders;
+
+        // authentication (RED-OAUTH) required
+        if (this.configuration.accessToken) {
+            const accessToken =
+                typeof this.configuration.accessToken === 'function'
+                    ? this.configuration.accessToken()
+                    : this.configuration.accessToken;
+            headers = headers.set('Authorization', 'Bearer ' + accessToken);
+        }
+
+        // to determine the Accept header
+        const httpHeaderAccepts: string[] = ['application/json'];
+        const httpHeaderAcceptSelected: string | undefined = this.configuration.selectHeaderAccept(
+            httpHeaderAccepts
+        );
+        if (httpHeaderAcceptSelected !== undefined) {
+            headers = headers.set('Accept', httpHeaderAcceptSelected);
+        }
+
+        // to determine the Content-Type header
+        const consumes: string[] = [];
+
+        return this.httpClient.request<ViewedPages>(
+            'get',
+            `${this.basePath}/viewedPages/${encodeURIComponent(
+                String(projectId)
+            )}/${encodeURIComponent(String(fileId))}`,
+            {
+                withCredentials: this.configuration.withCredentials,
+                headers: headers,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+
+    /**
+     * Removes a page to the viewed pages
+     * None
+     * @param body viewedPagesRequest
+     * @param projectId projectId
+     * @param fileId fileId
+     * @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
+     * @param reportProgress flag to report request and response progress.
+     */
+    public removePage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'body',
+        reportProgress?: boolean
+    ): Observable<any>;
+    public removePage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'response',
+        reportProgress?: boolean
+    ): Observable<HttpResponse<any>>;
+    public removePage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe?: 'events',
+        reportProgress?: boolean
+    ): Observable<HttpEvent<any>>;
+    public removePage(
+        body: ViewedPagesRequest,
+        projectId: string,
+        fileId: string,
+        observe: any = 'body',
+        reportProgress: boolean = false
+    ): Observable<any> {
+        if (body === null || body === undefined) {
+            throw new Error(
+                'Required parameter body was null or undefined when calling removePage.'
+            );
+        }
+
+        if (projectId === null || projectId === undefined) {
+            throw new Error(
+                'Required parameter projectId was null or undefined when calling removePage.'
+            );
+        }
+
+        if (fileId === null || fileId === undefined) {
+            throw new Error(
+                'Required parameter fileId was null or undefined when calling removePage.'
+            );
+        }
+
+        let headers = this.defaultHeaders;
+
+        // authentication (RED-OAUTH) required
+        if (this.configuration.accessToken) {
+            const accessToken =
+                typeof this.configuration.accessToken === 'function'
+                    ? this.configuration.accessToken()
+                    : this.configuration.accessToken;
+            headers = headers.set('Authorization', 'Bearer ' + accessToken);
+        }
+
+        // to determine the Accept header
+        const httpHeaderAccepts: string[] = [];
+        const httpHeaderAcceptSelected: string | undefined = this.configuration.selectHeaderAccept(
+            httpHeaderAccepts
+        );
+        if (httpHeaderAcceptSelected !== undefined) {
+            headers = headers.set('Accept', httpHeaderAcceptSelected);
+        }
+
+        // to determine the Content-Type header
+        const consumes: string[] = ['*/*'];
+        const httpContentTypeSelected:
+            | string
+            | undefined = this.configuration.selectHeaderContentType(consumes);
+        if (httpContentTypeSelected !== undefined) {
+            headers = headers.set('Content-Type', httpContentTypeSelected);
+        }
+
+        return this.httpClient.request<any>(
+            'delete',
+            `${this.basePath}/viewedPages/${encodeURIComponent(
+                String(projectId)
+            )}/${encodeURIComponent(String(fileId))}`,
+            {
+                body: body,
+                withCredentials: this.configuration.withCredentials,
+                headers: headers,
+                observe: observe,
+                reportProgress: reportProgress
+            }
+        );
+    }
+}
diff --git a/libs/red-ui-http/src/lib/model/typeValue.ts b/libs/red-ui-http/src/lib/model/typeValue.ts
index 3ecc2fb39..42356824f 100644
--- a/libs/red-ui-http/src/lib/model/typeValue.ts
+++ b/libs/red-ui-http/src/lib/model/typeValue.ts
@@ -32,4 +32,6 @@ export interface TypeValue {
      */
     type?: string;
     isDefaultFilter?: boolean;
+    virtual?: boolean;
+    label?: string;
 }