105094: add context tips on various pages

src/app/access-control/epeople-registry/epeople-registry.component.html

@@ -2,7 +2,7 @@
   <div class="epeople-registry row">
     <div class="col-12">
       <div class="d-flex justify-content-between border-bottom mb-3">
-        <h2 id="header" class="pb-2">{{labelPrefix + 'head' | translate}}</h2>
+        <h2 id="header" class="pb-2">{{labelPrefix + 'head' | translate}}<span *dsContextHelp="contextHelp"></span></h2>
 
         <div *ngIf="!isEPersonFormShown">
           <button class="mr-auto btn btn-success addEPerson-button"

src/app/access-control/epeople-registry/epeople-registry.component.ts

@@ -21,6 +21,7 @@ import { RequestService } from '../../core/data/request.service';
 import { PageInfo } from '../../core/shared/page-info.model';
 import { NoContent } from '../../core/shared/NoContent.model';
 import { PaginationService } from '../../core/pagination/pagination.service';
+import {ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 @Component({
   selector: 'ds-epeople-registry',
@@ -31,6 +32,12 @@ import { PaginationService } from '../../core/pagination/pagination.service';
  * The admin can create, edit or delete epeople here.
  */
 export class EPeopleRegistryComponent implements OnInit, OnDestroy {
+  contextHelp = {
+    content: 'context.help.epeople-registry',
+    id: 'epeople-registry',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   labelPrefix = 'admin.access-control.epeople.';
 

src/app/access-control/group-registry/groups-registry.component.html

@@ -2,7 +2,7 @@
   <div class="groups-registry row">
     <div class="col-12">
       <div class="d-flex justify-content-between border-bottom mb-3">
-        <h2 id="header" class="pb-2">{{messagePrefix + 'head' | translate}}</h2>
+        <h2 id="header" class="pb-2">{{messagePrefix + 'head' | translate}}<span *dsContextHelp="contextHelp"></span></h2>
         <div>
           <button class="mr-auto btn btn-success"
                   [routerLink]="['newGroup']">

src/app/access-control/group-registry/groups-registry.component.ts

@@ -37,6 +37,7 @@ import { PaginationComponentOptions } from '../../shared/pagination/pagination-c
 import { NoContent } from '../../core/shared/NoContent.model';
 import { PaginationService } from '../../core/pagination/pagination.service';
 import { followLink } from '../../shared/utils/follow-link-config.model';
+import {ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 @Component({
   selector: 'ds-groups-registry',
@@ -47,6 +48,12 @@ import { followLink } from '../../shared/utils/follow-link-config.model';
  * The admin can create, edit or delete groups here.
  */
 export class GroupsRegistryComponent implements OnInit, OnDestroy {
+  contextHelp = {
+    content: 'context.help.group-registry-list',
+    id: 'group-registry-list',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   messagePrefix = 'admin.access-control.groups.';
 

src/app/admin/admin-curation-tasks/admin-curation-tasks.component.html

@@ -1,4 +1,4 @@
 <div class="container">
-    <h2>{{'admin.curation-tasks.header' |translate }}</h2>
+    <h2>{{'admin.curation-tasks.header' |translate }}<span *dsContextHelp="contextHelp"></span></h2>
     <ds-curation-form></ds-curation-form>
 </div>

src/app/admin/admin-curation-tasks/admin-curation-tasks.component.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import {ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 /**
  * Component responsible for rendering the system wide Curation Task UI
@@ -8,5 +9,11 @@ import { Component } from '@angular/core';
   templateUrl: './admin-curation-tasks.component.html',
 })
 export class AdminCurationTasksComponent {
+  contextHelp = {
+    content: 'context.help.admin-curation-tasks',
+    id: 'admin-curation-tasks',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
 }

src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html

@@ -2,7 +2,7 @@
   <div class="bitstream-formats row">
     <div class="col-12">
 
-      <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-formats.head' | translate}}</h2>
+      <h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-formats.head' | translate}}<span *dsContextHelp="contextHelp"></span></h2>
 
       <p id="description">{{'admin.registries.bitstream-formats.description' | translate}}</p>
       <p id="create-new" class="mb-2"><a [routerLink]="'add'" class="btn btn-success">{{'admin.registries.bitstream-formats.create.new' | translate}}</a></p>

src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.ts

@@ -14,6 +14,7 @@ import { NoContent } from '../../../core/shared/NoContent.model';
 import { PaginationService } from '../../../core/pagination/pagination.service';
 import { FindListOptions } from '../../../core/data/find-list-options.model';
 import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
+import {ContextHelpDirectiveInput} from '../../../shared/context-help.directive';
 
 /**
  * This component renders a list of bitstream formats
@@ -23,6 +24,12 @@ import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
   templateUrl: './bitstream-formats.component.html'
 })
 export class BitstreamFormatsComponent implements OnInit, OnDestroy {
+  contextHelp = {
+    content: 'context.help.bitstream-formats',
+    id: 'bitstream-formats',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   /**
    * A paginated list of bitstream formats to be shown on the page

src/app/admin/admin-registries/metadata-registry/metadata-registry.component.html

@@ -2,7 +2,7 @@
     <div class="metadata-registry row">
         <div class="col-12">
 
-            <h2 id="header" class="border-bottom pb-2">{{'admin.registries.metadata.head' | translate}}</h2>
+            <h2 id="header" class="border-bottom pb-2">{{'admin.registries.metadata.head' | translate}} <span *dsContextHelp="contextHelp"></span></h2>
 
             <p id="description" class="pb-2">{{'admin.registries.metadata.description' | translate}}</p>
 

src/app/admin/admin-registries/metadata-registry/metadata-registry.component.ts

@@ -14,6 +14,7 @@ import { toFindListOptions } from '../../../shared/pagination/pagination.utils';
 import { NoContent } from '../../../core/shared/NoContent.model';
 import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
 import { PaginationService } from '../../../core/pagination/pagination.service';
+import {ContextHelpDirectiveInput} from '../../../shared/context-help.directive';
 
 @Component({
   selector: 'ds-metadata-registry',
@@ -25,6 +26,12 @@ import { PaginationService } from '../../../core/pagination/pagination.service';
  * The admin can create, edit or delete metadata schemas here.
  */
 export class MetadataRegistryComponent {
+  contextHelp = {
+    content: 'context.help.metadata-registry',
+    id: 'metadata-registry',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   /**
    * A list of all the current metadata schemas within the repository

src/app/community-list-page/community-list-page.component.html

@@ -1,4 +1,4 @@
 <div class="container">
-  <h2>{{ 'communityList.title' | translate }}</h2>
+  <h2>{{ 'communityList.title' | translate }}<span *dsContextHelp="contextHelp"></span></h2>
   <ds-themed-community-list></ds-themed-community-list>
 </div>

src/app/community-list-page/community-list-page.component.ts

@@ -1,4 +1,5 @@
 import { Component } from '@angular/core';
+import {ContextHelpDirectiveInput} from '../shared/context-help.directive';
 
 /**
  * Page with title and the community list tree, as described in community-list.component;
@@ -9,5 +10,10 @@ import { Component } from '@angular/core';
   templateUrl: './community-list-page.component.html',
 })
 export class CommunityListPageComponent {
-
+  contextHelp = {
+    content: 'context.help.community-list-page',
+    id: 'community-list-page',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 }

src/app/home-page/recent-item-list/recent-item-list.component.html

@@ -1,7 +1,7 @@
 <ng-container *ngVar="(itemRD$ | async) as itemRD">
         <div class="mt-4" [ngClass]="placeholderFontClass" *ngIf="itemRD?.hasSucceeded && itemRD?.payload?.page.length > 0" @fadeIn>
                 <div class="d-flex flex-row border-bottom mb-4 pb-4 ng-tns-c416-2"></div>
-                <h2> {{'home.recent-submissions.head' | translate}}</h2>
+                <h2>{{'home.recent-submissions.head' | translate}}<span *dsContextHelp="contextHelp"></span></h2>
                 <div class="my-4" *ngFor="let item of itemRD?.payload?.page">
                         <ds-listable-object-component-loader [object]="item" [viewMode]="viewMode" class="pb-4">
                         </ds-listable-object-component-loader>

src/app/home-page/recent-item-list/recent-item-list.component.ts

@@ -17,6 +17,7 @@ import { followLink, FollowLinkConfig } from '../../shared/utils/follow-link-con
 import { APP_CONFIG, AppConfig } from '../../../config/app-config.interface';
 import { isPlatformBrowser } from '@angular/common';
 import { setPlaceHolderAttributes } from '../../shared/utils/object-list-utils';
+import {ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 @Component({
   selector: 'ds-recent-item-list',
@@ -32,6 +33,12 @@ export class RecentItemListComponent implements OnInit {
   itemRD$: Observable<RemoteData<PaginatedList<Item>>>;
   paginationConfig: PaginationComponentOptions;
   sortConfig: SortOptions;
+  contextHelp = {
+    content: 'context.help.recent-item-list',
+    id: 'recent-item-list',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   /**
  * The view-mode we're currently on

src/app/home-page/top-level-community-list/top-level-community-list.component.html

@@ -2,6 +2,7 @@
   <div *ngIf="communitiesRD?.hasSucceeded ">
     <h2>
       {{'home.top-level-communities.head' | translate}}
+      <span *dsContextHelp="contextHelp"></span>
     </h2>
   <p class="lead">{{'home.top-level-communities.help' | translate}}</p>
   <ds-viewable-collection

src/app/home-page/top-level-community-list/top-level-community-list.component.ts

@@ -13,6 +13,7 @@ import { hasValue } from '../../shared/empty.util';
 import { switchMap } from 'rxjs/operators';
 import { PaginationService } from '../../core/pagination/pagination.service';
 import { AppConfig, APP_CONFIG } from 'src/config/app-config.interface';
+import {ContextHelpDirective, ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 /**
  * this component renders the Top-Level Community list
@@ -26,6 +27,14 @@ import { AppConfig, APP_CONFIG } from 'src/config/app-config.interface';
 })
 
 export class TopLevelCommunityListComponent implements OnInit, OnDestroy {
+
+  contextHelp = {
+    content: 'context.help.top-level-community-list',
+    id: 'top-level-com-list',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
+
   /**
    * A list of remote data objects of all top communities
    */

src/app/process-page/overview/process-overview.component.html

@@ -1,6 +1,9 @@
 <div class="container">
     <div class="d-flex">
-        <h2 class="flex-grow-1">{{'process.overview.title' | translate}}</h2>
+        <h2 class="flex-grow-1">
+            {{'process.overview.title' | translate}}
+            <span *dsContextHelp="contextHelp"></span>
+        </h2>
     </div>
     <div class="d-flex justify-content-end">
         <button *ngIf="processBulkDeleteService.hasSelected()" class="btn btn-primary mr-2"

src/app/process-page/overview/process-overview.component.ts

@@ -14,6 +14,7 @@ import { FindListOptions } from '../../core/data/find-list-options.model';
 import { ProcessBulkDeleteService } from './process-bulk-delete.service';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { hasValue } from '../../shared/empty.util';
+import {ContextHelpDirectiveInput} from '../../shared/context-help.directive';
 
 @Component({
   selector: 'ds-process-overview',
@@ -23,6 +24,12 @@ import { hasValue } from '../../shared/empty.util';
  * Component displaying a list of all processes in a paginated table
  */
 export class ProcessOverviewComponent implements OnInit, OnDestroy {
+  contextHelp = {
+    content: 'context.help.processes',
+    id: 'processes-overview',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
 
   /**
    * List of all processes

src/app/shared/context-help-wrapper/context-help-wrapper.component.ts

@@ -72,13 +72,24 @@ export class ContextHelpWrapperComponent implements OnInit, OnDestroy {
 
   ngOnInit() {
     this.parsedContent$ = combineLatest([
-      this.content$.pipe(distinctUntilChanged(), mergeMap(translateKey => this.translateService.get(translateKey))),
+      this.content$.pipe(distinctUntilChanged(), mergeMap(translateKey => {
+        return this.translateService.get(translateKey).pipe(map(translatedText => {
+          if (translatedText === translateKey) {
+            console.warn(`Translation does not exist for context tooltip: ${translateKey}`);
+          }
+          return translatedText;
+        }));
+      })),
       this.dontParseLinks$.pipe(distinctUntilChanged())
     ]).pipe(
       map(([text, dontParseLinks]) =>
         dontParseLinks ? [text] : this.parseLinks(text))
     );
-    this.shouldShowIcon$ = this.contextHelpService.shouldShowIcons$();
+    this.shouldShowIcon$ = this.parsedContent$.pipe(
+      map(parsedContent => parsedContent[0] !== this.content$.getValue()),
+      mergeMap(shouldShow => shouldShow ? this.contextHelpService.shouldShowIcons$() : observableOf(false))
+    );
+
     this.subs.always = [this.parsedContent$.subscribe(), this.shouldShowIcon$.subscribe()];
   }
 

src/app/shared/search/search-filters/search-filters.component.html

@@ -1,4 +1,4 @@
-<h3>{{"search.filters.head" | translate}}</h3>
+<h3>{{"search.filters.head" | translate}}<span *dsContextHelp="contextHelp"></span></h3>
 <div *ngIf="(filters | async)?.hasSucceeded">
     <div *ngFor="let filter of (filters | async)?.payload; trackBy: trackUpdate">
         <ds-search-filter [filter]="filter" [inPlaceSearch]="inPlaceSearch" [refreshFilters]="refreshFilters"></ds-search-filter>

src/app/shared/search/search-filters/search-filters.component.ts

@@ -12,6 +12,7 @@ import { SearchFilterService } from '../../../core/shared/search/search-filter.s
 import { SEARCH_CONFIG_SERVICE } from '../../../my-dspace-page/my-dspace-page.component';
 import { currentPath } from '../../utils/route.utils';
 import { hasValue } from '../../empty.util';
+import {ContextHelpDirectiveInput} from '../../context-help.directive';
 
 @Component({
   selector: 'ds-search-filters',
@@ -24,6 +25,13 @@ import { hasValue } from '../../empty.util';
  * This component represents the part of the search sidebar that contains filters.
  */
 export class SearchFiltersComponent implements OnInit, OnDestroy {
+  contextHelp = {
+    content: 'context.help.search-filters',
+    id: 'search-filters',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
+
   /**
    * An observable containing configuration about which filters are shown and how they are shown
    */

src/app/shared/search/search-results/search-results.component.html

@@ -1,5 +1,12 @@
 <div class="d-flex justify-content-between">
-    <h2 *ngIf="!disableHeader">{{ (configuration ? configuration + '.search.results.head' : 'search.results.head') | translate }}</h2>
+    <h2 *ngIf="!disableHeader">{{ (configuration ? configuration + '.search.results.head' : 'search.results.head') | translate }}
+        <span *dsContextHelp="{
+            content: configuration ? 'context.help.' + configuration + '.search-results' : 'context.help.search-results',
+            id: 'search-results',
+            iconPlacement: 'right',
+            tooltipPlacement: ['right', 'bottom']
+        }"></span>
+    </h2>
     <ds-search-export-csv [searchConfig]="searchConfig"></ds-search-export-csv>
 </div>
 <div *ngIf="searchResults && searchResults?.hasSucceeded && !searchResults?.isLoading && searchResults?.payload?.page.length > 0" @fadeIn>

src/app/shared/search/search-settings/search-settings.component.html

@@ -1,5 +1,5 @@
 <ng-container>
-    <h3>{{ 'search.sidebar.settings.title' | translate}}</h3>
+    <h3>{{ 'search.sidebar.settings.title' | translate}}<span *dsContextHelp="contextHelp"></span></h3>
     <div class="result-order-settings">
     <ds-sidebar-dropdown *ngIf="sortOptionsList"
                          [id]="'search-sidebar-sort'"

src/app/shared/search/search-settings/search-settings.component.ts

@@ -5,6 +5,7 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { SearchConfigurationService } from '../../../core/shared/search/search-configuration.service';
 import { SEARCH_CONFIG_SERVICE } from '../../../my-dspace-page/my-dspace-page.component';
 import { PaginationService } from '../../../core/pagination/pagination.service';
+import {ContextHelpDirectiveInput} from '../../context-help.directive';
 
 @Component({
   selector: 'ds-search-settings',
@@ -16,6 +17,13 @@ import { PaginationService } from '../../../core/pagination/pagination.service';
  * This component represents the part of the search sidebar that contains the general search settings.
  */
 export class SearchSettingsComponent {
+  contextHelp = {
+    content: 'context.help.search-settings',
+    id: 'search-settings',
+    iconPlacement: 'right',
+    tooltipPlacement: ['right', 'bottom']
+  } as ContextHelpDirectiveInput;
+
   /**
    * The current sort option used
    */

src/assets/i18n/en.json5

@@ -4816,4 +4816,36 @@
 
   "person.orcid.registry.auth": "ORCID Authorizations",
   "home.recent-submissions.head": "Recent Submissions",
+
+//  "context.help.top-level-community-list": "add your context tip here",
+//
+//  "context.help.recent-item-list": "add your context tip here",
+//
+//  "context.help.community-list-page": "add your context tip here",
+//
+//  "context.help.search-results": "add your context tip here",
+//
+//  "context.help.workflowAdmin.search-results": "add your context tip here",
+//
+//  "context.help.administrativeView.search-results": "add your context tip here",
+//
+//  "context.help.workflow.search-results": "add your context tip here",
+//
+//  "context.help.workspace.search-results": "add your context tip here",
+//
+//  "context.help.search-filters": "add your context tip here",
+//
+//  "context.help.search-settings": "add your context tip here",
+//
+//  "context.help.processes": "add your context tip here",
+//
+//  "context.help.admin-curation-tasks": "add your context tip here",
+//
+//  "context.help.metadata-registry": "add your context tip here",
+//
+//  "context.help.bitstream-formats": "add your context tip here",
+//
+//  "context.help.group-registry-list": "add your context tip here",
+//
+//  "context.help.epeople-registry": "add your context tip here",
 }