Merge branch 'VM/DM-358' into 'master'

DM-358

Closes DM-358

See merge request redactmanager/red-ui!58

apps/red-ui/src/app/components/base-screen/base-screen.component.html

@@ -1,4 +1,4 @@
-<iqser-help-mode *ngIf="!config.IS_DOCUMINE"></iqser-help-mode>
+<iqser-help-mode></iqser-help-mode>
 
 <div class="top-bar">
     <ng-template #menuPlaceholder>
@@ -21,11 +21,11 @@
             <redaction-spotlight-search
                 *allow="roles.search; if: (isSearchScreen$ | async) === false && (currentUser.isUser || currentUser.isManager)"
                 [actions]="searchActions"
-                [attr.help-mode-key]="'search_in_entire_application'"
+                [attr.help-mode-key]="'search_entire_application'"
                 [placeholder]="'search.placeholder' | translate"
             ></redaction-spotlight-search>
 
-            <iqser-help-button *ngIf="!config.IS_DOCUMINE" [attr.help-mode-key]="'help_mode'" id="help-mode-button"></iqser-help-button>
+            <iqser-help-button [attr.help-mode-key]="'help_mode'" id="help-mode-button"></iqser-help-button>
 
             <redaction-notifications
                 *ngIf="currentUser.isUser || currentUser.isManager"

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

@@ -1,4 +1,4 @@
-<div *ngIf="breadcrumbsService.breadcrumbs$ | async as breadcrumbs" [attr.help-mode-key]="'navigate_in_breadcrumbs'" class="breadcrumbs">
+<div *ngIf="breadcrumbsService.breadcrumbs$ | async as breadcrumbs" [attr.help-mode-key]="'navigate_breadcrumbs'" class="breadcrumbs">
     <a *ngIf="breadcrumbs.length === 0; else items" class="breadcrumb back" redactionNavigateLastDossiersScreen>
         <mat-icon svgIcon="iqser:expand"></mat-icon>
         {{ 'top-bar.navigation-items.back' | translate }}
@@ -29,6 +29,7 @@
                 ></iqser-chevron-button>
 
                 <mat-menu #dropdownMenu="matMenu" class="padding-bottom-8">
+                    <div id="breadcrumbs-menu-items">
                         <a
                             *ngFor="let option of breadcrumb.options.options"
                             [routerLink]="option.options.routerLink | tenant"
@@ -38,6 +39,7 @@
                             {{ option.name$ | async }}
                             <mat-icon class="checkmark" svgIcon="iqser:check"></mat-icon>
                         </a>
+                    </div>
                 </mat-menu>
             </ng-container>
         </ng-container>

apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.html

@@ -4,7 +4,7 @@
             *ngIf="item.show"
             [routerLinkActiveOptions]="{ exact: false }"
             [routerLink]="'../' + item.screen"
-            [attr.help-mode-key]="'user_account'"
+            [attr.help-mode-key]="item.helpModeKey"
             class="item"
             routerLinkActive="active"
         >

apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.ts

@@ -9,6 +9,7 @@ interface NavItem {
     readonly label: string;
     readonly screen: string;
     readonly show?: boolean;
+    readonly helpModeKey?: string;
 }
 
 @Component({
@@ -24,21 +25,25 @@ export class AccountSideNavComponent {
             screen: 'user-profile',
             label: _('user-profile'),
             show: true,
+            helpModeKey: 'my_profile',
         },
         {
             screen: 'notifications',
             show: this.currentUser.isUser && this._permissionsService.has(Roles.notifications.write),
             label: _('notifications.label'),
+            helpModeKey: 'notification_preferences',
         },
         {
             screen: 'preferences',
             label: _('preferences-screen.label'),
             show: this.currentUser.isUser,
+            helpModeKey: 'user_preferences',
         },
         {
             screen: 'warnings-preferences',
             label: _('preferences-screen.warnings-label'),
             show: this.currentUser.isUser,
+            helpModeKey: 'prompts_and_dialogs',
         },
     ];
 

apps/red-ui/src/app/modules/admin/shared/components/admin-side-nav/admin-side-nav.component.ts

@@ -86,13 +86,13 @@ export class AdminSideNavComponent implements OnInit {
             {
                 screen: 'info',
                 label: _('admin-side-nav.dossier-template-info'),
-                helpModeKey: 'dossier_templates_info',
+                helpModeKey: this.currentUser.isAdmin ? 'dossier_templates_info' : 'user_dossier_template_info',
                 show: true,
             },
             {
                 screen: 'entities',
                 label: _('admin-side-nav.entities'),
-                helpModeKey: 'entities',
+                helpModeKey: this.currentUser.isAdmin ? 'entities' : 'user_dossier_template_entities',
                 show: true,
             },
             {
@@ -127,14 +127,14 @@ export class AdminSideNavComponent implements OnInit {
             {
                 screen: 'dossier-states',
                 label: _('admin-side-nav.dossier-states'),
-                helpModeKey: 'dossier_states',
+                helpModeKey: this.currentUser.isAdmin ? 'dossier_states' : 'user_dossier_template_dossier_states',
                 show: true,
             },
             {
                 screen: 'reports',
                 label: _('admin-side-nav.reports'),
                 show: this._permissionsService.has([Roles.reportTemplates.read]),
-                helpModeKey: 'reports',
+                helpModeKey: this.currentUser.isAdmin ? 'admin_reports' : 'user_dossier_template_reports',
             },
             {
                 screen: 'justifications',
@@ -170,7 +170,10 @@ export class AdminSideNavComponent implements OnInit {
         ],
     };
 
-    constructor(private readonly _permissionsService: IqserPermissionsService, private readonly _route: ActivatedRoute) {}
+    constructor(
+        private readonly _permissionsService: IqserPermissionsService,
+        private readonly _route: ActivatedRoute,
+    ) {}
 
     @HostBinding('class.smaller') get isSmaller(): boolean {
         return [AdminSideNavTypes.dossierTemplates, AdminSideNavTypes.entities].includes(this.type);

apps/red-ui/src/app/modules/archive/services/config.service.ts

@@ -106,14 +106,14 @@ export class ConfigService {
                 label: this._translateService.instant('dossier-listing.quick-filters.owner'),
                 checker: dossierOwnerQuickChecker(userId),
                 disabled: entities.filter(dossierOwnerQuickChecker(userId)).length === 0,
-                helpModeKey: 'filter_dossier_list',
+                helpModeKey: 'quick_filter_dossiers',
             },
             {
                 id: 'member',
                 label: this._translateService.instant('dossier-listing.quick-filters.member'),
                 checker: dossierMemberQuickChecker(userId),
                 disabled: entities.filter(dossierMemberQuickChecker(userId)).length === 0,
-                helpModeKey: 'filter_dossier_list',
+                helpModeKey: 'quick_filter_dossiers',
             },
         ].map(filter => new NestedFilter(filter));
     }

apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html

@@ -2,7 +2,7 @@
     *ngIf="stats as dossierTemplate"
     [class.empty]="dossierTemplate.isEmpty"
     [routerLink]="dossierTemplate.isEmpty ? null : ['..', dossierTemplate.dossierTemplateId]"
-    [attr.help-mode-key]="!dossierTemplate.isEmpty ? 'dossier_overview' : null"
+    [attr.help-mode-key]="!dossierTemplate.isEmpty ? 'open_dossier_template' : null"
     class="dialog"
 >
     <ng-container *ngIf="!dossierTemplate.isEmpty; else empty">
@@ -13,7 +13,7 @@
                     <mat-icon svgIcon="red:archive"></mat-icon>
                     <span
                         [innerHTML]="
-                            'dossier-template-stats.archived-dossiers' | translate : { count: dossierTemplate.numberOfArchivedDossiers }
+                            'dossier-template-stats.archived-dossiers' | translate: { count: dossierTemplate.numberOfArchivedDossiers }
                         "
                     ></span>
                 </div>
@@ -21,20 +21,18 @@
                     <mat-icon svgIcon="iqser:trash"></mat-icon>
                     <span
                         [innerHTML]="
-                            'dossier-template-stats.deleted-dossiers' | translate : { count: dossierTemplate.numberOfDeletedDossiers }
+                            'dossier-template-stats.deleted-dossiers' | translate: { count: dossierTemplate.numberOfDeletedDossiers }
                         "
                     ></span>
                 </div>
                 <div>
                     <mat-icon svgIcon="red:user"></mat-icon>
-                    <span
+                    <span [innerHTML]="'dossier-template-stats.total-people' | translate: { count: dossierTemplate.numberOfPeople }"></span>
-                        [innerHTML]="'dossier-template-stats.total-people' | translate : { count: dossierTemplate.numberOfPeople }"
-                    ></span>
                 </div>
                 <div>
                     <mat-icon svgIcon="iqser:pages"></mat-icon>
                     <span
-                        [innerHTML]="'dossier-template-stats.analyzed-pages' | translate : { count: dossierTemplate.numberOfPages }"
+                        [innerHTML]="'dossier-template-stats.analyzed-pages' | translate: { count: dossierTemplate.numberOfPages }"
                     ></span>
                 </div>
             </div>
@@ -44,7 +42,7 @@
                 [config]="translateChartService.translateDossierStates(dossierTemplate.dossiersChartConfig, dossierTemplate.id)"
                 [radius]="63"
                 [strokeWidth]="15"
-                [subtitles]="['dossier-template-stats.active-dossiers' | translate : { count: dossierTemplate.numberOfActiveDossiers }]"
+                [subtitles]="['dossier-template-stats.active-dossiers' | translate: { count: dossierTemplate.numberOfActiveDossiers }]"
                 direction="row"
                 totalType="sum"
             ></redaction-donut-chart>
@@ -76,7 +74,7 @@
             *ngIf="permissionsService.canCreateDossier(dossierTemplate)"
             [label]="'dashboard.empty-template.new-dossier' | translate"
             [type]="iconButtonTypes.primary"
-            [attr.help-mode-key]="'new_dossier_button'"
+            [attr.help-mode-key]="'new_dossier'"
             icon="iqser:plus"
         ></iqser-icon-button>
     </ng-template>

apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html

@@ -7,7 +7,7 @@
 >
     <ng-container slot="right">
         <redaction-file-download-btn
-            [attr.help-mode-key]="'edit_dossier_in_dossier'"
+            [attr.help-mode-key]="'download_dossier_in_dossier'"
             [buttonId]="'download-files-btn'"
             [disabled]="downloadBtnDisabled$ | async"
             [dossier]="dossier"
@@ -17,7 +17,7 @@
         <iqser-circle-button
             (action)="downloadDossierAsCSV()"
             *ngIf="permissionsService.canDownloadCsvReport(dossier)"
-            [attr.help-mode-key]="'edit_dossier_in_dossier'"
+            [attr.help-mode-key]="'download_csv'"
             [disabled]="listingService.areSomeSelected$ | async"
             [icon]="'iqser:csv'"
             [tooltip]="'dossier-overview.header-actions.download-csv' | translate"
@@ -36,7 +36,7 @@
         <iqser-circle-button
             (action)="upload.emit()"
             *ngIf="permissionsService.canUploadFiles(dossier)"
-            [attr.help-mode-key]="'edit_dossier_in_dossier'"
+            [attr.help-mode-key]="'upload_document'"
             [buttonId]="'upload-document-btn'"
             [icon]="'iqser:upload'"
             [tooltip]="'dossier-overview.header-actions.upload-document' | translate"

apps/red-ui/src/app/modules/dossier-overview/components/workflow-item/workflow-item.component.html

@@ -35,7 +35,6 @@
         <div #actionsWrapper class="actions-wrapper">
             <redaction-file-actions
                 *ngIf="!file.isProcessing"
-                [attr.help-mode-key]="'workflow_view'"
                 [dossier]="dossier"
                 [file]="file"
                 [maxWidth]="width"

apps/red-ui/src/app/modules/dossier-overview/config.service.ts

@@ -116,7 +116,7 @@ export class ConfigService {
                 action: () => this.#openEditDossierDialog(dossierId),
                 icon: 'iqser:edit',
                 hide: !this.#currentUser.isManager && !this._iqserPermissionsService.has(Roles.dossiers.edit),
-                helpModeKey: 'edit_dossier_in_dossier',
+                helpModeKey: 'edit_dossier',
                 disabled$,
             },
         ];
@@ -446,28 +446,28 @@ export class ConfigService {
                 required: true,
                 checker: this._recentlyModifiedChecker,
                 disabled: entities.filter(this._recentlyModifiedChecker).length === 0,
-                helpModeKey: 'filter_document_list',
+                helpModeKey: 'quick_filters_documents',
             },
             {
                 id: 'assigned-to-me',
                 label: this._translateService.instant('dossier-overview.quick-filters.assigned-to-me'),
                 checker: this._assignedToMeChecker,
                 disabled: entities.filter(this._assignedToMeChecker).length === 0,
-                helpModeKey: 'filter_document_list',
+                helpModeKey: 'quick_filters_documents',
             },
             {
                 id: 'unassigned',
                 label: this._translateService.instant('dossier-overview.quick-filters.unassigned'),
                 checker: this._unassignedChecker,
                 disabled: entities.filter(this._unassignedChecker).length === 0,
-                helpModeKey: 'filter_document_list',
+                helpModeKey: 'quick_filters_documents',
             },
             {
                 id: 'assigned-to-others',
                 label: this._translateService.instant('dossier-overview.quick-filters.assigned-to-others'),
                 checker: this._assignedToOthersChecker,
                 disabled: entities.filter(this._assignedToOthersChecker).length === 0,
-                helpModeKey: 'filter_document_list',
+                helpModeKey: 'quick_filters_documents',
             },
         ].map(filter => new NestedFilter(filter));
     }

apps/red-ui/src/app/modules/dossier-overview/screen/dossier-overview-screen.component.html

@@ -41,6 +41,7 @@
                     [noDataIcon]="'iqser:document'"
                     [noDataText]="'dossier-overview.no-data.title' | translate"
                     [showNoDataButton]="true"
+                    [id]="'workflow-view'"
                     addElementColumn="NEW"
                 >
                     <ng-template #workflowItemTemplate let-entity="entity">

apps/red-ui/src/app/modules/dossiers-listing/config.service.ts

@@ -69,7 +69,7 @@ export class ConfigService {
                 hide: !this._permissionsService.canCreateDossier(dossierTemplate),
                 icon: 'iqser:plus',
                 type: 'primary',
-                helpModeKey: 'new_dossier_button',
+                helpModeKey: 'new_dossier',
             },
         ];
     }
@@ -226,14 +226,14 @@ export class ConfigService {
                 label: this._translateService.instant('dossier-listing.quick-filters.owner'),
                 checker: dossierOwnerQuickChecker(userId),
                 disabled: entities.filter(dossierOwnerQuickChecker(userId)).length === 0,
-                helpModeKey: 'filter_dossier_list',
+                helpModeKey: 'quick_filter_dossiers',
             },
             {
                 id: 'member',
                 label: this._translateService.instant('dossier-listing.quick-filters.member'),
                 checker: dossierMemberQuickChecker(userId),
                 disabled: entities.filter(dossierMemberQuickChecker(userId)).length === 0,
-                helpModeKey: 'filter_dossier_list',
+                helpModeKey: 'quick_filter_dossiers',
             },
         ].map(filter => new NestedFilter(filter));
     }

apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.html

@@ -30,6 +30,7 @@
             [tooltipPosition]="tooltipPosition"
             [tooltip]="'annotation-actions.resize.label' | translate"
             [type]="buttonType"
+            [attr.help-mode-key]="helpModeKey('resize')"
             icon="red:resize"
         ></iqser-circle-button>
 
@@ -39,6 +40,7 @@
             [tooltipPosition]="tooltipPosition"
             [tooltip]="'annotation-actions.edit-redaction.label' | translate"
             [type]="buttonType"
+            [attr.help-mode-key]="helpModeKey('edit')"
             icon="iqser:edit"
         ></iqser-circle-button>
 
@@ -138,6 +140,7 @@
             [tooltipPosition]="tooltipPosition"
             [tooltip]="'annotation-actions.remove-annotation.remove-redaction' | translate"
             [type]="buttonType"
+            [attr.help-mode-key]="helpModeKey('remove')"
             icon="iqser:trash"
         ></iqser-circle-button>
     </ng-container>

apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts

@@ -123,4 +123,8 @@ export class AnnotationActionsComponent implements OnChanges {
             this._iqserPermissionsService,
         );
     }
+
+    helpModeKey(action: string) {
+        return this.#isDocumine ? `${action}_annotation` : '';
+    }
 }

apps/red-ui/src/app/modules/file-preview/components/annotation-wrapper/annotation-wrapper.component.ts

@@ -4,6 +4,7 @@ import { PdfProxyService } from '../../services/pdf-proxy.service';
 import { ActionsHelpModeKeys } from '../../utils/constants';
 import { ListItem } from '@models/file/list-item';
 import { MultiSelectService } from '../../services/multi-select.service';
+import { getConfig } from '@iqser/common-ui';
 
 @Component({
     selector: 'redaction-annotation-wrapper',
@@ -16,6 +17,7 @@ export class AnnotationWrapperComponent implements OnChanges {
     @HostBinding('attr.annotation-id') annotationId: string;
     @HostBinding('class.active') active = false;
     actionsHelpModeKey?: string;
+    readonly #isDocumine = getConfig().IS_DOCUMINE;
     protected readonly _pdfProxyService = inject(PdfProxyService);
     protected readonly _multiSelectService = inject(MultiSelectService);
 
@@ -26,6 +28,7 @@ export class AnnotationWrapperComponent implements OnChanges {
     }
 
     #getActionsHelpModeKey(): string {
+        if (!this.#isDocumine) {
             const type = this.annotation.item.typeLabel?.split('.')[1];
             const typeValue = this.annotation.item.typeValue;
             if (type === 'hint' && (typeValue === 'ocr' || typeValue === 'formula' || typeValue === 'image')) {
@@ -33,4 +36,6 @@ export class AnnotationWrapperComponent implements OnChanges {
             }
             return ActionsHelpModeKeys[type];
         }
+        return '';
+    }
 }

apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html

@@ -20,7 +20,7 @@
             <div
                 (click)="multiSelectService.activate()"
                 *ngIf="multiSelectService.enabled() && multiSelectService.inactive()"
-                [attr.help-mode-key]="'workload_in_editor'"
+                [attr.help-mode-key]="'workload_bulk_selection'"
                 class="all-caps-label primary pointer"
                 translate="file-preview.tabs.annotations.select"
             ></div>
@@ -28,7 +28,7 @@
             <iqser-popup-filter
                 *ngIf="documentInfoService.hidden()"
                 [actionsTemplate]="annotationFilterActionTemplate"
-                [attr.help-mode-key]="'workload_in_editor'"
+                [attr.help-mode-key]="'workload_filter'"
                 [fileId]="state.file()?.id"
                 [primaryFiltersSlug]="'primaryFilters'"
                 [secondaryFiltersSlug]="'secondaryFilters'"

apps/red-ui/src/app/modules/file-preview/components/pages/pages.component.html

@@ -1,4 +1,4 @@
-<div *ngIf="viewedPages$ | async as viewedPages" class="pages" id="pages">
+<div *ngIf="viewedPages$ | async as viewedPages" class="pages" id="pages" [attr.help-mode-key]="'workload_page_list'">
     <redaction-page-indicator
         (pageSelected)="pageSelectedByClick($event)"
         *ngFor="let pageNumber of pages; trackBy: trackBy"

apps/red-ui/src/app/modules/file-preview/components/user-management/user-management.component.html

@@ -32,7 +32,7 @@
         <iqser-circle-button
             (action)="editingReviewer = true"
             *ngIf="_canAssignOrUnassign() && !!file.assignee"
-            [attr.help-mode-key]="'document_features_in_editor'"
+            [attr.help-mode-key]="'editor_assign_user'"
             [buttonId]="'change-assignee'"
             [icon]="'iqser:edit'"
             [tooltip]="assignTooltip() | translate"

apps/red-ui/src/app/modules/file-preview/dialogs/structured-component-management-dialog/structured-component-management-dialog.component.html

@@ -2,14 +2,14 @@
     <div [translate]="'rss-dialog.title'" class="dialog-header heading-l"></div>
 
     <hr />
-    <div class="dialog-content">
+    <div class="dialog-content" id="scm-edit">
         <div *ngIf="scmData() as scmEntry" class="table output-data">
             <div class="table-header">{{ 'rss-dialog.table-header.component' | translate }}</div>
             <div class="table-header">{{ 'rss-dialog.table-header.value' | translate }}</div>
             <div class="table-header">{{ 'rss-dialog.table-header.transformation-rule' | translate }}</div>
             <div class="table-header">{{ 'rss-dialog.table-header.annotation-references' | translate }}</div>
 
-            <ng-container *ngFor="let entry of scmEntry.result | keyvalue : originalOrder; let index = index">
+            <ng-container *ngFor="let entry of scmEntry.result | keyvalue: originalOrder; let index = index">
                 <div class="bold">{{ entry.key }}</div>
                 <div [id]="getValueCellId(index)">
                     <iqser-editable-input
@@ -21,13 +21,15 @@
                         [parentId]="getValueCellId(index)"
                         [saveTooltip]="'rss-dialog.actions.save' | translate"
                         [value]="entry.value.value ?? entry.value.originalValue"
+                        [helpModeKey]="'scm_edit_DIALOG'"
                     >
                         <ng-container slot="editing">
                             <iqser-circle-button
                                 (action)="undo(entry.value.originalKey)"
                                 *ngIf="entry.value.value && canEdit"
                                 [showDot]="true"
-                                [tooltip]="'rss-dialog.actions.undo' | translate : { value: entry.value.originalValue } | replaceNbsp"
+                                [tooltip]="'rss-dialog.actions.undo' | translate: { value: entry.value.originalValue } | replaceNbsp"
+                                [attr.help-mode-key]="'scm_undo_DIALOG'"
                                 class="ml-2"
                                 icon="red:undo"
                             ></iqser-circle-button>
@@ -65,12 +67,14 @@
             [label]="'rss-dialog.actions.export-json' | translate"
             [submit]="true"
             [type]="iconButtonTypes.primary"
+            [attr.help-mode-key]="'scm_export_DIALOG'"
         ></iqser-icon-button>
 
         <iqser-icon-button
             (action)="exportXML()"
             [label]="'rss-dialog.actions.export-xml' | translate"
             [type]="iconButtonTypes.primary"
+            [attr.help-mode-key]="'scm_export_DIALOG'"
         ></iqser-icon-button>
 
         <iqser-icon-button

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

@@ -30,11 +30,12 @@
                 class="ml-8"
                 icon="red:extract"
                 tooltipPosition="below"
+                [attr.help-mode-key]="'editor_scm'"
             ></iqser-circle-button>
 
             <redaction-file-actions
                 [dossier]="state.dossier()"
-                [fileActionsHelpModeKey]="'editor_document_features'"
+                [helpModeKeyPrefix]="'editor'"
                 [file]="file"
                 [minWidth]="width"
                 type="file-preview"
@@ -53,6 +54,7 @@
                 [icon]="fullScreen ? 'red:exit-fullscreen' : 'red:fullscreen'"
                 [tooltip]="'file-preview.fullscreen' | translate"
                 class="ml-2"
+                [attr.help-mode-key]="'editor_full_screen'"
             ></iqser-circle-button>
 
             <!-- Dev Mode Features-->
@@ -73,6 +75,7 @@
                 [tooltip]="'common.close' | translate"
                 class="ml-8"
                 icon="iqser:close"
+                [attr.help-mode-key]="'editor_close'"
             ></iqser-circle-button>
         </div>
     </div>

apps/red-ui/src/app/modules/pdf-viewer/services/viewer-header.service.ts

@@ -1,11 +1,11 @@
 import { inject, Injectable, NgZone } from '@angular/core';
-import { getConfig, IqserPermissionsService, isIqserDevMode } from '@iqser/common-ui';
+import { getConfig, HelpModeService, IqserPermissionsService, isIqserDevMode } from '@iqser/common-ui';
 import { BASE_HREF_FN } from '@iqser/common-ui/lib/utils';
 import { TranslateService } from '@ngx-translate/core';
 import { IHeaderElement, RotationTypes } from '@red/domain';
 import { FilesMapService } from '@services/files/files-map.service';
 import { Roles } from '@users/roles';
-import { fromEvent, Observable, Subject } from 'rxjs';
+import { fromEvent, merge, Observable, Subject } from 'rxjs';
 import { filter, map, tap } from 'rxjs/operators';
 import { HeaderElements, HeaderElementType } from '../../file-preview/utils/constants';
 import { ROTATION_ACTION_BUTTONS, ROTATION_BUTTONS, ViewerEvents } from '../utils/constants';
@@ -56,6 +56,7 @@ export class ViewerHeaderService {
         private readonly _layersService: LayersService,
         private readonly _readableRedactionsService: ReadableRedactionsService,
         private readonly _ngZone: NgZone,
+        private readonly _helpModeService: HelpModeService,
     ) {
         this.events$ = this.#events$.asObservable();
     }
@@ -224,9 +225,9 @@ export class ViewerHeaderService {
     }
 
     get #toggleLoadAnnotations$() {
-        return this.expandedPanelEvent$.pipe(
+        return merge(this.expandedPanelEvent$, this._helpModeService.isHelpModeActive$).pipe(
-            tap(isVisible =>
+            tap(enable =>
-                isVisible ? this.enable([HeaderElements.LOAD_ALL_ANNOTATIONS]) : this.disable([HeaderElements.LOAD_ALL_ANNOTATIONS]),
+                enable ? this.enable([HeaderElements.LOAD_ALL_ANNOTATIONS]) : this.disable([HeaderElements.LOAD_ALL_ANNOTATIONS]),
             ),
         );
     }

apps/red-ui/src/app/modules/shared-dossiers/components/dossiers-listing-actions/dossiers-listing-actions.component.html

@@ -2,7 +2,7 @@
     <iqser-circle-button
         (action)="openEditDossierDialog(dossier.id)"
         *allow="roles.dossiers.read; if: currentUser.isUser"
-        [attr.help-mode-key]="'edit_dossier_dossier_info'"
+        [attr.help-mode-key]="'edit_dossier'"
         [icon]="
             ((iqserPermissionsService.has$(roles.dossiers.edit) | async) && currentUser.isManager) || canEditDossierDictionary
                 ? 'iqser:edit'

apps/red-ui/src/app/modules/shared-dossiers/components/file-actions/file-actions.component.html

@@ -11,13 +11,15 @@
 </ng-container>
 
 <ng-template #actions (longPress)="forceReanalysisAction($event)" redactionLongPress>
-    <div [attr.help-mode-key]="fileActionsHelpModeKey" class="file-actions">
+    <div class="file-actions">
         <redaction-expandable-file-actions
             [actions]="buttons"
             [id]="'actions-for-' + file.fileId"
             [maxWidth]="maxWidth"
             [minWidth]="minWidth"
             [tooltipPosition]="tooltipPosition"
+            [helpModeKeyPrefix]="helpModeKeyPrefix"
+            [isDossierOverviewWorkflow]="isDossierOverviewWorkflow"
         ></redaction-expandable-file-actions>
     </div>
 </ng-template>

apps/red-ui/src/app/modules/shared-dossiers/components/file-actions/file-actions.component.ts

@@ -41,7 +41,7 @@ export class FileActionsComponent implements OnChanges {
     @Input({ required: true }) type: 'file-preview' | 'dossier-overview-list' | 'dossier-overview-workflow';
     @Input() maxWidth: number;
     @Input() minWidth: number;
-    @Input() fileActionsHelpModeKey: 'document_features_in_dossier' | 'editor_document_features' = 'document_features_in_dossier';
+    @Input() helpModeKeyPrefix: 'dossier' | 'editor' = 'dossier';
     readonly currentUser = getCurrentUser<User>();
     toggleTooltip?: string;
     assignTooltip?: string;
@@ -112,6 +112,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.delete.action'),
                 icon: 'iqser:trash',
                 show: this.showDelete,
+                helpModeKey: 'delete_file',
             },
             {
                 id: 'assign-btn',
@@ -120,6 +121,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: this.assignTooltip,
                 icon: 'red:assign',
                 show: this.showAssign,
+                helpModeKey: 'assign_user',
             },
             {
                 id: 'assign-to-me-btn',
@@ -128,6 +130,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.assign-me'),
                 icon: 'red:assign-me',
                 show: this.showAssignToSelf,
+                helpModeKey: 'assign_user',
             },
             {
                 id: 'open-import-redactions-dialog-btn',
@@ -145,6 +148,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltipClass: 'small',
                 show: this._permissionsService.canDownloadRedactedFile() && !!this.file.lastProcessed,
                 disabled: this.file.processingStatus === ProcessingFileStatuses.ERROR,
+                helpModeKey: 'download',
             },
             {
                 id: 'toggle-document-info-btn',
@@ -154,6 +158,7 @@ export class FileActionsComponent implements OnChanges {
                 ariaExpanded: toObservable(this._documentInfoService?.shown, { injector: this._injector }),
                 icon: 'red:status-info',
                 show: !!this._documentInfoService,
+                helpModeKey: 'document_info',
             },
             {
                 id: 'toggle-exclude-pages-btn',
@@ -172,6 +177,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.back-to-new'),
                 icon: 'red:undo',
                 show: this.showSetToNew,
+                helpModeKey: 'change_status',
             },
             {
                 id: 'set-file-under-approval-btn',
@@ -180,6 +186,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.under-approval'),
                 icon: 'red:ready-for-approval',
                 show: this.showUnderApproval,
+                helpModeKey: 'change_status',
             },
             {
                 id: 'set-file-under-review-btn',
@@ -188,6 +195,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.under-review'),
                 icon: 'red:undo',
                 show: this.showUnderReview,
+                helpModeKey: 'change_status',
             },
             {
                 id: 'set-file-approved-btn',
@@ -197,6 +205,7 @@ export class FileActionsComponent implements OnChanges {
                 icon: 'red:approved',
                 disabled: !this.file.canBeApproved,
                 show: this.showApprove,
+                helpModeKey: 'change_status',
             },
             {
                 id: 'toggle-automatic-analysis-btn',
@@ -205,6 +214,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.stop-auto-analysis'),
                 icon: 'red:disable-analysis',
                 show: this.canDisableAutoAnalysis,
+                helpModeKey: 'stop_analysis',
             },
             {
                 id: 'reanalyse-file-preview-btn',
@@ -215,6 +225,7 @@ export class FileActionsComponent implements OnChanges {
                 icon: 'iqser:refresh',
                 show: this.showReanalyseFilePreview,
                 disabled: this.file.isProcessing,
+                helpModeKey: 'stop_analysis',
             },
             {
                 id: 'toggle-automatic-analysis-btn',
@@ -224,6 +235,7 @@ export class FileActionsComponent implements OnChanges {
                 buttonType: this.isFilePreview ? CircleButtonTypes.warn : CircleButtonTypes.default,
                 icon: 'red:enable-analysis',
                 show: this.canEnableAutoAnalysis,
+                helpModeKey: 'stop_analysis',
             },
             {
                 id: 'set-under-approval-btn',
@@ -232,6 +244,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.under-approval'),
                 icon: 'red:undo',
                 show: this.showUndoApproval,
+                helpModeKey: 'change_status',
             },
             {
                 id: 'ocr-file-btn',
@@ -248,6 +261,7 @@ export class FileActionsComponent implements OnChanges {
                 tooltip: _('dossier-overview.reanalyse.action'),
                 icon: 'iqser:refresh',
                 show: this.showReanalyseDossierOverview,
+                helpModeKey: 'stop_analysis',
             },
             {
                 id: 'toggle-analysis-btn',
@@ -258,6 +272,7 @@ export class FileActionsComponent implements OnChanges {
                 class: { 'mr-24': this.isDossierOverviewList },
                 checked: !this.file.excluded,
                 show: this.showToggleAnalysis,
+                helpModeKey: 'disable_extraction',
             },
         ];
 

apps/red-ui/src/app/modules/shared/components/dossiers-type-switch/dossiers-type-switch.component.html

@@ -2,7 +2,7 @@
     <button
         [routerLinkActive]="'active'"
         [routerLink]="['..', DOSSIERS_ROUTE]"
-        [attr.help-mode-key]="'dossier_list'"
+        [attr.help-mode-key]="'active_archived_dossiers'"
         class="red-tab"
         id="active-button"
     >
@@ -13,7 +13,7 @@
         [disabled]="dossierTemplate.numberOfArchivedDossiers === 0"
         [routerLinkActive]="'active'"
         [routerLink]="['..', ARCHIVE_ROUTE]"
-        [attr.help-mode-key]="'dossier_list'"
+        [attr.help-mode-key]="'active_archived_dossiers'"
         class="red-tab"
         id="archived-button"
     >

apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.html

@@ -11,6 +11,7 @@
         [tooltipPosition]="tooltipPosition"
         [tooltip]="btn.tooltip | translate"
         [type]="btn.buttonType || buttonType"
+        [attr.help-mode-key]="helpModeKey(btn)"
     ></iqser-circle-button>
 
     <!-- download redacted file-->
@@ -23,6 +24,7 @@
         [tooltipClass]="btn.tooltipClass"
         [tooltipPosition]="tooltipPosition"
         [type]="buttonType"
+        [attr.help-mode-key]="helpModeKey(btn)"
     ></redaction-file-download-btn>
 
     <!-- exclude from redaction -->
@@ -35,6 +37,7 @@
             [matTooltipPosition]="tooltipPosition"
             [matTooltip]="btn.tooltip | translate"
             [ngClass]="btn.class"
+            [attr.help-mode-key]="helpModeKey(btn)"
             color="primary"
             iqserStopPropagation
         ></mat-slide-toggle>

apps/red-ui/src/app/modules/shared/components/expandable-file-actions/expandable-file-actions.component.ts

@@ -20,6 +20,8 @@ export class ExpandableFileActionsComponent implements OnChanges {
     @Input() minWidth: number;
     @Input() buttonType: CircleButtonType;
     @Input() tooltipPosition: IqserTooltipPosition;
+    @Input() helpModeKeyPrefix: 'dossier' | 'editor';
+    @Input() isDossierOverviewWorkflow = false;
 
     displayedButtons: Action[];
     hiddenButtons: Action[];
@@ -73,6 +75,12 @@ export class ExpandableFileActionsComponent implements OnChanges {
         }
     }
 
+    helpModeKey(action: Action) {
+        return action.helpModeKey
+            ? `${this.helpModeKeyPrefix}${this.isDossierOverviewWorkflow ? '_workflow' : ''}_${action.helpModeKey}`
+            : '';
+    }
+
     onButtonClick(button: Action, $event: MouseEvent) {
         button.action($event);
         this.matMenu.closeMenu();

apps/red-ui/src/assets/help-mode/help-mode-keys.json

@@ -27,14 +27,19 @@
     "documentKey": "filter_dossier_list"
   },
   {
-    "elementKey": "navigate_in_breadcrumbs",
+    "elementKey": "navigate_breadcrumbs",
-    "documentKey": "navigate_in_breadcrumbs"
+    "documentKey": "navigate_breadcrumbs"
   },
   {
     "elementKey": "new_dossier_button",
     "documentKey": "new_dossier_button",
     "overlappingElements": ["USER_MENU"]
   },
+  {
+    "elementKey": "new_dossier",
+    "documentKey": "new_dossier",
+    "overlappingElements": ["USER_MENU"]
+  },
   {
     "elementKey": "open_notifications",
     "documentKey": "open_notifications"
@@ -48,13 +53,8 @@
     "documentKey": "views"
   },
   {
-    "elementKey": "search_in_entire_application",
+    "elementKey": "search_entire_application",
-    "documentKey": "search_in_entire_application"
+    "documentKey": "search_entire_application"
-  },
-  {
-    "elementKey": "edit_dossier_in_dossier",
-    "documentKey": "edit_dossier_in_dossier",
-    "overlappingElements": ["USER_MENU"]
   },
   {
     "elementKey": "document_features_in_editor",
@@ -155,8 +155,20 @@
     "overlappingElements": ["USER_MENU", "DOCUMENT_INFO"]
   },
   {
-    "elementKey": "user_account",
+    "elementKey": "my_profile",
-    "documentKey": "user_account"
+    "documentKey": "my_profile"
+  },
+  {
+    "elementKey": "notification_preferences",
+    "documentKey": "notification_preferences"
+  },
+  {
+    "elementKey": "user_preferences",
+    "documentKey": "user_preferences"
+  },
+  {
+    "elementKey": "prompts_and_dialogs",
+    "documentKey": "prompts_and_dialogs"
   },
   {
     "elementKey": "my_downloads",
@@ -167,8 +179,8 @@
     "documentKey": "trash"
   },
   {
-    "elementKey": "dossier_overview",
+    "elementKey": "open_dossier_template",
-    "documentKey": "dossier_overview"
+    "documentKey": "open_dossier_template"
   },
   {
     "elementKey": "home",
@@ -189,7 +201,8 @@
   {
     "elementKey": "dossier",
     "documentKey": "dossier",
-    "scrollableParentView": "VIRTUAL_SCROLL"
+    "scrollableParentView": "VIRTUAL_SCROLL",
+    "overlappingElements": ["BREADCRUMBS_MENU"]
   },
   {
     "elementKey": "document_in_editor",
@@ -198,7 +211,8 @@
   },
   {
     "elementKey": "dossier_list",
-    "documentKey": "dossier_list"
+    "documentKey": "dossier_list",
+    "overlappingElements": ["BREADCRUMBS_MENU"]
   },
   {
     "elementKey": "dossier_templates",
@@ -209,6 +223,10 @@
     "documentKey": "edit_clone_delete_dossier_templates",
     "overlappingElements": ["USER_MENU"]
   },
+  {
+    "elementKey": "user_dossier_template_info",
+    "documentKey": "user_dossier_template_info"
+  },
   {
     "elementKey": "dossier_templates_info",
     "documentKey": "dossier_templates_info"
@@ -217,6 +235,10 @@
     "elementKey": "entities",
     "documentKey": "entities"
   },
+  {
+    "elementKey": "user_dossier_template_entities",
+    "documentKey": "user_dossier_template_entities"
+  },
   {
     "elementKey": "edit_delete_entities",
     "documentKey": "edit_delete_entities",
@@ -279,6 +301,10 @@
     "documentKey": "edit_delete_dossier_attributes",
     "overlappingElements": ["USER_MENU"]
   },
+  {
+    "elementKey": "user_dossier_template_dossier_states",
+    "documentKey": "user_dossier_template_dossier_states"
+  },
   {
     "elementKey": "dossier_states",
     "documentKey": "dossier_states"
@@ -296,6 +322,14 @@
     "documentKey": "reports",
     "overlappingElements": ["USER_MENU"]
   },
+  {
+    "elementKey": "user_dossier_template_reports",
+    "documentKey": "user_dossier_template_reports"
+  },
+  {
+    "elementKey": "admin_reports",
+    "documentKey": "reports"
+  },
   {
     "elementKey": "justifications",
     "documentKey": "justifications"
@@ -375,5 +409,192 @@
   {
     "elementKey": "edit-file-attributes",
     "documentKey": "document_list"
+  },
+  {
+    "elementKey": "active_archived_dossiers",
+    "documentKey": "active_archived_dossiers"
+  },
+  {
+    "elementKey": "quick_filter_dossiers",
+    "documentKey": "quick_filter_dossiers"
+  },
+  {
+    "elementKey": "edit_dossier",
+    "documentKey": "edit_dossier"
+  },
+  {
+    "elementKey": "download_dossier_in_dossier",
+    "documentKey": "download_dossier",
+    "overlappingElements": ["USER_MENU"]
+  },
+  {
+    "elementKey": "download_csv",
+    "documentKey": "download_csv",
+    "overlappingElements": ["USER_MENU"]
+  },
+  {
+    "elementKey": "upload_document",
+    "documentKey": "upload_document",
+    "overlappingElements": ["USER_MENU"]
+  },
+  {
+    "elementKey": "close_dossier",
+    "documentKey": "close_dossier",
+    "overlappingElements": ["USER_MENU"]
+  },
+  {
+    "elementKey": "quick_filters_documents",
+    "documentKey": "quick_filters_documents"
+  },
+  {
+    "elementKey": "filter_documents",
+    "documentKey": "filter_documents"
+  },
+  {
+    "elementKey": "dossier_delete_file",
+    "documentKey": "dossier_delete_file",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_assign_user",
+    "documentKey": "dossier_assign_user",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_change_status",
+    "documentKey": "dossier_change_status",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_stop_analysis",
+    "documentKey": "dossier_stop_analysis",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_download",
+    "documentKey": "dossier_download",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_disable_extraction",
+    "documentKey": "dossier_disable_extraction",
+    "scrollableParentView": "VIRTUAL_SCROLL"
+  },
+  {
+    "elementKey": "dossier_workflow_delete_file",
+    "documentKey": "dossier_delete_file",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "dossier_workflow_assign_user",
+    "documentKey": "dossier_assign_user",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "dossier_workflow_change_status",
+    "documentKey": "dossier_change_status",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "dossier_workflow_stop_analysis",
+    "documentKey": "dossier_stop_analysis",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "dossier_workflow_download",
+    "documentKey": "dossier_download",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "dossier_workflow_disable_extraction",
+    "documentKey": "dossier_disable_extraction",
+    "scrollableParentView": "WORKFLOW_VIEW"
+  },
+  {
+    "elementKey": "workload_page_list",
+    "documentKey": "workload_page_list"
+  },
+
+  {
+    "elementKey": "editor_delete_file",
+    "documentKey": "editor_delete_file"
+  },
+  {
+    "elementKey": "editor_assign_user",
+    "documentKey": "editor_assign_user"
+  },
+  {
+    "elementKey": "editor_change_status",
+    "documentKey": "editor_change_status"
+  },
+  {
+    "elementKey": "editor_stop_analysis",
+    "documentKey": "editor_stop_analysis"
+  },
+  {
+    "elementKey": "editor_download",
+    "documentKey": "editor_download"
+  },
+  {
+    "elementKey": "editor_disable_extraction",
+    "documentKey": "editor_disable_extraction"
+  },
+  {
+    "elementKey": "editor_scm",
+    "documentKey": "editor_scm"
+  },
+  {
+    "elementKey": "editor_document_info",
+    "documentKey": "editor_document_info"
+  },
+  {
+    "elementKey": "editor_full_screen",
+    "documentKey": "editor_full_screen"
+  },
+  {
+    "elementKey": "editor_close",
+    "documentKey": "editor_close"
+  },
+  {
+    "elementKey": "scm_edit_DIALOG",
+    "documentKey": "scm_edit",
+    "scrollableParentView": "SCM_EDIT_DIALOG"
+  },
+  {
+    "elementKey": "scm_undo_DIALOG",
+    "documentKey": "scm_undo",
+    "scrollableParentView": "SCM_EDIT_DIALOG"
+  },
+  {
+    "elementKey": "scm_export_DIALOG",
+    "documentKey": "scm_export"
+  },
+  {
+    "elementKey": "resize_annotation",
+    "documentKey": "resize_annotation",
+    "scrollableParentView": "ANNOTATIONS_LIST",
+    "overlappingElements": ["USER_MENU", "WORKLOAD_FILTER", "DOCUMENT_INFO"]
+  },
+  {
+    "elementKey": "edit_annotation",
+    "documentKey": "edit_annotation",
+    "scrollableParentView": "ANNOTATIONS_LIST",
+    "overlappingElements": ["USER_MENU", "WORKLOAD_FILTER", "DOCUMENT_INFO"]
+  },
+  {
+    "elementKey": "remove_annotation",
+    "documentKey": "remove_annotation",
+    "scrollableParentView": "ANNOTATIONS_LIST",
+    "overlappingElements": ["USER_MENU", "WORKLOAD_FILTER", "DOCUMENT_INFO"]
+  },
+  {
+    "elementKey": "workload_filter",
+    "documentKey": "workload_filter",
+    "overlappingElements": ["USER_MENU", "DOCUMENT_INFO"]
+  },
+  {
+    "elementKey": "workload_bulk_selection",
+    "documentKey": "workload_bulk_selection",
+    "overlappingElements": ["USER_MENU", "DOCUMENT_INFO"]
   }
 ]

libs/common-ui

@@ -1 +1 @@
-Subproject commit 523f2c999e05ed66749d9abc1d43a750246dc7bd
+Subproject commit f0c51915b26a36444885df947cddab2c0af101e7