Merge branch 'dspace-7_x' into accessibility-settings-7_x

.eslintrc.json

@@ -231,10 +231,13 @@
         "*.json5"
       ],
       "extends": [
-        "plugin:jsonc/recommended-with-jsonc"
+        "plugin:jsonc/recommended-with-json5"
       ],
       "rules": {
-        "no-irregular-whitespace": "error",
+        // The ESLint core no-irregular-whitespace rule doesn't work well in JSON
+        // See: https://ota-meshi.github.io/eslint-plugin-jsonc/rules/no-irregular-whitespace.html
+        "no-irregular-whitespace": "off",
+        "jsonc/no-irregular-whitespace": "error",
         "no-trailing-spaces": "error",
         "jsonc/comma-dangle": [
           "error",

.github/workflows/build.yml

@@ -184,12 +184,115 @@ jobs:
       # Get homepage and verify that the <meta name="title"> tag includes "DSpace".
       # If it does, then SSR is working, as this tag is created by our MetadataService.
       # This step also prints entire HTML of homepage for easier debugging if grep fails.
-      - name: Verify SSR (server-side rendering)
+      - name: Verify SSR (server-side rendering) on Homepage
         run: |
           result=$(wget -O- -q http://127.0.0.1:4000/home)
           echo "$result"
           echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep DSpace
 
+      # Get a specific community in our test data and verify that the "<h1>" tag includes "Publications" (the community name).
+      # If it does, then SSR is working.
+      - name: Verify SSR on a Community page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/communities/0958c910-2037-42a9-81c7-dca80e3892b4)
+          echo "$result"
+          echo "$result" | grep -oE "<h1 [^>]*>[^><]*</h1>" | grep Publications
+
+      # Get a specific collection in our test data and verify that the "<h1>" tag includes "Articles" (the collection name).
+      # If it does, then SSR is working.
+      - name: Verify SSR on a Collection page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/collections/282164f5-d325-4740-8dd1-fa4d6d3e7200)
+          echo "$result"
+          echo "$result" | grep -oE "<h1 [^>]*>[^><]*</h1>" | grep Articles
+
+      # Get a specific publication in our test data and verify that the <meta name="title"> tag includes
+      # the title of this publication. If it does, then SSR is working.
+      - name: Verify SSR on a Publication page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/publication/6160810f-1e53-40db-81ef-f6621a727398)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "An Economic Model of Mortality Salience"
+
+      # Get a specific person in our test data and verify that the <meta name="title"> tag includes
+      # the name of the person. If it does, then SSR is working.
+      - name: Verify SSR on a Person page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/person/b1b2c768-bda1-448a-a073-fc541e8b24d9)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "Simmons, Cameron"
+
+      # Get a specific project in our test data and verify that the <meta name="title"> tag includes
+      # the name of the project. If it does, then SSR is working.
+      - name: Verify SSR on a Project page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/project/46ccb608-a74c-4bf6-bc7a-e29cc7defea9)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "University Research Fellowship"
+
+      # Get a specific orgunit in our test data and verify that the <meta name="title"> tag includes
+      # the name of the orgunit. If it does, then SSR is working.
+      - name: Verify SSR on an OrgUnit page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/orgunit/9851674d-bd9a-467b-8d84-068deb568ccf)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "Law and Development"
+
+      # Get a specific journal in our test data and verify that the <meta name="title"> tag includes
+      # the name of the journal. If it does, then SSR is working.
+      - name: Verify SSR on a Journal page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/journal/d4af6c3e-53d0-4757-81eb-566f3b45d63a)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "Environmental &amp; Architectural Phenomenology"
+
+      # Get a specific journal volume in our test data and verify that the <meta name="title"> tag includes
+      # the name of the volume. If it does, then SSR is working.
+      - name: Verify SSR on a Journal Volume page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/journalvolume/07c6249f-4bf7-494d-9ce3-6ffdb2aed538)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "Environmental &amp; Architectural Phenomenology Volume 28 (2017)"
+
+      # Get a specific journal issue in our test data and verify that the <meta name="title"> tag includes
+      # the name of the issue. If it does, then SSR is working.
+      - name: Verify SSR on a Journal Issue page
+        run: |
+          result=$(wget -O- -q http://127.0.0.1:4000/entities/journalissue/44c29473-5de2-48fa-b005-e5029aa1a50b)
+          echo "$result"
+          echo "$result" | grep -oE "<meta name=\"title\" [^>]*>" | grep "Environmental &amp; Architectural Phenomenology Vol. 28, No. 1"
+
+      # Verify 301 Handle redirect behavior
+      # Note: /handle/123456789/260 is the same test Publication used by our e2e tests
+      - name: Verify 301 redirect from '/handle' URLs
+        run: |
+          result=$(wget --server-response --quiet http://127.0.0.1:4000/handle/123456789/260 2>&1 | head -1 | awk '{print $2}')
+          echo "$result"
+          [[ "$result" -eq "301" ]]
+
+      # Verify 403 error code behavior
+      - name: Verify 403 error code from '/403'
+        run: |
+          result=$(wget --server-response --quiet http://127.0.0.1:4000/403 2>&1 | head -1 | awk '{print $2}')
+          echo "$result"
+          [[ "$result" -eq "403" ]]
+
+      # Verify 404 error code behavior
+      - name: Verify 404 error code from '/404' and on invalid pages
+        run: |
+          result=$(wget --server-response --quiet http://127.0.0.1:4000/404 2>&1 | head -1 | awk '{print $2}')
+          echo "$result"
+          result2=$(wget --server-response --quiet http://127.0.0.1:4000/invalidurl 2>&1 | head -1 | awk '{print $2}')
+          echo "$result2"
+          [[ "$result" -eq "404" && "$result2" -eq "404" ]]
+
+      # Verify 500 error code behavior
+      - name: Verify 500 error code from '/500'
+        run: |
+          result=$(wget --server-response --quiet http://127.0.0.1:4000/500 2>&1 | head -1 | awk '{print $2}')
+          echo "$result"
+          [[ "$result" -eq "500" ]]
+
       - name: Stop running app
         run: kill -9 $(lsof -t -i:4000)
 

config/config.example.yml

@@ -23,10 +23,24 @@ universal:
   # Determining which styles are critical is a relatively expensive operation; this option is
   # disabled (false) by default to boost server performance at the expense of loading smoothness.
   inlineCriticalCss: false
-  # Path prefixes to enable SSR for. By default these are limited to paths of primary DSpace objects.
-  # NOTE: The "/handle/" path ensures Handle redirects work via SSR.  The "/reload/" path ensures
-  # hard refreshes (e.g. after login) trigger SSR while fully reloading the page.
-  paths: [ '/home', '/items/', '/entities/', '/collections/', '/communities/', '/bitstream/', '/bitstreams/', '/handle/', '/reload/' ]
+  # Patterns to be run as regexes against the path of the page to check if SSR is allowed.
+  # If the path match any of the regexes it will be served directly in CSR.
+  # By default, excludes community and collection browse, global browse, global search, community list, statistics and various administrative tools.
+  excludePathPatterns:
+    - pattern: "^/communities/[a-f0-9-]{36}/browse(/.*)?$"
+      flag: "i"
+    - pattern: "^/collections/[a-f0-9-]{36}/browse(/.*)?$"
+      flag: "i"
+    - pattern: "^/browse/"
+    - pattern: "^/search$"
+    - pattern: "^/community-list$"
+    - pattern: "^/admin/"
+    - pattern: "^/processes/?"
+    - pattern: "^/notifications/"
+    - pattern: "^/statistics/?"
+    - pattern: "^/access-control/"
+    - pattern: "^/health$"
+
   # Whether to enable rendering of Search component on SSR.
   # If set to true the component will be included in the HTML returned from the server side rendering.
   # If set to false the component will not be included in the HTML returned from the server side rendering.

package.json

@@ -60,7 +60,7 @@
     "@angular/platform-browser-dynamic": "^15.2.10",
     "@angular/platform-server": "^15.2.10",
     "@angular/router": "^15.2.10",
-    "@babel/runtime": "7.26.7",
+    "@babel/runtime": "7.27.6",
     "@kolkov/ngx-gallery": "^2.0.1",
     "@ng-bootstrap/ng-bootstrap": "^11.0.0",
     "@ng-dynamic-forms/core": "^15.0.0",
@@ -73,14 +73,14 @@
     "@nicky-lenaers/ngx-scroll-to": "^14.0.0",
     "angular-idle-preload": "3.0.0",
     "angulartics2": "^12.2.1",
-    "axios": "^1.7.9",
+    "axios": "^1.10.0",
     "bootstrap": "^4.6.1",
     "cerialize": "0.1.18",
     "cli-progress": "^3.12.0",
     "colors": "^1.4.0",
-    "compression": "^1.7.5",
+    "compression": "^1.8.0",
     "cookie-parser": "1.4.7",
-    "core-js": "^3.40.0",
+    "core-js": "^3.42.0",
     "date-fns": "^2.30.0",
     "date-fns-tz": "^1.3.7",
     "deepmerge": "^4.3.1",
@@ -89,9 +89,9 @@
     "express-rate-limit": "^5.1.3",
     "fast-json-patch": "^3.1.1",
     "filesize": "^6.1.0",
-    "http-proxy-middleware": "^2.0.7",
+    "http-proxy-middleware": "^2.0.9",
     "http-terminator": "^3.2.0",
-    "isbot": "^5.1.22",
+    "isbot": "^5.1.28",
     "js-cookie": "2.2.1",
     "js-yaml": "^4.1.0",
     "json5": "^2.2.3",
@@ -116,8 +116,8 @@
     "nouislider": "^15.8.1",
     "pem": "1.14.8",
     "reflect-metadata": "^0.2.2",
-    "rxjs": "^7.8.0",
-    "sanitize-html": "^2.14.0",
+    "rxjs": "^7.8.2",
+    "sanitize-html": "^2.17.0",
     "sortablejs": "1.15.6",
     "uuid": "^8.3.2",
     "zone.js": "~0.13.3"
@@ -146,12 +146,12 @@
     "@types/grecaptcha": "^3.0.9",
     "@types/jasmine": "~3.6.0",
     "@types/js-cookie": "2.2.6",
-    "@types/lodash": "^4.17.15",
+    "@types/lodash": "^4.17.17",
     "@types/node": "^14.18.63",
-    "@types/sanitize-html": "^2.13.0",
+    "@types/sanitize-html": "^2.16.0",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
-    "axe-core": "^4.10.2",
+    "axe-core": "^4.10.3",
     "compression-webpack-plugin": "^9.2.0",
     "copy-webpack-plugin": "^6.4.1",
     "cross-env": "^7.0.3",
@@ -163,7 +163,7 @@
     "eslint-plugin-deprecation": "^1.5.0",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsdoc": "^45.0.0",
-    "eslint-plugin-jsonc": "^2.19.1",
+    "eslint-plugin-jsonc": "^2.20.1",
     "eslint-plugin-lodash": "^7.4.0",
     "eslint-plugin-unused-imports": "^2.0.0",
     "express-static-gzip": "^2.2.0",
@@ -175,7 +175,7 @@
     "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
     "karma-mocha-reporter": "2.2.5",
-    "ng-mocks": "^14.13.2",
+    "ng-mocks": "^14.13.5",
     "ngx-mask": "^13.1.7",
     "nodemon": "^2.0.22",
     "postcss": "^8.5",
@@ -187,7 +187,7 @@
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^16.14.0",
     "rimraf": "^3.0.2",
-    "sass": "~1.84.0",
+    "sass": "~1.89.1",
     "sass-loader": "^12.6.0",
     "sass-resources-loader": "^2.2.5",
     "ts-node": "^8.10.2",

server.ts

@@ -55,6 +55,7 @@ import { APP_CONFIG, AppConfig } from './src/config/app-config.interface';
 import { extendEnvironmentWithAppConfig } from './src/config/config.util';
 import { logStartupMessage } from './startup-message';
 import { TOKENITEM } from './src/app/core/auth/models/auth-token-info.model';
+import { SsrExcludePatterns } from './src/config/universal-config.interface';
 
 
 /*
@@ -241,7 +242,7 @@ export function app() {
  * The callback function to serve server side angular
  */
 function ngApp(req, res) {
-  if (environment.universal.preboot && req.method === 'GET' && (req.path === '/' || environment.universal.paths.some(pathPrefix => req.path.startsWith(pathPrefix)))) {
+  if (environment.universal.preboot && req.method === 'GET' && (req.path === '/' || !isExcludedFromSsr(req.path, environment.universal.excludePathPatterns))) {
     // Render the page to user via SSR (server side rendering)
     serverSideRender(req, res);
   } else {
@@ -625,6 +626,21 @@ function start() {
   }
 }
 
+/**
+ * Check if SSR should be skipped for path
+ *
+ * @param path
+ * @param excludePathPattern
+ */
+function isExcludedFromSsr(path: string, excludePathPattern: SsrExcludePatterns[]): boolean {
+  const patterns = excludePathPattern.map(p =>
+    new RegExp(p.pattern, p.flag || '')
+  );
+  return patterns.some((regex) => {
+    return regex.test(path)
+  });
+}
+
 /*
  * The callback function to serve health check requests
  */

src/app/access-control/bulk-access/bulk-access.component.spec.ts

@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { NO_ERRORS_SCHEMA, Component } from '@angular/core';
 
 import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
@@ -57,10 +57,15 @@ describe('BulkAccessComponent', () => {
     'file': {  }
   };
 
-  const mockSettings: any = jasmine.createSpyObj('AccessControlFormContainerComponent',  {
-    getValue: jasmine.createSpy('getValue'),
-    reset: jasmine.createSpy('reset')
-  });
+  @Component({
+    selector: 'ds-bulk-access-settings',
+    template: ''
+  })
+  class MockBulkAccessSettingsComponent {
+    isFormValid = jasmine.createSpy('isFormValid').and.returnValue(false);
+    getValue = jasmine.createSpy('getValue');
+    reset = jasmine.createSpy('reset');
+  }
   const selection: any[] = [{ indexableObject: { uuid: '1234' } }, { indexableObject: { uuid: '5678' } }];
   const selectableListState: SelectableListState = { id: 'test', selection };
   const expectedIdList = ['1234', '5678'];
@@ -73,7 +78,10 @@ describe('BulkAccessComponent', () => {
         RouterTestingModule,
         TranslateModule.forRoot()
       ],
-      declarations: [ BulkAccessComponent ],
+      declarations: [
+        BulkAccessComponent,
+        MockBulkAccessSettingsComponent,
+      ],
       providers: [
         { provide: BulkAccessControlService, useValue: bulkAccessControlServiceMock },
         { provide: NotificationsService, useValue: NotificationsServiceStub },
@@ -102,7 +110,6 @@ describe('BulkAccessComponent', () => {
 
       (component as any).selectableListService.getSelectableList.and.returnValue(of(selectableListStateEmpty));
       fixture.detectChanges();
-      component.settings = mockSettings;
     });
 
     it('should create', () => {
@@ -119,13 +126,12 @@ describe('BulkAccessComponent', () => {
 
   });
 
-  describe('when there are elements selected', () => {
+  describe('when there are elements selected and step two form is invalid', () => {
 
     beforeEach(() => {
 
       (component as any).selectableListService.getSelectableList.and.returnValue(of(selectableListState));
       fixture.detectChanges();
-      component.settings = mockSettings;
     });
 
     it('should create', () => {
@@ -136,9 +142,9 @@ describe('BulkAccessComponent', () => {
       expect(component.objectsSelected$.value).toEqual(expectedIdList);
     });
 
-    it('should enable the execute button when there are objects selected', () => {
+    it('should not enable the execute button when there are objects selected and step two form is invalid', () => {
       component.objectsSelected$.next(['1234']);
-      expect(component.canExport()).toBe(true);
+      expect(component.canExport()).toBe(false);
     });
 
     it('should call the settings reset method when reset is called', () => {
@@ -146,6 +152,23 @@ describe('BulkAccessComponent', () => {
       expect(component.settings.reset).toHaveBeenCalled();
     });
 
+
+  });
+
+  describe('when there are elements selectedted and the step two form is valid', () => {
+
+    beforeEach(() => {
+
+      (component as any).selectableListService.getSelectableList.and.returnValue(of(selectableListState));
+      fixture.detectChanges();
+      (component as any).settings.isFormValid.and.returnValue(true);
+    });
+
+    it('should enable the execute button when there are objects selected and step two form is valid', () => {
+      component.objectsSelected$.next(['1234']);
+      expect(component.canExport()).toBe(true);
+    });
+
     it('should call the bulkAccessControlService executeScript method when submit is called', () => {
       (component.settings as any).getValue.and.returnValue(mockFormState);
       bulkAccessControlService.createPayloadFile.and.returnValue(mockFile);

src/app/access-control/bulk-access/bulk-access.component.ts

@@ -37,7 +37,7 @@ export class BulkAccessComponent implements OnInit {
 
   constructor(
     private bulkAccessControlService: BulkAccessControlService,
-    private selectableListService: SelectableListService
+    private selectableListService: SelectableListService,
   ) {
   }
 
@@ -51,7 +51,7 @@ export class BulkAccessComponent implements OnInit {
   }
 
   canExport(): boolean {
-    return this.objectsSelected$.value?.length > 0;
+    return this.objectsSelected$.value?.length > 0 && this.settings?.isFormValid();
   }
 
   /**

src/app/access-control/bulk-access/settings/bulk-access-settings.component.ts

@@ -31,4 +31,8 @@ export class BulkAccessSettingsComponent {
     this.controlForm.reset();
   }
 
+  isFormValid() {
+    return this.controlForm.isValid();
+  }
+
 }

src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.html

@@ -1,4 +1,4 @@
-<div *ngIf="registryService.getActiveMetadataField() | async; then editheader; else createHeader"></div>
+<div *ngIf="activeMetadataField$ | async; then editheader; else createHeader"></div>
 
 <ng-template #createHeader>
     <h2>{{messagePrefix + '.create' | translate}}</h2>

src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.ts

@@ -11,7 +11,7 @@ import { RegistryService } from '../../../../core/registry/registry.service';
 import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service';
 import { take } from 'rxjs/operators';
 import { TranslateService } from '@ngx-translate/core';
-import { combineLatest } from 'rxjs';
+import { Observable } from 'rxjs';
 import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model';
 import { MetadataField } from '../../../../core/metadata/metadata-field.model';
 
@@ -90,6 +90,8 @@ export class MetadataFieldFormComponent implements OnInit, OnDestroy {
    */
   @Output() submitForm: EventEmitter<any> = new EventEmitter();
 
+  activeMetadataField$: Observable<MetadataField>;
+
   constructor(public registryService: RegistryService,
               private formBuilderService: FormBuilderService,
               private translateService: TranslateService) {
@@ -99,70 +101,64 @@ export class MetadataFieldFormComponent implements OnInit, OnDestroy {
    * Initialize the component, setting up the necessary Models for the dynamic form
    */
   ngOnInit() {
-    combineLatest([
-      this.translateService.get(`${this.messagePrefix}.element`),
-      this.translateService.get(`${this.messagePrefix}.qualifier`),
-      this.translateService.get(`${this.messagePrefix}.scopenote`)
-    ]).subscribe(([element, qualifier, scopenote]) => {
-      this.element = new DynamicInputModel({
-        id: 'element',
-        label: element,
-        name: 'element',
-        validators: {
-          required: null,
-          pattern: '^[^. ,]*$',
-          maxLength: 64,
-        },
-        required: true,
-        errorMessages: {
-          pattern: 'error.validation.metadata.element.invalid-pattern',
-          maxLength: 'error.validation.metadata.element.max-length',
-        },
-      });
-      this.qualifier = new DynamicInputModel({
-        id: 'qualifier',
-        label: qualifier,
-        name: 'qualifier',
-        validators: {
-          pattern: '^[^. ,]*$',
-          maxLength: 64,
-        },
-        required: false,
-        errorMessages: {
-          pattern: 'error.validation.metadata.qualifier.invalid-pattern',
-          maxLength: 'error.validation.metadata.qualifier.max-length',
-        },
-      });
-      this.scopeNote = new DynamicTextAreaModel({
-        id: 'scopeNote',
-        label: scopenote,
-        name: 'scopeNote',
-        required: false,
-        rows: 5,
-      });
-      this.formModel = [
-        new DynamicFormGroupModel(
-        {
-          id: 'metadatadatafieldgroup',
-          group:[this.element, this.qualifier, this.scopeNote]
-        })
-      ];
-      this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
-      this.registryService.getActiveMetadataField().subscribe((field: MetadataField): void => {
-        if (field == null) {
-          this.clearFields();
-        } else {
-          this.formGroup.patchValue({
-            metadatadatafieldgroup: {
-              element: field.element,
-              qualifier: field.qualifier,
-              scopeNote: field.scopeNote,
-            },
-          });
-          this.element.disabled = true;
-          this.qualifier.disabled = true;
-        }
-      });
+    this.element = new DynamicInputModel({
+      id: 'element',
+      label: this.translateService.instant(`${this.messagePrefix}.element`),
+      name: 'element',
+      validators: {
+        required: null,
+        pattern: '^[^. ,]*$',
+        maxLength: 64,
+      },
+      required: true,
+      errorMessages: {
+        pattern: 'error.validation.metadata.element.invalid-pattern',
+        maxLength: 'error.validation.metadata.element.max-length',
+      },
+    });
+    this.qualifier = new DynamicInputModel({
+      id: 'qualifier',
+      label: this.translateService.instant(`${this.messagePrefix}.qualifier`),
+      name: 'qualifier',
+      validators: {
+        pattern: '^[^. ,]*$',
+        maxLength: 64,
+      },
+      required: false,
+      errorMessages: {
+        pattern: 'error.validation.metadata.qualifier.invalid-pattern',
+        maxLength: 'error.validation.metadata.qualifier.max-length',
+      },
+    });
+    this.scopeNote = new DynamicTextAreaModel({
+      id: 'scopeNote',
+      label: this.translateService.instant(`${this.messagePrefix}.scopenote`),
+      name: 'scopeNote',
+      required: false,
+      rows: 5,
+    });
+    this.formModel = [
+      new DynamicFormGroupModel(
+      {
+        id: 'metadatadatafieldgroup',
+        group:[this.element, this.qualifier, this.scopeNote]
+      })
+    ];
+    this.formGroup = this.formBuilderService.createFormGroup(this.formModel);
+    this.registryService.getActiveMetadataField().subscribe((field: MetadataField): void => {
+      if (field == null) {
+        this.clearFields();
+      } else {
+        this.formGroup.patchValue({
+          metadatadatafieldgroup: {
+            element: field.element,
+            qualifier: field.qualifier,
+            scopeNote: field.scopeNote,
+          },
+        });
+        this.element.disabled = true;
+        this.qualifier.disabled = true;
+      }
     });
   }
 

src/app/admin/admin-routing.module.ts

@@ -1,13 +1,13 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { MetadataImportPageComponent } from './admin-import-metadata-page/metadata-import-page.component';
-import { AdminSearchPageComponent } from './admin-search-page/admin-search-page.component';
+import { ThemedAdminSearchPageComponent } from './admin-search-page/themed-admin-search-page.component';
 import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.resolver';
-import { AdminWorkflowPageComponent } from './admin-workflow-page/admin-workflow-page.component';
 import { I18nBreadcrumbsService } from '../core/breadcrumbs/i18n-breadcrumbs.service';
 import { AdminCurationTasksComponent } from './admin-curation-tasks/admin-curation-tasks.component';
 import { REGISTRIES_MODULE_PATH } from './admin-routing-paths';
 import { BatchImportPageComponent } from './admin-import-batch-page/batch-import-page.component';
+import { ThemedAdminWorkflowPageComponent } from './admin-workflow-page/themed-admin-workflow-page.component';
 
 @NgModule({
   imports: [
@@ -20,13 +20,13 @@ import { BatchImportPageComponent } from './admin-import-batch-page/batch-import
       {
         path: 'search',
         resolve: { breadcrumb: I18nBreadcrumbResolver },
-        component: AdminSearchPageComponent,
+        component: ThemedAdminSearchPageComponent,
         data: { title: 'admin.search.title', breadcrumbKey: 'admin.search' }
       },
       {
         path: 'workflow',
         resolve: { breadcrumb: I18nBreadcrumbResolver },
-        component: AdminWorkflowPageComponent,
+        component: ThemedAdminWorkflowPageComponent,
         data: { title: 'admin.workflow.title', breadcrumbKey: 'admin.workflow' }
       },
       {

src/app/admin/admin-search-page/admin-search.module.ts

@@ -1,5 +1,6 @@
 import { NgModule } from '@angular/core';
 import { SharedModule } from '../../shared/shared.module';
+import { ThemedAdminSearchPageComponent } from './themed-admin-search-page.component';
 import { AdminSearchPageComponent } from './admin-search-page.component';
 import { ItemAdminSearchResultListElementComponent } from './admin-search-results/admin-search-result-list-element/item-search-result/item-admin-search-result-list-element.component';
 import { CommunityAdminSearchResultListElementComponent } from './admin-search-results/admin-search-result-list-element/community-search-result/community-admin-search-result-list-element.component';
@@ -31,6 +32,7 @@ const ENTRY_COMPONENTS = [
     ResearchEntitiesModule.withEntryComponents()
   ],
   declarations: [
+    ThemedAdminSearchPageComponent,
     AdminSearchPageComponent,
     ...ENTRY_COMPONENTS
   ]

src/app/admin/admin-search-page/themed-admin-search-page.component.ts

@@ -0,0 +1,26 @@
+import { Component } from '@angular/core';
+import { ThemedComponent } from '../../shared/theme-support/themed.component';
+import { AdminSearchPageComponent } from './admin-search-page.component';
+
+/**
+ * Themed wrapper for {@link AdminSearchPageComponent}
+ */
+@Component({
+  selector: 'ds-themed-admin-search-page',
+  templateUrl: '../../shared/theme-support/themed.component.html',
+})
+export class ThemedAdminSearchPageComponent extends ThemedComponent<AdminSearchPageComponent> {
+
+  protected getComponentName(): string {
+    return 'AdminSearchPageComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/admin/admin-search-page/admin-search-page.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./admin-search-page.component');
+  }
+
+}

src/app/admin/admin-workflow-page/admin-workflow.module.ts

@@ -27,6 +27,7 @@ import {
 import {
   SupervisionOrderStatusComponent
 } from './admin-workflow-search-results/actions/workspace-item/supervision-order-status/supervision-order-status.component';
+import { ThemedAdminWorkflowPageComponent } from './themed-admin-workflow-page.component';
 
 const ENTRY_COMPONENTS = [
   // put only entry components that use custom decorator
@@ -42,6 +43,7 @@ const ENTRY_COMPONENTS = [
     SharedModule.withEntryComponents()
   ],
   declarations: [
+    ThemedAdminWorkflowPageComponent,
     AdminWorkflowPageComponent,
     SupervisionOrderGroupSelectorComponent,
     SupervisionOrderStatusComponent,

src/app/admin/admin-workflow-page/themed-admin-workflow-page.component.ts

@@ -0,0 +1,26 @@
+import { Component } from '@angular/core';
+import { ThemedComponent } from '../../shared/theme-support/themed.component';
+import { AdminWorkflowPageComponent } from './admin-workflow-page.component';
+
+/**
+ * Themed wrapper for {@link AdminWorkflowPageComponent}
+ */
+@Component({
+  selector: 'ds-themed-admin-workflow-page',
+  templateUrl: '../../shared/theme-support/themed.component.html',
+})
+export class ThemedAdminWorkflowPageComponent extends ThemedComponent<AdminWorkflowPageComponent> {
+
+  protected getComponentName(): string {
+    return 'AdminWorkflowPageComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/admin/admin-workflow-page/admin-workflow-page.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./admin-workflow-page.component');
+  }
+
+}

src/app/app-routing.module.ts

@@ -40,6 +40,8 @@ import {
 import { ServerCheckGuard } from './core/server-check/server-check.guard';
 import { MenuResolver } from './menu.resolver';
 import { ThemedPageErrorComponent } from './page-error/themed-page-error.component';
+import { HomePageResolver } from './home-page/home-page.resolver';
+import { ViewTrackerResolverService } from './statistics/angulartics/dspace/view-tracker-resolver.service';
 
 @NgModule({
   imports: [
@@ -63,7 +65,15 @@ import { ThemedPageErrorComponent } from './page-error/themed-page-error.compone
             path: 'home',
             loadChildren: () => import('./home-page/home-page.module')
               .then((m) => m.HomePageModule),
-            data: { showBreadcrumbs: false },
+            data: {
+              showBreadcrumbs: false,
+              dsoPath: 'site'
+            },
+            resolve: {
+              site: HomePageResolver,
+              tracking: ViewTrackerResolverService,
+            },
+
             canActivate: [EndUserAgreementCurrentUserGuard]
           },
           {
@@ -251,6 +261,7 @@ import { ThemedPageErrorComponent } from './page-error/themed-page-error.compone
 })
   ],
   exports: [RouterModule],
+  providers: [HomePageResolver, ViewTrackerResolverService],
 })
 export class AppRoutingModule {
 

src/app/breadcrumbs/breadcrumbs.component.html

@@ -10,7 +10,7 @@
     </nav>
 
     <ng-template #breadcrumb let-text="text" let-url="url">
-        <li class="breadcrumb-item"><div class="breadcrumb-item-limiter"><a [routerLink]="url" class="text-truncate" [ngbTooltip]="text | translate" placement="bottom" >{{text | translate}}</a></div></li>
+        <li class="breadcrumb-item"><div class="breadcrumb-item-limiter"><a [routerLink]="url" class="text-truncate" [ngbTooltip]="text | translate" placement="bottom" role="link" tabindex="0">{{text | translate}}</a></div></li>
     </ng-template>
 
     <ng-template #activeBreadcrumb let-text="text">

src/app/browse-by/browse-by-taxonomy-page/browse-by-taxonomy-page.component.html

@@ -10,6 +10,8 @@
   <a class="btn btn-primary"
      [routerLink]="['/search']"
      [queryParams]="queryParams"
-     [queryParamsHandling]="'merge'">
+     [queryParamsHandling]="'merge'"
+     role="link"
+     tabindex="0">
     {{ 'browse.taxonomy.button' | translate }}</a>
 </div>

src/app/collection-page/collection-page-routing.module.ts

@@ -23,6 +23,7 @@ import { ThemedCollectionPageComponent } from './themed-collection-page.componen
 import { MenuItemType } from '../shared/menu/menu-item-type.model';
 import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
 import { CommunityBreadcrumbResolver } from '../core/breadcrumbs/community-breadcrumb.resolver';
+import { ViewTrackerResolverService } from '../statistics/angulartics/dspace/view-tracker-resolver.service';
 
 @NgModule({
   imports: [
@@ -86,6 +87,7 @@ import { CommunityBreadcrumbResolver } from '../core/breadcrumbs/community-bread
             pathMatch: 'full',
             resolve: {
               menu: DSOEditMenuResolver,
+              tracking: ViewTrackerResolverService,
             },
           }
         ],
@@ -116,6 +118,7 @@ import { CommunityBreadcrumbResolver } from '../core/breadcrumbs/community-bread
     CreateCollectionPageGuard,
     CollectionPageAdministratorGuard,
     CommunityBreadcrumbResolver,
+    ViewTrackerResolverService,
   ]
 })
 export class CollectionPageRoutingModule {

src/app/collection-page/collection-page.component.html

@@ -3,7 +3,6 @@
          *ngVar="(collectionRD$ | async) as collectionRD">
               <div *ngIf="collectionRD?.hasSucceeded" @fadeInOut>
                       <div *ngIf="collectionRD?.payload as collection">
-              <ds-view-tracker [object]="collection"></ds-view-tracker>
               <div class="d-flex flex-row border-bottom mb-4 pb-4">
                 <header class="comcol-header mr-auto">
                   <!-- Collection Name -->

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

@@ -9,7 +9,7 @@
       </span>
       <div class="align-middle pt-2">
         <button *ngIf="!(dataSource.loading$ | async)" (click)="getNextPage(node)"
-           class="btn btn-outline-primary btn-sm" role="button">
+           class="btn btn-outline-primary btn-sm" role="button" tabindex="0">
            <i class="fas fa-angle-down"></i> {{ 'communityList.showMore' | translate }}
         </button>
         <ds-themed-loading *ngIf="node===loadingNode && dataSource.loading$ | async" class="ds-themed-loading"></ds-themed-loading>
@@ -27,7 +27,11 @@
       <button *ngIf="hasChild(null, node) | async" type="button" class="btn btn-default" cdkTreeNodeToggle
               [attr.aria-label]="(node.isExpanded ? 'communityList.collapse' : 'communityList.expand') | translate:{ name: dsoNameService.getName(node.payload) }"
               (click)="toggleExpanded(node)"
-              data-test="expand-button">
+              data-test="expand-button"
+              (keyup.enter)="toggleExpanded(node)"
+              (keyup.space)="toggleExpanded(node)"
+              role="button"
+              tabindex="0">
         <span class="{{node.isExpanded ? 'fa fa-chevron-down' : 'fa fa-chevron-right'}}"
               aria-hidden="true"></span>
         <span class="sr-only">{{ (node.isExpanded ? 'communityList.collapse' : 'communityList.expand') | translate:{ name: dsoNameService.getName(node.payload) } }}</span>
@@ -38,7 +42,7 @@
       </span>
       <div class="d-flex flex-row">
         <span class="align-middle pt-2 lead">
-          <a [routerLink]="node.route" class="lead">{{ dsoNameService.getName(node.payload) }}</a>
+          <a [routerLink]="node.route" class="lead" role="link" tabindex="0">{{ dsoNameService.getName(node.payload) }}</a>
           <span class="pr-2">&nbsp;</span>
           <span *ngIf="node.payload.archivedItemsCount >= 0" class="badge badge-pill badge-secondary align-top archived-items-lead">{{node.payload.archivedItemsCount}}</span>
         </span>
@@ -72,7 +76,7 @@
         <span class="fa fa-chevron-right"></span>
       </span>
       <h6 class="align-middle pt-2">
-        <a [routerLink]="node.route" class="lead">{{ dsoNameService.getName(node.payload) }}</a>
+        <a [routerLink]="node.route" class="lead" role="link" tabindex="0">{{ dsoNameService.getName(node.payload) }}</a>
       </h6>
     </div>
     <ds-truncatable [id]="node.id">

src/app/community-page/community-page-routing.module.ts

@@ -16,6 +16,7 @@ import { ThemedCommunityPageComponent } from './themed-community-page.component'
 import { MenuItemType } from '../shared/menu/menu-item-type.model';
 import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
 import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.resolver';
+import { ViewTrackerResolverService } from '../statistics/angulartics/dspace/view-tracker-resolver.service';
 
 @NgModule({
   imports: [
@@ -69,6 +70,7 @@ import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.reso
             pathMatch: 'full',
             resolve: {
               menu: DSOEditMenuResolver,
+              tracking: ViewTrackerResolverService,
             },
           }
         ],
@@ -97,6 +99,7 @@ import { I18nBreadcrumbResolver } from '../core/breadcrumbs/i18n-breadcrumb.reso
     LinkService,
     CreateCommunityPageGuard,
     CommunityPageAdministratorGuard,
+    ViewTrackerResolverService,
   ]
 })
 export class CommunityPageRoutingModule {

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

@@ -1,7 +1,6 @@
 <div class="container" *ngVar="(communityRD$ | async) as communityRD">
   <div class="community-page" *ngIf="communityRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="communityRD?.payload; let communityPayload">
-      <ds-view-tracker [object]="communityPayload"></ds-view-tracker>
       <div class="d-flex flex-row border-bottom mb-4 pb-4">
         <header class="comcol-header mr-auto">
           <!-- Community name -->

src/app/core/auth/auth.service.spec.ts

@@ -260,7 +260,7 @@ describe('AuthService test', () => {
           (state as any).core = Object.create({});
           (state as any).core.auth = authenticatedState;
         });
-      authService = new AuthService({}, window, undefined, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
+      authService = new AuthService(window, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
     }));
 
     it('should return true when user is logged in', () => {
@@ -345,7 +345,7 @@ describe('AuthService test', () => {
           (state as any).core = Object.create({});
           (state as any).core.auth = authenticatedState;
         });
-      authService = new AuthService({}, window, undefined, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
+      authService = new AuthService(window, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
       storage = (authService as any).storage;
       routeServiceMock = TestBed.inject(RouteService);
       routerStub = TestBed.inject(Router);
@@ -565,7 +565,7 @@ describe('AuthService test', () => {
           (state as any).core = Object.create({});
           (state as any).core.auth = unAuthenticatedState;
         });
-      authService = new AuthService({}, window, undefined, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
+      authService = new AuthService(window, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
     }));
 
     it('should return null for the shortlived token', () => {
@@ -605,7 +605,7 @@ describe('AuthService test', () => {
           (state as any).core = Object.create({});
           (state as any).core.auth = idleState;
         });
-      authService = new AuthService({}, window, undefined, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
+      authService = new AuthService(window, authReqService, mockEpersonDataService, router, routeService, cookieService, store, hardRedirectService, notificationsService, translateService);
     }));
 
     it('isUserIdle should return true when user is not idle', () => {

src/app/core/auth/auth.service.ts

@@ -1,7 +1,6 @@
-import { Inject, Injectable, Optional } from '@angular/core';
+import { Inject, Injectable } from '@angular/core';
 import { Router } from '@angular/router';
 import { HttpHeaders } from '@angular/common/http';
-import { REQUEST, RESPONSE } from '@nguniversal/express-engine/tokens';
 
 import { Observable, of as observableOf } from 'rxjs';
 import { filter, map, startWith, switchMap, take } from 'rxjs/operators';
@@ -83,18 +82,17 @@ export class AuthService {
    */
   private tokenRefreshTimer;
 
-  constructor(@Inject(REQUEST) protected req: any,
-              @Inject(NativeWindowService) protected _window: NativeWindowRef,
-              @Optional() @Inject(RESPONSE) private response: any,
-              protected authRequestService: AuthRequestService,
-              protected epersonService: EPersonDataService,
-              protected router: Router,
-              protected routeService: RouteService,
-              protected storage: CookieService,
-              protected store: Store<AppState>,
-              protected hardRedirectService: HardRedirectService,
-              private notificationService: NotificationsService,
-              private translateService: TranslateService
+  constructor(
+    @Inject(NativeWindowService) protected _window: NativeWindowRef,
+    protected authRequestService: AuthRequestService,
+    protected epersonService: EPersonDataService,
+    protected router: Router,
+    protected routeService: RouteService,
+    protected storage: CookieService,
+    protected store: Store<AppState>,
+    protected hardRedirectService: HardRedirectService,
+    protected notificationService: NotificationsService,
+    protected translateService: TranslateService
   ) {
     this.store.pipe(
       // when this service is constructed the store is not fully initialized yet
@@ -494,10 +492,6 @@ export class AuthService {
     if (this._window.nativeWindow.location) {
       // Hard redirect to login page, so that all state is definitely lost
       this._window.nativeWindow.location.href = redirectUrl;
-    } else if (this.response) {
-      if (!this.response._headerSent) {
-        this.response.redirect(302, redirectUrl);
-      }
     } else {
       this.router.navigateByUrl(redirectUrl);
     }

src/app/core/auth/server-auth.service.ts

@@ -1,15 +1,25 @@
-import { Injectable } from '@angular/core';
+import { Injectable, Inject, Optional } from '@angular/core';
 import { HttpHeaders } from '@angular/common/http';
-
+import { REQUEST, RESPONSE } from '@nguniversal/express-engine/tokens';
 import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
-
 import { hasValue, isNotEmpty } from '../../shared/empty.util';
 import { HttpOptions } from '../dspace-rest/dspace-rest.service';
-import { AuthService } from './auth.service';
+import { AuthService, LOGIN_ROUTE } from './auth.service';
 import { AuthStatus } from './models/auth-status.model';
 import { AuthTokenInfo } from './models/auth-token-info.model';
 import { RemoteData } from '../data/remote-data';
+import { NativeWindowService, NativeWindowRef } from '../services/window.service';
+import { AuthRequestService } from './auth-request.service';
+import { EPersonDataService } from '../eperson/eperson-data.service';
+import { Router } from '@angular/router';
+import { RouteService } from '../services/route.service';
+import { CookieService } from '../services/cookie.service';
+import { Store } from '@ngrx/store';
+import { AppState } from '../../app.reducer';
+import { HardRedirectService } from '../services/hard-redirect.service';
+import { NotificationsService } from '../../shared/notifications/notifications.service';
+import { TranslateService } from '@ngx-translate/core';
 
 /**
  * The auth service.
@@ -17,6 +27,34 @@ import { RemoteData } from '../data/remote-data';
 @Injectable()
 export class ServerAuthService extends AuthService {
 
+  constructor(
+    @Inject(REQUEST) protected req: any,
+    @Optional() @Inject(RESPONSE) private response: any,
+    @Inject(NativeWindowService) protected _window: NativeWindowRef,
+    protected authRequestService: AuthRequestService,
+    protected epersonService: EPersonDataService,
+    protected router: Router,
+    protected routeService: RouteService,
+    protected storage: CookieService,
+    protected store: Store<AppState>,
+    protected hardRedirectService: HardRedirectService,
+    protected notificationService: NotificationsService,
+    protected translateService: TranslateService
+  ) {
+    super(
+      _window,
+      authRequestService,
+      epersonService,
+      router,
+      routeService,
+      storage,
+      store,
+      hardRedirectService,
+      notificationService,
+      translateService
+    );
+  }
+
   /**
    * Returns the authenticated user
    * @returns {User}
@@ -60,4 +98,18 @@ export class ServerAuthService extends AuthService {
       map((rd: RemoteData<AuthStatus>) => Object.assign(new AuthStatus(), rd.payload))
     );
   }
+
+  override redirectToLoginWhenTokenExpired() {
+    const redirectUrl = LOGIN_ROUTE + '?expired=true';
+    if (this._window.nativeWindow.location) {
+      // Hard redirect to login page, so that all state is definitely lost
+      this._window.nativeWindow.location.href = redirectUrl;
+    } else if (this.response) {
+      if (!this.response._headerSent) {
+        this.response.redirect(302, redirectUrl);
+      }
+    } else {
+      this.router.navigateByUrl(redirectUrl);
+    }
+  }
 }

src/app/core/config/models/config-submission-section.model.ts

@@ -4,14 +4,7 @@ import { typedObject } from '../../cache/builders/build-decorators';
 import { HALLink } from '../../shared/hal-link.model';
 import { ConfigObject } from './config.model';
 import { SUBMISSION_SECTION_TYPE } from './config-type';
-
-/**
- * An interface that define section visibility and its properties.
- */
-export interface SubmissionSectionVisibility {
-  main: any;
-  other: any;
-}
+import { SectionScope, SectionVisibility } from '../../../submission/objects/section-visibility.model';
 
 @typedObject
 @inheritSerialization(ConfigObject)
@@ -30,6 +23,12 @@ export class SubmissionSectionModel extends ConfigObject {
   @autoserialize
   mandatory: boolean;
 
+  /**
+   * The submission scope for this section
+   */
+  @autoserialize
+  scope: SectionScope;
+
   /**
    * A string representing the kind of section object
    */
@@ -37,10 +36,10 @@ export class SubmissionSectionModel extends ConfigObject {
   sectionType: SectionsType;
 
   /**
-   * The [SubmissionSectionVisibility] object for this section
+   * The [SectionVisibility] object for this section
    */
   @autoserialize
-  visibility: SubmissionSectionVisibility;
+  visibility: SectionVisibility;
 
   /**
    * The {@link HALLink}s for this SubmissionSectionModel

src/app/core/data/bitstream-data.service.spec.ts

@@ -22,6 +22,8 @@ import objectContaining = jasmine.objectContaining;
 import { RemoteData } from './remote-data';
 import { FollowLinkConfig } from '../../shared/utils/follow-link-config.model';
 import { RequestParam } from '../cache/models/request-param.model';
+import { RestResponse } from '../cache/response.models';
+import { RequestEntry } from './request-entry.model';
 
 describe('BitstreamDataService', () => {
   let service: BitstreamDataService;
@@ -31,6 +33,7 @@ describe('BitstreamDataService', () => {
   let bitstreamFormatService: BitstreamFormatDataService;
   let rdbService: RemoteDataBuildService;
   const bitstreamFormatHref = 'rest-api/bitstreamformats';
+  let responseCacheEntry: RequestEntry;
 
   const bitstream1 = Object.assign(new Bitstream(), {
     id: 'fake-bitstream1',
@@ -55,8 +58,13 @@ describe('BitstreamDataService', () => {
   const url = 'fake-bitstream-url';
 
   beforeEach(() => {
+    responseCacheEntry = new RequestEntry();
+    responseCacheEntry.request = { href: 'https://rest.api/' } as any;
+    responseCacheEntry.response = new RestResponse(true, 200, 'Success');
+
     objectCache = jasmine.createSpyObj('objectCache', {
-      remove: jasmine.createSpy('remove')
+      remove: jasmine.createSpy('remove'),
+      getByHref: observableOf(responseCacheEntry),
     });
     requestService = getMockRequestService();
     halService = Object.assign(new HALEndpointServiceStub(url));

src/app/core/data/bitstream-data.service.ts

@@ -137,12 +137,25 @@ export class BitstreamDataService extends IdentifiableDataService<Bitstream> imp
       sendRequest(this.requestService),
       take(1)
     ).subscribe(() => {
-      this.requestService.removeByHrefSubstring(bitstream.self + '/format');
+      this.deleteFormatCache(bitstream);
     });
-
     return this.rdbService.buildFromRequestUUID(requestId);
   }
 
+  private deleteFormatCache(bitstream: Bitstream) {
+    const bitsreamFormatUrl = bitstream.self + '/format';
+    this.requestService.setStaleByHrefSubstring(bitsreamFormatUrl);
+    // Delete also cache by uuid as the format could be cached also there
+    this.objectCache.getByHref(bitsreamFormatUrl).pipe(take(1)).subscribe((cachedRequest) => {
+      if (cachedRequest.requestUUIDs && cachedRequest.requestUUIDs.length > 0){
+        const requestUuid = cachedRequest.requestUUIDs[0];
+        if (this.requestService.hasByUUID(requestUuid)) {
+          this.requestService.setStaleByUUID(requestUuid);
+        }
+      }
+    });
+  }
+
   /**
    * Returns an observable of {@link RemoteData} of a {@link Bitstream}, based on a handle and an
    * optional sequenceId or filename, with a list of {@link FollowLinkConfig}, to automatically

src/app/core/eperson/eperson-data.service.spec.ts

@@ -20,7 +20,7 @@ import { HALEndpointService } from '../shared/hal-endpoint.service';
 import { Item } from '../shared/item.model';
 import { EPersonDataService } from './eperson-data.service';
 import { EPerson } from './models/eperson.model';
-import { EPersonMock, EPersonMock2 } from '../../shared/testing/eperson.mock';
+import { EPersonMock, EPersonMock2, EPersonMockWithNoName } from '../../shared/testing/eperson.mock';
 import { HALEndpointServiceStub } from '../../shared/testing/hal-endpoint-service.stub';
 import { createNoContentRemoteDataObject$, createSuccessfulRemoteDataObject$ } from '../../shared/remote-data.utils';
 import { getMockRemoteDataBuildServiceHrefMap } from '../../shared/mocks/remote-data-build.service.mock';
@@ -279,6 +279,37 @@ describe('EPersonDataService', () => {
     });
   });
 
+  describe('updateEPerson with non existing metadata', () => {
+    beforeEach(() => {
+      spyOn(service, 'findByHref').and.returnValue(createSuccessfulRemoteDataObject$(EPersonMockWithNoName));
+    });
+    describe('add name that was not previously set', () => {
+      beforeEach(() => {
+        const changedEPerson = Object.assign(new EPerson(), {
+          id: EPersonMock.id,
+          metadata: Object.assign(EPersonMock.metadata, {
+            'eperson.firstname': [
+              {
+                language: null,
+                value: 'User',
+              },
+            ],
+          }),
+          email: EPersonMock.email,
+          canLogIn: EPersonMock.canLogIn,
+          requireCertificate: EPersonMock.requireCertificate,
+          _links: EPersonMock._links,
+        });
+        service.updateEPerson(changedEPerson).subscribe();
+      });
+      it('should send PatchRequest with add email operation', () => {
+        const operations = [{ op: 'add', path: '/eperson.firstname', value: [{ language: null, value: 'User' }] }];
+        const expected = new PatchRequest(requestService.generateRequestId(), epersonsEndpoint + '/' + EPersonMock.uuid, operations);
+        expect(requestService.send).toHaveBeenCalledWith(expected);
+      });
+    });
+  });
+
   describe('getActiveEPerson', () => {
     it('should retrieve the ePerson currently getting edited, if any', () => {
       service.editEPerson(EPersonMock);

src/app/core/eperson/eperson-data.service.ts

@@ -233,7 +233,8 @@ export class EPersonDataService extends IdentifiableDataService<EPerson> impleme
    * @param newEPerson
    */
   private generateOperations(oldEPerson: EPerson, newEPerson: EPerson): Operation[] {
-    let operations = this.comparator.diff(oldEPerson, newEPerson).filter((operation: Operation) => operation.op === 'replace');
+    let operations = this.comparator.diff(oldEPerson, newEPerson)
+      .filter((operation: Operation) => ['replace', 'add'].includes(operation.op));
     if (hasValue(oldEPerson.email) && oldEPerson.email !== newEPerson.email) {
       operations = [...operations, {
         op: 'replace', path: '/email', value: newEPerson.email

src/app/core/metadata/metadata.service.ts

@@ -161,6 +161,7 @@ export class MetadataService {
     this.setCitationKeywordsTag();
 
     this.setCitationAbstractUrlTag();
+    this.setCitationDoiTag();
     this.setCitationPdfUrlTag();
     this.setCitationPublisherTag();
 
@@ -173,7 +174,6 @@ export class MetadataService {
     // this.setCitationIssueTag();
     // this.setCitationFirstPageTag();
     // this.setCitationLastPageTag();
-    // this.setCitationDOITag();
     // this.setCitationPMIDTag();
 
     // this.setCitationFullTextTag();
@@ -294,6 +294,18 @@ export class MetadataService {
     }
   }
 
+  /**
+   * Add <meta name="citation_doi" ... >  to the <head>
+   */
+  private setCitationDoiTag(): void {
+    if (this.currentObject.value instanceof Item) {
+      let doi = this.getMetaTagValue('dc.identifier.doi');
+      if (hasValue(doi)) {
+        this.addMetaTag('citation_doi', doi);
+      }
+    }
+  }
+
   /**
    * Add <meta name="citation_pdf_url" ... >  to the <head>
    */

src/app/core/services/cookie.service.ts

@@ -1,7 +1,4 @@
-import { Inject, Injectable } from '@angular/core';
-
-import { REQUEST } from '@nguniversal/express-engine/tokens';
-
+import { Injectable } from '@angular/core';
 import { Subject ,  Observable } from 'rxjs';
 import { CookieAttributes } from 'js-cookie';
 
@@ -22,9 +19,6 @@ export abstract class CookieService implements ICookieService {
   protected readonly cookieSource = new Subject<{ readonly [key: string]: any }>();
   public readonly cookies$ = this.cookieSource.asObservable();
 
-  constructor(@Inject(REQUEST) protected req: any) {
-  }
-
   public abstract set(name: string, value: any, options?: CookieAttributes): void;
 
   public abstract remove(name: string, options?: CookieAttributes): void;

src/app/core/services/server-cookie.service.ts

@@ -1,10 +1,15 @@
-import { Injectable } from '@angular/core';
+import { Injectable, Inject } from '@angular/core';
 import { CookieAttributes } from 'js-cookie';
 import { CookieService, ICookieService } from './cookie.service';
+import { REQUEST } from '@nguniversal/express-engine/tokens';
 
 @Injectable()
 export class ServerCookieService extends CookieService implements ICookieService {
 
+  constructor(@Inject(REQUEST) protected req: any) {
+    super();
+  }
+
   public set(name: string, value: any, options?: CookieAttributes): void {
     return;
   }

src/app/core/submission/submission-rest.service.spec.ts

@@ -14,6 +14,8 @@ import {
   SubmissionRequest
 } from '../data/request.models';
 import { FormFieldMetadataValueObject } from '../../shared/form/builder/models/form-field-metadata-value.model';
+import { of } from 'rxjs';
+import { RequestEntry } from '../data/request-entry.model';
 
 describe('SubmissionRestService test suite', () => {
   let scheduler: TestScheduler;
@@ -38,7 +40,9 @@ describe('SubmissionRestService test suite', () => {
   }
 
   beforeEach(() => {
-    requestService = getMockRequestService();
+    requestService = getMockRequestService(of(Object.assign(new RequestEntry(), {
+      request: new SubmissionRequest('mock-request-uuid', 'mock-request-href'),
+    })));
     rdbService = getMockRemoteDataBuildService();
     scheduler = getTestScheduler();
     halService = new HALEndpointServiceStub(resourceEndpointURL);
@@ -62,7 +66,7 @@ describe('SubmissionRestService test suite', () => {
       scheduler.schedule(() => service.getDataById(resourceEndpoint, resourceScope).subscribe());
       scheduler.flush();
 
-      expect(requestService.send).toHaveBeenCalledWith(expected);
+      expect(requestService.send).toHaveBeenCalledWith(expected, false);
     });
   });
 

src/app/core/submission/submission-rest.service.ts

@@ -1,10 +1,10 @@
 import { Injectable } from '@angular/core';
 
-import { Observable } from 'rxjs';
-import { distinctUntilChanged, filter, map, mergeMap, tap } from 'rxjs/operators';
+import { Observable, skipWhile } from 'rxjs';
+import { distinctUntilChanged, filter, map, mergeMap, switchMap, tap } from 'rxjs/operators';
 
 import { RequestService } from '../data/request.service';
-import { hasValue, isNotEmpty } from '../../shared/empty.util';
+import { hasValue, hasValueOperator, isNotEmpty } from '../../shared/empty.util';
 import {
   DeleteRequest,
   PostRequest,
@@ -19,11 +19,25 @@ import { HALEndpointService } from '../shared/hal-endpoint.service';
 import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
 import { getFirstCompletedRemoteData } from '../shared/operators';
 import { URLCombiner } from '../url-combiner/url-combiner';
-import { ErrorResponse } from '../cache/response.models';
 import { RemoteData } from '../data/remote-data';
 import { SubmissionResponse } from './submission-response.model';
-import { RequestError } from '../data/request-error.model';
-import { RestRequest } from '../data/rest-request.model';
+
+/**
+ * Retrieve the first emitting payload's dataDefinition, or throw an error if the request failed
+ */
+export const getFirstDataDefinition = () =>
+  (source: Observable<RemoteData<SubmissionResponse>>): Observable<SubmitDataResponseDefinitionObject> =>
+    source.pipe(
+      getFirstCompletedRemoteData(),
+      map((response: RemoteData<SubmissionResponse>) => {
+        if (response.hasFailed) {
+          throw new Error(response.errorMessage);
+        } else {
+          return hasValue(response?.payload?.dataDefinition) ? response.payload.dataDefinition : [response.payload];
+        }
+      }),
+      distinctUntilChanged(),
+    );
 
 /**
  * The service handling all submission REST requests
@@ -48,15 +62,7 @@ export class SubmissionRestService {
    */
   protected fetchRequest(requestId: string): Observable<SubmitDataResponseDefinitionObject> {
     return this.rdbService.buildFromRequestUUID<SubmissionResponse>(requestId).pipe(
-      getFirstCompletedRemoteData(),
-      map((response: RemoteData<SubmissionResponse>) => {
-        if (response.hasFailed) {
-          throw new ErrorResponse({ statusText: response.errorMessage, statusCode: response.statusCode } as RequestError);
-        } else {
-          return hasValue(response.payload) ? response.payload.dataDefinition : response.payload;
-        }
-      }),
-      distinctUntilChanged()
+      getFirstDataDefinition(),
     );
   }
 
@@ -108,21 +114,52 @@ export class SubmissionRestService {
    *    The endpoint link name
    * @param id
    *    The submission Object to retrieve
+   * @param useCachedVersionIfAvailable
+   *    If this is true, the request will only be sent if there's no valid & cached version. Defaults to false
    * @return Observable<SubmitDataResponseDefinitionObject>
    *     server response
    */
-  public getDataById(linkName: string, id: string): Observable<SubmitDataResponseDefinitionObject> {
-    const requestId = this.requestService.generateRequestId();
+  public getDataById(linkName: string, id: string, useCachedVersionIfAvailable = false): Observable<SubmitDataResponseDefinitionObject> {
     return this.halService.getEndpoint(linkName).pipe(
       map((endpointURL: string) => this.getEndpointByIDHref(endpointURL, id)),
       filter((href: string) => isNotEmpty(href)),
       distinctUntilChanged(),
-      map((endpointURL: string) => new SubmissionRequest(requestId, endpointURL)),
-      tap((request: RestRequest) => {
-        this.requestService.send(request);
+      mergeMap((endpointURL: string) => {
+        this.sendGetDataRequest(endpointURL, useCachedVersionIfAvailable);
+        const startTime: number = new Date().getTime();
+        return this.requestService.getByHref(endpointURL).pipe(
+          map((requestEntry) => requestEntry?.request?.uuid),
+          hasValueOperator(),
+          distinctUntilChanged(),
+          switchMap((requestId) => this.rdbService.buildFromRequestUUID<SubmissionResponse>(requestId)),
+          // This skip ensures that if a stale object is present in the cache when you do a
+          // call it isn't immediately returned, but we wait until the remote data for the new request
+          // is created. If useCachedVersionIfAvailable is false it also ensures you don't get a
+          // cached completed object
+          skipWhile((rd: RemoteData<SubmissionResponse>) => rd.isStale || (!useCachedVersionIfAvailable && rd.lastUpdated < startTime)),
+          tap((rd: RemoteData<SubmissionResponse>) => {
+            if (hasValue(rd) && rd.isStale) {
+              this.sendGetDataRequest(endpointURL, useCachedVersionIfAvailable);
+            }
+          })
+        );
       }),
-      mergeMap(() => this.fetchRequest(requestId)),
-      distinctUntilChanged());
+      getFirstDataDefinition(),
+    );
+  }
+
+  /**
+   * Send a GET SubmissionRequest
+   *
+   * @param href
+   *    Endpoint URL of the submission data
+   * @param useCachedVersionIfAvailable
+   *    If this is true, the request will only be sent if there's no valid & cached version. Defaults to false
+   */
+  private sendGetDataRequest(href: string, useCachedVersionIfAvailable = false) {
+    const requestId = this.requestService.generateRequestId();
+    const request = new SubmissionRequest(requestId, href);
+    this.requestService.send(request, useCachedVersionIfAvailable);
   }
 
   /**

src/app/dso-shared/dso-edit-metadata/metadata-field-selector/metadata-field-selector.component.spec.ts

@@ -106,6 +106,14 @@ describe('MetadataFieldSelectorComponent', () => {
       });
     });
 
+    it('should sort the fields by name to ensure the one without a qualifier is first', () => {
+      component.mdField = 'dc.relation';
+
+      component.validate();
+
+      expect(registryService.queryMetadataFields).toHaveBeenCalledWith('dc.relation', { elementsPerPage: 10, sort: new SortOptions('fieldName', SortDirection.ASC) }, true, false, followLink('schema'));
+    });
+
     describe('when querying the metadata fields returns an error response', () => {
       beforeEach(() => {
         (registryService.queryMetadataFields as jasmine.Spy).and.returnValue(createFailedRemoteDataObject$('Failed'));

src/app/dso-shared/dso-edit-metadata/metadata-field-selector/metadata-field-selector.component.ts

@@ -29,6 +29,7 @@ import { hasValue } from '../../../shared/empty.util';
 import { NotificationsService } from '../../../shared/notifications/notifications.service';
 import { TranslateService } from '@ngx-translate/core';
 import { SortDirection, SortOptions } from '../../../core/cache/models/sort-options.model';
+import { FindListOptions } from '../../../core/data/find-list-options.model';
 
 @Component({
   selector: 'ds-metadata-field-selector',
@@ -100,6 +101,11 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
    */
   showInvalid = false;
 
+  searchOptions: FindListOptions = {
+    elementsPerPage: 10,
+    sort: new SortOptions('fieldName', SortDirection.ASC),
+  };
+
   /**
    * Subscriptions to unsubscribe from on destroy
    */
@@ -182,7 +188,7 @@ export class MetadataFieldSelectorComponent implements OnInit, OnDestroy, AfterV
    * Upon subscribing to the returned observable, the showInvalid flag is updated accordingly to show the feedback under the input
    */
   validate(): Observable<boolean> {
-    return this.registryService.queryMetadataFields(this.mdField, null, true, false, followLink('schema')).pipe(
+    return this.registryService.queryMetadataFields(this.mdField, this.searchOptions, true, false, followLink('schema')).pipe(
       getFirstCompletedRemoteData(),
       switchMap((rd) => {
         if (rd.hasSucceeded) {

src/app/entity-groups/journal-entities/item-grid-elements/search-result-grid-elements/journal-issue/journal-issue-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -37,7 +37,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="link" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/journal-entities/item-grid-elements/search-result-grid-elements/journal-volume/journal-volume-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -37,7 +37,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="link" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/journal-entities/item-grid-elements/search-result-grid-elements/journal/journal-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -41,7 +41,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="link" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/journal-entities/item-list-elements/search-result-list-elements/journal-issue/journal-issue-search-result-list-element.component.html

@@ -2,7 +2,7 @@
   <div *ngIf="showThumbnails" class="col-3 col-md-2">
     <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out">
+       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out" role="link" tabindex="0">
       <ds-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="true">
       </ds-thumbnail>
     </a>
@@ -17,7 +17,7 @@
       <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
          [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
          [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out"
-         [innerHTML]="dsoTitle"></a>
+         [innerHTML]="dsoTitle" role="link" tabindex="0"></a>
       <span *ngIf="linkType == linkTypes.None"
             class="lead item-list-title dont-break-out"
             [innerHTML]="dsoTitle"></span>

src/app/entity-groups/journal-entities/item-list-elements/search-result-list-elements/journal-volume/journal-volume-search-result-list-element.component.html

@@ -2,7 +2,7 @@
   <div *ngIf="showThumbnails" class="col-3 col-md-2">
     <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out">
+       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out" role="link" tabindex="0">
       <ds-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="true">
       </ds-thumbnail>
     </a>
@@ -17,7 +17,7 @@
       <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
          [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
          [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out"
-         [innerHTML]="dsoTitle"></a>
+         [innerHTML]="dsoTitle" role="link" tabindex="0"></a>
       <span *ngIf="linkType == linkTypes.None"
             class="lead item-list-title dont-break-out"
             [innerHTML]="dsoTitle"></span>

src/app/entity-groups/journal-entities/item-list-elements/search-result-list-elements/journal/journal-search-result-list-element.component.html

@@ -1,7 +1,7 @@
 <div class="row">
   <div *ngIf="showThumbnails" class="col-3 col-md-2">
     <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out">
+       [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out" role="link" tabindex="0">
       <ds-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="true">
       </ds-thumbnail>
     </a>
@@ -15,7 +15,7 @@
     <ds-truncatable [id]="dso.id">
       <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
          [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out"
-         [innerHTML]="dsoTitle"></a>
+         [innerHTML]="dsoTitle" role="link" tabindex="0"></a>
       <span *ngIf="linkType == linkTypes.None"
             class="lead item-list-title dont-break-out"
             [innerHTML]="dsoTitle"></span>

src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html

@@ -51,7 +51,7 @@
       [label]="'journalissue.page.keyword'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html

@@ -34,7 +34,7 @@
       [label]="'journalvolume.page.description'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html

@@ -33,7 +33,7 @@
       [label]="'journal.page.description'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/entity-groups/research-entities/item-grid-elements/search-result-grid-elements/org-unit/org-unit-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -43,7 +43,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="button" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/research-entities/item-grid-elements/search-result-grid-elements/person/person-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -36,7 +36,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="button" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/research-entities/item-grid-elements/search-result-grid-elements/project/project-search-result-grid-element.component.html

@@ -6,7 +6,7 @@
     <a *ngIf="linkType != linkTypes.None"
        [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate">
+       class="card-img-top full-width" [attr.title]="'search.results.view-result' | translate" role="link" tabindex="0">
       <div>
         <ds-themed-thumbnail [thumbnail]="dso?.thumbnail | async" [limitWidth]="false">
         </ds-themed-thumbnail>
@@ -31,7 +31,7 @@
       <div *ngIf="linkType != linkTypes.None" class="text-center">
         <a [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="[itemPageRoute]"
-           class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
+           class="lead btn btn-primary viewButton" role="button" tabindex="0">{{ 'search.results.view-result' | translate}}</a>
       </div>
     </div>
   </ds-truncatable>

src/app/entity-groups/research-entities/item-list-elements/search-result-list-elements/org-unit/org-unit-search-result-list-element.component.html

@@ -2,7 +2,7 @@
     <div *ngIf="showThumbnails" class="col-3 col-md-2">
         <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
            [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-           [routerLink]="[itemPageRoute]" class="dont-break-out">
+           [routerLink]="[itemPageRoute]" class="dont-break-out" role="link" tabindex="0">
             <ds-thumbnail [thumbnail]="dso?.thumbnail | async"
                           [defaultImage]="'assets/images/orgunit-placeholder.svg'"
                           [alt]="'thumbnail.orgunit.alt'"
@@ -23,7 +23,7 @@
             <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
                [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
                [routerLink]="[itemPageRoute]" class="lead"
-               [innerHTML]="dsoTitle || ('orgunit.listelement.no-title' | translate)"></a>
+               [innerHTML]="dsoTitle || ('orgunit.listelement.no-title' | translate)" role="link" tabindex="0"></a>
             <span *ngIf="linkType == linkTypes.None"
                   class="lead"
                   [innerHTML]="dsoTitle || ('orgunit.listelement.no-title' | translate)"></span>

src/app/entity-groups/research-entities/item-list-elements/search-result-list-elements/person/person-search-result-list-element.component.html

@@ -2,7 +2,7 @@
   <div *ngIf="showThumbnails" class="col-3 col-md-2">
     <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-       [routerLink]="[itemPageRoute]" class="dont-break-out">
+       [routerLink]="[itemPageRoute]" class="dont-break-out" role="link" tabindex="0">
       <ds-thumbnail [thumbnail]="dso?.thumbnail | async"
                     [defaultImage]="'assets/images/person-placeholder.svg'"
                     [alt]="'thumbnail.person.alt'"
@@ -23,7 +23,7 @@
       <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
          [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
          [routerLink]="[itemPageRoute]" class="lead"
-         [innerHTML]="dsoTitle || ('person.listelement.no-title' | translate)"></a>
+         [innerHTML]="dsoTitle || ('person.listelement.no-title' | translate)" role="link" tabindex="0"></a>
       <span *ngIf="linkType == linkTypes.None"
             class="lead"
             [innerHTML]="dsoTitle || ('person.listelement.no-title' | translate)"></span>

src/app/entity-groups/research-entities/item-list-elements/search-result-list-elements/project/project-search-result-list-element.component.html

@@ -2,7 +2,7 @@
   <div *ngIf="showThumbnails" class="col-3 col-md-2">
     <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
        [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
-       [routerLink]="[itemPageRoute]" class="dont-break-out">
+       [routerLink]="[itemPageRoute]" class="dont-break-out" role="link" tabindex="0">
       <ds-thumbnail [thumbnail]="dso?.thumbnail | async"
                     [defaultImage]="'assets/images/project-placeholder.svg'"
                     [alt]="'thumbnail.project.alt'"
@@ -23,7 +23,7 @@
       <a *ngIf="linkType != linkTypes.None" [target]="(linkType == linkTypes.ExternalLink) ? '_blank' : '_self'"
          [attr.rel]="(linkType == linkTypes.ExternalLink) ? 'noopener noreferrer' : null"
          [routerLink]="[itemPageRoute]" class="lead item-list-title dont-break-out"
-         [innerHTML]="dsoTitle"></a>
+         [innerHTML]="dsoTitle" role="link" tabindex="0"></a>
       <span *ngIf="linkType == linkTypes.None"
             class="lead item-list-title dont-break-out"
             [innerHTML]="dsoTitle"></span>

src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html

@@ -42,7 +42,7 @@
       [label]="'orgunit.page.description'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/entity-groups/research-entities/item-pages/person/person.component.html

@@ -50,7 +50,7 @@
       [label]="'person.page.name'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/entity-groups/research-entities/item-pages/project/project.component.html

@@ -62,7 +62,7 @@
       [label]="'project.page.keyword'">
     </ds-generic-item-page-field>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/footer/footer.component.html

@@ -11,13 +11,13 @@
 
           <ul class="list-unstyled mb-0">
             <li>
-              <a routerLink="./" class="">Lorem ipsum</a>
+              <a routerLink="./" class="" role="link" tabindex="0">Lorem ipsum</a>
             </li>
             <li>
-              <a routerLink="./" class="">Ut facilisis</a>
+              <a routerLink="./" class="" role="link" tabindex="0">Ut facilisis</a>
             </li>
             <li>
-              <a routerLink="./" class="">Aenean sit</a>
+              <a routerLink="./" class="" role="link" tabindex="0">Aenean sit</a>
             </li>
           </ul>
         </div>
@@ -29,7 +29,7 @@
 
           <ul class="list-unstyled mb-0">
             <li>
-              <a routerLink="./" class="">Suspendisse potenti</a>
+              <a routerLink="./" class="" role="link" tabindex="0">Suspendisse potenti</a>
             </li>
           </ul>
         </div>
@@ -57,14 +57,14 @@
     <div class="content-container">
       <p class="m-0">
         <a class="text-white"
-           href="http://www.dspace.org/">{{ 'footer.link.dspace' | translate}}</a>
+           href="http://www.dspace.org/" role="link" tabindex="0">{{ 'footer.link.dspace' | translate}}</a>
         {{ 'footer.copyright' | translate:{year: dateObj | date:'y'} }}
         <a class="text-white"
-           href="https://www.lyrasis.org/">{{ 'footer.link.lyrasis' | translate}}</a>
+           href="https://www.lyrasis.org/" role="link" tabindex="0">{{ 'footer.link.lyrasis' | translate}}</a>
       </p>
       <ul class="footer-info list-unstyled d-flex justify-content-center mb-0">
         <li>
-          <button class="btn btn-link text-white" type="button" (click)="showCookieSettings()">
+          <button class="btn btn-link text-white" type="button" (click)="showCookieSettings()" role="button" tabindex="0">
             {{ 'footer.link.cookies' | translate}}
           </button>
         </li>
@@ -74,15 +74,15 @@
         </li>
         <li *ngIf="showPrivacyPolicy">
           <a class="btn text-white"
-             routerLink="info/privacy">{{ 'footer.link.privacy-policy' | translate}}</a>
+             routerLink="info/privacy" role="link" tabindex="0">{{ 'footer.link.privacy-policy' | translate}}</a>
         </li>
         <li *ngIf="showEndUserAgreement">
           <a class="btn text-white"
-             routerLink="info/end-user-agreement">{{ 'footer.link.end-user-agreement' | translate}}</a>
+             routerLink="info/end-user-agreement" role="link" tabindex="0">{{ 'footer.link.end-user-agreement' | translate}}</a>
         </li>
         <li *ngIf="showSendFeedback$ | async">
           <a class="btn text-white"
-             routerLink="info/feedback">{{ 'footer.link.feedback' | translate}}</a>
+             routerLink="info/feedback" role="link" tabindex="0">{{ 'footer.link.feedback' | translate}}</a>
         </li>
       </ul>
     </div>

src/app/header/header.component.html

@@ -1,7 +1,7 @@
 <header>
   <div class="container">
     <div class="d-flex flex-row justify-content-between">
-      <a class="navbar-brand my-2" routerLink="/home">
+      <a class="navbar-brand my-2" routerLink="/home" role="button" tabindex="0">
         <img src="assets/images/dspace-logo.svg" [attr.alt]="'menu.header.image.logo' | translate"/>
       </a>
 

src/app/home-page/home-news/home-news.component.html

@@ -14,7 +14,7 @@
       <li>issue permanent urls and trustworthy identifiers, including optional integrations with handle.net and DataCite DOI</li>
     </ul>
     <p>Join an international community of <a href="https://wiki.lyrasis.org/display/DSPACE/DSpace+Positioning"
-        target="_blank">leading institutions using DSpace</a>.
+        target="_blank" role="link" tabindex="0">leading institutions using DSpace</a>.
     </p>
   </div>
 </div>

src/app/home-page/home-page-routing.module.ts

@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 
-import { HomePageResolver } from './home-page.resolver';
 import { LinkMenuItemModel } from '../shared/menu/menu-item/models/link.model';
 import { ThemedHomePageComponent } from './themed-home-page.component';
 import { MenuItemType } from '../shared/menu/menu-item-type.model';
@@ -28,15 +27,9 @@ import { MenuItemType } from '../shared/menu/menu-item-type.model';
               } as LinkMenuItemModel,
             }],
           },
-        },
-        resolve: {
-          site: HomePageResolver
         }
       }
     ])
-  ],
-  providers: [
-    HomePageResolver
   ]
 })
 export class HomePageRoutingModule {

src/app/home-page/home-page.component.html

@@ -1,8 +1,5 @@
 <ds-themed-home-news></ds-themed-home-news>
 <div class="container">
-  <ng-container *ngIf="(site$ | async) as site">
-    <ds-view-tracker [object]="site"></ds-view-tracker>
-  </ng-container>
   <ds-themed-search-form [inPlaceSearch]="false" [searchPlaceholder]="'home.search-form.placeholder' | translate"></ds-themed-search-form>
   <ds-themed-top-level-community-list></ds-themed-top-level-community-list>
   <ds-recent-item-list *ngIf="recentSubmissionspageSize>0"></ds-recent-item-list>

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

@@ -6,7 +6,7 @@
                         <ds-listable-object-component-loader [object]="item" [viewMode]="viewMode" class="pb-4">
                         </ds-listable-object-component-loader>
                 </div>
-                <button (click)="onLoadMore()" class="btn btn-primary search-button mt-4"> {{'vocabulary-treeview.load-more' | translate }} ...</button>
+                <button (click)="onLoadMore()" class="btn btn-primary search-button mt-4" role="button" tabindex="0"> {{'vocabulary-treeview.load-more' | translate }} ...</button>
         </div>
         <ds-error *ngIf="itemRD?.hasFailed" message="{{'error.recent-submissions' | translate}}"></ds-error>
         <ds-loading *ngIf="!itemRD || itemRD.isLoading" message="{{'loading.recent-submissions' | translate}}">

src/app/item-page/alerts/item-alerts.component.html

@@ -6,7 +6,7 @@
         <ds-alert [type]="AlertTypeEnum.Warning">
             <div class="d-flex justify-content-between flex-wrap">
                 <span class="align-self-center">{{'item.alerts.withdrawn' | translate}}</span>
-                <a routerLink="/home" class="btn btn-primary btn-sm">{{"404.link.home-page" | translate}}</a>
+                <a routerLink="/home" class="btn btn-primary btn-sm" role="link" tabindex="0">{{"404.link.home-page" | translate}}</a>
             </div>
         </ds-alert>
     </div>

src/app/item-page/edit-item-page/edit-item-page.component.html

@@ -3,7 +3,7 @@
         <div class="col-12">
             <h1 class="border-bottom">{{'item.edit.head' | translate}}</h1>
             <div class="pt-2">
-                <ul class="nav nav-tabs justify-content-start" role="tablist">
+              <ul *ngIf="pages.length > 0" class="nav nav-tabs justify-content-start" role="tablist">
                     <li *ngFor="let page of pages" class="nav-item" role="presentation">
                         <a *ngIf="(page.enabled | async)"
                            [attr.aria-selected]="page.page === currentPage"

src/app/item-page/edit-item-page/item-authorizations/item-authorizations.component.html

@@ -1,9 +1,9 @@
 <div class="container">
-  <ds-alert [type]="'alert-info'" [content]="'item.edit.authorizations.heading'"></ds-alert>
-  <ds-resource-policies [resourceType]="'item'" [resourceName]="(getItemName() | async)"
-    [resourceUUID]="(getItemUUID() | async)">
+  <ds-alert [type]="AlertType.Info" [content]="'item.edit.authorizations.heading'"></ds-alert>
+  <ds-resource-policies [resourceType]="'item'" [resourceName]="itemName$ | async"
+    [resourceUUID]="(item$ | async)?.id">
   </ds-resource-policies>
-  <ng-container *ngFor="let bundle of (bundles$ | async); trackById">
+  <ng-container *ngFor="let bundle of (bundles$ | async)">
     <ds-resource-policies [resourceType]="'bundle'" [resourceUUID]="bundle.id" [resourceName]="bundle.name">
     </ds-resource-policies>
     <ng-container *ngIf="(bundleBitstreamsMap.get(bundle.id)?.bitstreams | async)?.length > 0">
@@ -16,7 +16,7 @@
         </div>
         <div class="card-body" [id]="bundle.id" [ngbCollapse]="bundleBitstreamsMap.get(bundle.id).isCollapsed">
           <ng-container
-            *ngFor="let bitstream of (bundleBitstreamsMap.get(bundle.id).bitstreams | async); trackById">
+            *ngFor="let bitstream of (bundleBitstreamsMap.get(bundle.id).bitstreams | async)">
             <ds-resource-policies [resourceType]="'bitstream'" [resourceUUID]="bitstream.id"
               [resourceName]="bitstream.name"></ds-resource-policies>
           </ng-container>

src/app/item-page/edit-item-page/item-authorizations/item-authorizations.component.spec.ts

@@ -147,17 +147,9 @@ describe('ItemAuthorizationsComponent test suite', () => {
       }));
     });
 
-    it('should get the item UUID', () => {
-
-      expect(comp.getItemUUID()).toBeObservable(cold('(a|)', {
-        a: item.id
-      }));
-
-    });
-
     it('should get the item\'s bundle', () => {
 
-      expect(comp.getItemBundles()).toBeObservable(cold('a', {
+      expect(comp.bundles$).toBeObservable(cold('a', {
         a: bundles
       }));
 

src/app/item-page/edit-item-page/item-authorizations/item-authorizations.component.ts

@@ -4,7 +4,7 @@ import { Component, OnDestroy, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
 import { BehaviorSubject, Observable, of as observableOf, Subscription } from 'rxjs';
-import { catchError, filter, first, map, mergeMap, take } from 'rxjs/operators';
+import { catchError, filter, map, mergeMap, take } from 'rxjs/operators';
 
 import { buildPaginatedList, PaginatedList } from '../../../core/data/paginated-list.model';
 import {
@@ -17,6 +17,7 @@ import { LinkService } from '../../../core/cache/builders/link.service';
 import { Bundle } from '../../../core/shared/bundle.model';
 import { hasValue, isNotEmpty } from '../../../shared/empty.util';
 import { Bitstream } from '../../../core/shared/bitstream.model';
+import { AlertType } from '../../../shared/alert/alert-type';
 
 /**
  * Interface for a bundle's bitstream map entry
@@ -52,7 +53,7 @@ export class ItemAuthorizationsComponent implements OnInit, OnDestroy {
    * The target editing item
    * @type {Observable<Item>}
    */
-  private item$: Observable<Item>;
+  item$: Observable<Item>;
 
   /**
    * Array to track all subscriptions and unsubscribe them onDestroy
@@ -91,16 +92,13 @@ export class ItemAuthorizationsComponent implements OnInit, OnDestroy {
    */
   private bitstreamPageSize = 4;
 
-  /**
-   * Initialize instance variables
-   *
-   * @param {LinkService} linkService
-   * @param {ActivatedRoute} route
-   * @param nameService
-   */
+  itemName$: Observable<string>;
+
+  readonly AlertType = AlertType;
+
   constructor(
-    private linkService: LinkService,
-    private route: ActivatedRoute,
+    protected linkService: LinkService,
+    protected route: ActivatedRoute,
     public nameService: DSONameService
   ) {
   }
@@ -109,37 +107,19 @@ export class ItemAuthorizationsComponent implements OnInit, OnDestroy {
    * Initialize the component, setting up the bundle and bitstream within the item
    */
   ngOnInit(): void {
-   this.getBundlesPerItem();
+    this.getBundlesPerItem();
+    this.itemName$ = this.getItemName();
   }
 
   /**
-   * Return the item's UUID
+   * Return the item's name
    */
-  getItemUUID(): Observable<string> {
-    return this.item$.pipe(
-      map((item: Item) => item.id),
-      first((UUID: string) => isNotEmpty(UUID))
-    );
-  }
-
-  /**
- * Return the item's name
- */
-  getItemName(): Observable<string> {
+  private getItemName(): Observable<string> {
     return this.item$.pipe(
       map((item: Item) => this.nameService.getName(item))
     );
   }
 
-  /**
-   * Return all item's bundles
-   *
-   * @return an observable that emits all item's bundles
-   */
-  getItemBundles(): Observable<Bundle[]> {
-    return this.bundles$.asObservable();
-  }
-
   /**
    * Get all bundles per item
    * and all the bitstreams per bundle

src/app/item-page/edit-item-page/item-bitstreams/item-bitstreams.component.ts

@@ -1,7 +1,7 @@
 import { ChangeDetectorRef, Component, NgZone, OnDestroy, HostListener } from '@angular/core';
 import { AbstractItemUpdateComponent } from '../abstract-item-update/abstract-item-update.component';
 import { map, switchMap, take } from 'rxjs/operators';
-import { Observable, Subscription, combineLatest, BehaviorSubject, tap } from 'rxjs';
+import { Observable, Subscription, combineLatest, BehaviorSubject } from 'rxjs';
 import { ItemDataService } from '../../../core/data/item-data.service';
 import { ObjectUpdatesService } from '../../../core/data/object-updates/object-updates.service';
 import { ActivatedRoute, Router } from '@angular/router';
@@ -187,15 +187,28 @@ export class ItemBitstreamsComponent extends AbstractItemUpdateComponent impleme
     this.itemService.getBundles(this.item.id, new PaginatedSearchOptions({pagination: this.bundlesOptions})).pipe(
       getFirstSucceededRemoteData(),
       getRemoteDataPayload(),
-      tap((bundlesPL: PaginatedList<Bundle>) =>
-        this.showLoadMoreLink$.next(bundlesPL.pageInfo.currentPage < bundlesPL.pageInfo.totalPages)
-      ),
-      map((bundlePage: PaginatedList<Bundle>) => bundlePage.page),
-    ).subscribe((bundles: Bundle[]) => {
-      this.bundlesSubject.next([...this.bundlesSubject.getValue(), ...bundles]);
+    ).subscribe((bundles: PaginatedList<Bundle>) => {
+      this.updateBundles(bundles);
     });
   }
 
+  /**
+   * Update the subject containing the bundles with the provided bundles.
+   * Also updates the showLoadMoreLink observable so it does not show up when it is no longer necessary.
+   */
+  updateBundles(newBundlesPL: PaginatedList<Bundle>) {
+    const currentBundles = this.bundlesSubject.getValue();
+
+    // Only add bundles to the bundle subject if they are not present yet
+    const bundlesToAdd = newBundlesPL.page
+      .filter(bundleToAdd => !currentBundles.some(currentBundle => currentBundle.id === bundleToAdd.id));
+
+    const updatedBundles = [...currentBundles, ...bundlesToAdd];
+
+    this.showLoadMoreLink$.next(updatedBundles.length < newBundlesPL.totalElements);
+    this.bundlesSubject.next(updatedBundles);
+  }
+
 
   /**
    * Submit the current changes

src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.ts

@@ -203,8 +203,8 @@ export class ItemEditBitstreamBundleComponent implements OnInit, OnDestroy {
           switchMap(() => this.bundleService.getBitstreams(
             this.bundle.id,
             paginatedOptions,
-            followLink('format')
-          ))
+            followLink('format'),
+          )),
         );
       }),
       getAllSucceededRemoteData(),

src/app/item-page/field-components/collections/collections.component.html

@@ -1,6 +1,6 @@
 <ds-metadata-field-wrapper [label]="label | translate">
     <div class="collections">
-        <a *ngFor="let collection of (this.collections$ | async); let last=last;" [routerLink]="['/collections', collection.id]">
+        <a *ngFor="let collection of (this.collections$ | async); let last=last;" [routerLink]="['/collections', collection.id]" role="link" tabindex="0">
             <span>{{ dsoNameService.getName(collection) }}</span><span *ngIf="!last" [innerHTML]="separator"></span>
         </a>
     </div>
@@ -15,6 +15,7 @@
         class="load-more-btn btn btn-sm btn-outline-secondary"
         role="button"
         href="javascript:void(0);"
+        tabindex="0"
     >
         {{'item.page.collections.load-more' | translate}}
     </a>

src/app/item-page/field-components/metadata-uri-values/metadata-uri-values.component.html

@@ -1,5 +1,5 @@
 <ds-metadata-field-wrapper [label]="label | translate">
-    <a class="dont-break-out" *ngFor="let mdValue of mdValues; let last=last;" [href]="mdValue.value" [target]="linkTarget">
+    <a class="dont-break-out" *ngFor="let mdValue of mdValues; let last=last;" [href]="mdValue.value" [target]="linkTarget" role="link" tabindex="0">
        {{ linktext || mdValue.value }}<span *ngIf="!last" [innerHTML]="separator"></span>
     </a>
 </ds-metadata-field-wrapper>

src/app/item-page/field-components/metadata-values/metadata-values.component.html

@@ -21,7 +21,9 @@
     <a class="dont-break-out ds-simple-metadata-link"
       [href]="value"
       [attr.target]="getLinkAttributes(value).target"
-      [attr.rel]="getLinkAttributes(value).rel">
+      [attr.rel]="getLinkAttributes(value).rel"
+      role="link"
+      tabindex="0">
       {{value}}
     </a>
 </ng-template>
@@ -35,5 +37,5 @@
 <ng-template #browselink let-value="value">
   <a class="dont-break-out preserve-line-breaks ds-browse-link"
      [routerLink]="['/browse', browseDefinition.id]"
-     [queryParams]="getQueryParams(value)">{{value}}</a>
+     [queryParams]="getQueryParams(value)" role="link" tabindex="0">{{value}}</a>
 </ng-template>

src/app/item-page/full/full-item-page.component.html

@@ -3,7 +3,6 @@
     <div *ngIf="itemRD?.payload as item">
       <ds-themed-item-alerts [item]="item"></ds-themed-item-alerts>
       <ds-item-versions-notice [item]="item"></ds-item-versions-notice>
-      <ds-view-tracker [object]="item"></ds-view-tracker>
       <div *ngIf="!item.isWithdrawn || (isAdmin$|async)" class="full-item-info">
         <div class="d-flex flex-row">
           <ds-themed-item-page-title-field class="mr-auto" [item]="item"></ds-themed-item-page-title-field>

src/app/item-page/item-page-routing.module.ts

@@ -19,6 +19,7 @@ import { REQUEST_COPY_MODULE_PATH } from '../app-routing-paths';
 import { OrcidPageComponent } from './orcid-page/orcid-page.component';
 import { OrcidPageGuard } from './orcid-page/orcid-page.guard';
 import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
+import { ViewTrackerResolverService } from '../statistics/angulartics/dspace/view-tracker-resolver.service';
 
 @NgModule({
   imports: [
@@ -37,6 +38,7 @@ import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
             pathMatch: 'full',
             resolve: {
               menu: DSOEditMenuResolver,
+              tracking: ViewTrackerResolverService,
             },
           },
           {
@@ -44,6 +46,7 @@ import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
             component: ThemedFullItemPageComponent,
             resolve: {
               menu: DSOEditMenuResolver,
+              tracking: ViewTrackerResolverService,
             },
           },
           {
@@ -103,7 +106,8 @@ import { DSOEditMenuResolver } from '../shared/dso-page/dso-edit-menu.resolver';
     LinkService,
     ItemPageAdministratorGuard,
     VersionResolver,
-    OrcidPageGuard
+    OrcidPageGuard,
+    ViewTrackerResolverService,
   ]
 
 })

src/app/item-page/media-viewer/media-viewer.component.html

@@ -16,12 +16,7 @@
     </ng-container>
   </div>
   <ng-template #showThumbnail>
-    <ds-themed-media-viewer-image *ngIf="mediaOptions.image && mediaOptions.video"
-      [image]="(thumbnailsRD$ | async)?.payload?.page[0]?._links.content.href || thumbnailPlaceholder"
-      [preview]="false"
-    ></ds-themed-media-viewer-image>
-    <ds-thumbnail *ngIf="!(mediaOptions.image && mediaOptions.video)"
-                  [thumbnail]="(thumbnailsRD$ | async)?.payload?.page[0]">
-    </ds-thumbnail>
+    <ds-themed-thumbnail [thumbnail]="(thumbnailsRD$ | async)?.payload?.page[0]">
+    </ds-themed-thumbnail>
   </ng-template>
 </ng-container>

src/app/item-page/media-viewer/media-viewer.component.spec.ts

@@ -139,9 +139,9 @@ describe('MediaViewerComponent', () => {
       expect(mediaItem.thumbnail).toBe(null);
     });
 
-    it('should display a default, thumbnail', () => {
+    it('should display a default thumbnail', () => {
       const defaultThumbnail = fixture.debugElement.query(
-        By.css('ds-themed-media-viewer-image')
+        By.css('ds-themed-thumbnail')
       );
       expect(defaultThumbnail.nativeElement).toBeDefined();
     });

src/app/item-page/orcid-page/orcid-auth/orcid-auth.component.html

@@ -1,18 +1,18 @@
 <div class="container mb-5">
   <h1>{{'person.orcid.registry.auth' | translate}}</h1>
-  <ng-container *ngIf="(isLinkedToOrcid() | async); then orcidLinked; else orcidNotLinked"></ng-container>
+  <ng-container *ngIf="(isOrcidLinked$ | async); then orcidLinked; else orcidNotLinked"></ng-container>
 </div>
 
 <ng-template #orcidLinked>
   <div data-test="orcidLinked">
     <div class="row">
-      <div *ngIf="(hasOrcidAuthorizations() | async)" class="col-sm-6 mb-3" data-test="hasOrcidAuthorizations">
+      <div *ngIf="(hasOrcidAuthorizations$ | async)" class="col-sm-6 mb-3" data-test="hasOrcidAuthorizations">
         <div class="card h-100">
           <div class="card-header">{{ 'person.page.orcid.granted-authorizations'| translate }}</div>
           <div class="card-body">
             <div class="container p-0">
               <ul>
-                <li *ngFor="let auth of (getOrcidAuthorizations() | async)" data-test="orcidAuthorization">
+                <li *ngFor="let auth of profileAuthorizationScopes$ | async" data-test="orcidAuthorization">
                   {{getAuthorizationDescription(auth) | translate}}
                 </li>
               </ul>
@@ -25,13 +25,13 @@
           <div class="card-header">{{ 'person.page.orcid.missing-authorizations'| translate }}</div>
           <div class="card-body">
             <div class="container">
-              <ds-alert *ngIf="!(hasMissingOrcidAuthorizations() | async)" [type]="'alert-success'" data-test="noMissingOrcidAuthorizations">
+              <ds-alert *ngIf="!(hasMissingOrcidAuthorizations$ | async)" [type]="AlertType.Success" data-test="noMissingOrcidAuthorizations">
                 {{'person.page.orcid.no-missing-authorizations-message' | translate}}
               </ds-alert>
-              <ds-alert *ngIf="(hasMissingOrcidAuthorizations() | async)" [type]="'alert-warning'" data-test="missingOrcidAuthorizations">
+              <ds-alert *ngIf="(hasMissingOrcidAuthorizations$ | async)" [type]="AlertType.Warning" data-test="missingOrcidAuthorizations">
                 {{'person.page.orcid.missing-authorizations-message' | translate}}
                 <ul>
-                  <li *ngFor="let auth of (getMissingOrcidAuthorizations() | async)" data-test="missingOrcidAuthorization">
+                  <li *ngFor="let auth of profileAuthorizationScopes$ | async" data-test="missingOrcidAuthorization">
                     {{getAuthorizationDescription(auth) | translate }}
                   </li>
                 </ul>
@@ -41,11 +41,11 @@
         </div>
       </div>
     </div>
-    <ds-alert *ngIf="(onlyAdminCanDisconnectProfileFromOrcid() | async) && !(ownerCanDisconnectProfileFromOrcid() | async)"
-              [type]="'alert-warning'" data-test="unlinkOnlyAdmin">
+    <ds-alert *ngIf="(onlyAdminCanDisconnectProfileFromOrcid$ | async) && !(ownerCanDisconnectProfileFromOrcid$ | async)"
+              [type]="AlertType.Warning" data-test="unlinkOnlyAdmin">
       {{ 'person.page.orcid.remove-orcid-message' | translate}}
     </ds-alert>
-    <div class="row" *ngIf="(ownerCanDisconnectProfileFromOrcid() | async)" data-test="unlinkOwner">
+    <div class="row" *ngIf="(ownerCanDisconnectProfileFromOrcid$ | async)" data-test="unlinkOwner">
       <div class="col">
         <button type="submit" class="btn btn-danger float-right" (click)="unlinkOrcid()"
                 [dsBtnDisabled]="(unlinkProcessing | async)">
@@ -54,7 +54,7 @@
           <span *ngIf="(unlinkProcessing | async)"><i
             class='fas fa-circle-notch fa-spin'></i> {{'person.page.orcid.unlink.processing' | translate}}</span>
         </button>
-        <button *ngIf="(hasMissingOrcidAuthorizations() | async)" type="submit"
+        <button *ngIf="(hasMissingOrcidAuthorizations$ | async)" type="submit"
                 class="btn btn-primary float-right" (click)="linkOrcid()">
           <span><i class="fas fa-check"></i> {{ 'person.page.orcid.grant-authorizations' | translate }}</span>
         </button>
@@ -68,7 +68,7 @@
     <div class="row">
       <div class="col-2"><img alt="orcid-logo" src="../../../../assets/images/orcid.logo.icon.svg"/></div>
       <div class="col">
-        <ds-alert [type]="'alert-info'">{{ getOrcidNotLinkedMessage() | async }}</ds-alert>
+        <ds-alert [type]="AlertType.Info">{{ getOrcidNotLinkedMessage() }}</ds-alert>
       </div>
     </div>
     <div class="row">

src/app/item-page/orcid-page/orcid-auth/orcid-auth.component.ts

@@ -12,6 +12,7 @@ import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
 import { OrcidAuthService } from '../../../core/orcid/orcid-auth.service';
 import { createFailedRemoteDataObject } from '../../../shared/remote-data.utils';
 import { HttpErrorResponse } from '@angular/common/http';
+import { AlertType } from '../../../shared/alert/alert-type';
 
 @Component({
   selector: 'ds-orcid-auth',
@@ -28,43 +29,49 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
   /**
    * The list of exposed orcid authorization scopes for the orcid profile
    */
-  profileAuthorizationScopes: BehaviorSubject<string[]> = new BehaviorSubject<string[]>([]);
+  profileAuthorizationScopes$: BehaviorSubject<string[]> = new BehaviorSubject([]);
+
+  hasOrcidAuthorizations$: Observable<boolean>;
 
   /**
    * The list of all orcid authorization scopes missing in the orcid profile
    */
-  missingAuthorizationScopes: BehaviorSubject<string[]> = new BehaviorSubject<string[]>([]);
+  missingAuthorizationScopes: BehaviorSubject<string[]> = new BehaviorSubject([]);
+
+  hasMissingOrcidAuthorizations$: Observable<boolean>;
 
   /**
    * The list of all orcid authorization scopes available
    */
-  orcidAuthorizationScopes: BehaviorSubject<string[]> = new BehaviorSubject<string[]>([]);
+  orcidAuthorizationScopes: BehaviorSubject<string[]> = new BehaviorSubject([]);
 
   /**
    * A boolean representing if unlink operation is processing
    */
-  unlinkProcessing: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
+  unlinkProcessing: BehaviorSubject<boolean> = new BehaviorSubject(false);
 
   /**
    * A boolean representing if orcid profile is linked
    */
-  private isOrcidLinked$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
+  isOrcidLinked$: BehaviorSubject<boolean> = new BehaviorSubject(false);
 
   /**
    * A boolean representing if only admin can disconnect orcid profile
    */
-  private onlyAdminCanDisconnectProfileFromOrcid$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
+  onlyAdminCanDisconnectProfileFromOrcid$: BehaviorSubject<boolean> = new BehaviorSubject(false);
 
   /**
    * A boolean representing if owner can disconnect orcid profile
    */
-  private ownerCanDisconnectProfileFromOrcid$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
+  ownerCanDisconnectProfileFromOrcid$: BehaviorSubject<boolean> = new BehaviorSubject(false);
 
   /**
    * An event emitted when orcid profile is unliked successfully
    */
   @Output() unlink: EventEmitter<void> = new EventEmitter<void>();
 
+  readonly AlertType = AlertType;
+
   constructor(
     private orcidAuthService: OrcidAuthService,
     private translateService: TranslateService,
@@ -78,6 +85,8 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
       this.orcidAuthorizationScopes.next(scopes);
       this.initOrcidAuthSettings();
     });
+    this.hasOrcidAuthorizations$ = this.hasOrcidAuthorizations();
+    this.hasMissingOrcidAuthorizations$ = this.hasMissingOrcidAuthorizations();
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -90,18 +99,11 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
    * Check if the list of exposed orcid authorization scopes for the orcid profile has values
    */
   hasOrcidAuthorizations(): Observable<boolean> {
-    return this.profileAuthorizationScopes.asObservable().pipe(
+    return this.profileAuthorizationScopes$.pipe(
       map((scopes: string[]) => scopes.length > 0)
     );
   }
 
-  /**
-   * Return the list of exposed orcid authorization scopes for the orcid profile
-   */
-  getOrcidAuthorizations(): Observable<string[]> {
-    return this.profileAuthorizationScopes.asObservable();
-  }
-
   /**
    * Check if the list of exposed orcid authorization scopes for the orcid profile has values
    */
@@ -111,26 +113,12 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
     );
   }
 
-  /**
-   * Return the list of exposed orcid authorization scopes for the orcid profile
-   */
-  getMissingOrcidAuthorizations(): Observable<string[]> {
-    return this.profileAuthorizationScopes.asObservable();
-  }
-
-  /**
-   * Return a boolean representing if orcid profile is linked
-   */
-  isLinkedToOrcid(): Observable<boolean> {
-    return this.isOrcidLinked$.asObservable();
-  }
-
-  getOrcidNotLinkedMessage(): Observable<string> {
+  getOrcidNotLinkedMessage(): string {
     const orcid = this.item.firstMetadataValue('person.identifier.orcid');
     if (orcid) {
-      return this.translateService.get('person.page.orcid.orcid-not-linked-message', { 'orcid': orcid });
+      return this.translateService.instant('person.page.orcid.orcid-not-linked-message', { 'orcid': orcid });
     } else {
-      return this.translateService.get('person.page.orcid.no-orcid-message');
+      return this.translateService.instant('person.page.orcid.no-orcid-message');
     }
   }
 
@@ -143,13 +131,6 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
     return 'person.page.orcid.scope.' + scope.substring(1).replace('/', '-');
   }
 
-  /**
-   * Return a boolean representing if only admin can disconnect orcid profile
-   */
-  onlyAdminCanDisconnectProfileFromOrcid(): Observable<boolean> {
-    return this.onlyAdminCanDisconnectProfileFromOrcid$.asObservable();
-  }
-
   /**
    * Return a boolean representing if owner can disconnect orcid profile
    */
@@ -215,7 +196,7 @@ export class OrcidAuthComponent implements OnInit, OnChanges {
   }
 
   private setOrcidAuthorizationsFromItem(): void {
-    this.profileAuthorizationScopes.next(this.orcidAuthService.getOrcidAuthorizationScopesByItem(this.item));
+    this.profileAuthorizationScopes$.next(this.orcidAuthService.getOrcidAuthorizationScopesByItem(this.item));
   }
 
 }

src/app/item-page/orcid-page/orcid-queue/orcid-queue.component.html

@@ -3,13 +3,13 @@
   <div class="container">
     <h2>{{ 'person.orcid.registry.queue' | translate }}</h2>
 
-    <ds-alert *ngIf="!(processing$ | async) && (getList() | async)?.payload?.totalElements == 0"
+    <ds-alert *ngIf="!(processing$ | async) && (list$ | async)?.payload?.totalElements == 0"
               [type]="AlertTypeEnum.Info">
       {{ 'person.page.orcid.sync-queue.empty-message' | translate}}
     </ds-alert>
-    <ds-pagination *ngIf="!(processing$ | async) && (getList() | async)?.payload?.totalElements > 0"
+    <ds-pagination *ngIf="!(processing$ | async) && (list$ | async)?.payload?.totalElements > 0"
                    [paginationOptions]="paginationOptions"
-                   [collectionSize]="(getList() | async)?.payload?.totalElements"
+                   [collectionSize]="(list$ | async)?.payload?.totalElements"
                    [retainScrollPosition]="false" [hideGear]="true" (paginationChange)="updateList()">
 
       <div class="table-responsive">
@@ -22,7 +22,7 @@
           </tr>
           </thead>
           <tbody>
-          <tr *ngFor="let entry of (getList() | async)?.payload?.page" data-test="orcidQueueElementRow">
+          <tr *ngFor="let entry of (list$ | async)?.payload?.page" data-test="orcidQueueElementRow">
             <td style="width: 15%" class="text-center align-middle">
               <i [ngClass]="getIconClass(entry)" [ngbTooltip]="getIconTooltip(entry) | translate"
                  class="fa-2x" aria-hidden="true"></i>

src/app/item-page/orcid-page/orcid-queue/orcid-queue.component.ts

@@ -47,13 +47,12 @@ export class OrcidQueueComponent implements OnInit, OnDestroy {
   /**
    * A list of orcid queue records
    */
-  private list$: BehaviorSubject<RemoteData<PaginatedList<OrcidQueue>>> = new BehaviorSubject<RemoteData<PaginatedList<OrcidQueue>>>({} as any);
+  list$: BehaviorSubject<RemoteData<PaginatedList<OrcidQueue>>> = new BehaviorSubject<RemoteData<PaginatedList<OrcidQueue>>>({} as any);
 
   /**
    * The AlertType enumeration
-   * @type {AlertType}
    */
-  AlertTypeEnum = AlertType;
+  readonly AlertTypeEnum = AlertType;
 
   /**
    * Array to track all subscriptions and unsubscribe them onDestroy
@@ -99,13 +98,6 @@ export class OrcidQueueComponent implements OnInit, OnDestroy {
     );
   }
 
-  /**
-   * Return the list of orcid queue records
-   */
-  getList(): Observable<RemoteData<PaginatedList<OrcidQueue>>> {
-    return this.list$.asObservable();
-  }
-
   /**
    * Return the icon class for the queue object type
    *

src/app/item-page/simple/item-page.component.html

@@ -3,7 +3,6 @@
     <div *ngIf="itemRD?.payload as item">
       <ds-themed-item-alerts [item]="item"></ds-themed-item-alerts>
       <ds-item-versions-notice [item]="item"></ds-item-versions-notice>
-      <ds-view-tracker [object]="item"></ds-view-tracker>
       <ds-listable-object-component-loader *ngIf="!item.isWithdrawn || (isAdmin$|async)" [object]="item" [viewMode]="viewMode"></ds-listable-object-component-loader>
       <ds-item-versions class="mt-2" [item]="item" [displayActions]="false"></ds-item-versions>
     </div>

src/app/item-page/simple/item-types/publication/publication.component.html

@@ -85,7 +85,7 @@
     </ds-item-page-uri-field>
     <ds-item-page-collections [item]="object"></ds-item-page-collections>
     <div>
-      <a class="btn btn-outline-primary" role="button" [routerLink]="[itemPageRoute + '/full']">
+      <a class="btn btn-outline-primary" role="button" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         <i class="fas fa-info-circle"></i> {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html

@@ -71,7 +71,7 @@
     </ds-item-page-uri-field>
     <ds-item-page-collections [item]="object"></ds-item-page-collections>
     <div>
-      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button">
+      <a class="btn btn-outline-primary" [routerLink]="[itemPageRoute + '/full']" role="button" tabindex="0">
         <i class="fas fa-info-circle"></i> {{"item.page.link.full" | translate}}
       </a>
     </div>

src/app/lookup-by-id/objectnotfound/objectnotfound.component.html

@@ -3,6 +3,6 @@
   <h2><small><em>{{missingItem}}</em></small></h2>
   <br />
   <p class="text-center">
-    <a routerLink="/home" class="btn btn-primary">{{"404.link.home-page" | translate}}</a>
+    <a routerLink="/home" class="btn btn-primary" role="link" tabindex="0">{{"404.link.home-page" | translate}}</a>
   </p>
 </div>

src/app/navbar/navbar.component.html

@@ -1,5 +1,5 @@
 <nav [ngClass]="{'open': !(menuCollapsed | async)}"
-     [@slideMobileNav]="!(windowService.isXsOrSm() | async) ? 'default' : ((menuCollapsed | async) ? 'collapsed' : 'expanded')"
+     [@slideMobileNav]="(isMobile$ | async) !== true ? 'default' : ((menuCollapsed | async) ? 'collapsed' : 'expanded')"
      class="navbar navbar-light navbar-expand-md px-md-0 pt-md-0 pt-3 navbar-container" role="navigation"
      [attr.aria-label]="'nav.main.description' | translate" id="main-navbar">
   <!-- TODO remove navbar-container class when https://github.com/twbs/bootstrap/issues/24726 is fixed -->

src/app/page-error/page-error.component.html

@@ -5,6 +5,6 @@
   <p>{{"error-page." + code | translate}}</p>
   <br/>
   <p class="text-center">
-    <a href="/home" class="btn btn-primary">{{ status + ".link.home-page" | translate}}</a>
+    <a href="/home" class="btn btn-primary" role="link" tabindex="0">{{ status + ".link.home-page" | translate}}</a>
   </p>
 </div>

src/app/pagenotfound/pagenotfound.component.html

@@ -5,6 +5,6 @@
   <p>{{"404.help" | translate}}</p>
   <br/>
   <p class="text-center">
-    <a routerLink="/home" class="btn btn-primary">{{"404.link.home-page" | translate}}</a>
+    <a routerLink="/home" class="btn btn-primary" role="link" tabindex="0">{{"404.link.home-page" | translate}}</a>
   </p>
 </div>

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

@@ -71,16 +71,16 @@
         </div>
 
         <div class="modal-body">
-            <div *ngIf="!(processBulkDeleteService.isProcessing$() |async)">{{'process.overview.delete.body' | translate: {count: processBulkDeleteService.getAmountOfSelectedProcesses()} }}</div>
-            <div *ngIf="processBulkDeleteService.isProcessing$() |async" class="alert alert-info">
+            <div *ngIf="(isProcessing$ | async) !== true">{{'process.overview.delete.body' | translate: {count: processBulkDeleteService.getAmountOfSelectedProcesses()} }}</div>
+            <div *ngIf="(isProcessing$ | async) === true" class="alert alert-info">
                 <span class="spinner-border spinner-border-sm spinner-button" role="status" aria-hidden="true"></span>
                 <span> {{ 'process.overview.delete.processing' | translate: {count: processBulkDeleteService.getAmountOfSelectedProcesses()} }}</span>
             </div>
             <div class="mt-4">
-                <button class="btn btn-primary mr-2" [dsBtnDisabled]="processBulkDeleteService.isProcessing$() |async"
+                <button class="btn btn-primary mr-2" [dsBtnDisabled]="(isProcessing$ | async) === true"
                         (click)="closeModal()">{{'process.detail.delete.cancel' | translate}}</button>
                 <button id="delete-confirm" class="btn btn-danger"
-                        [dsBtnDisabled]="processBulkDeleteService.isProcessing$() |async"
+                        [dsBtnDisabled]="(isProcessing$ | async) === true"
                         (click)="deleteSelected()">{{ 'process.overview.delete' | translate: {count: processBulkDeleteService.getAmountOfSelectedProcesses()}  }}
                 </button>
             </div>

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

@@ -51,11 +51,12 @@ export class ProcessOverviewComponent implements OnInit, OnDestroy {
    */
   dateFormat = 'yyyy-MM-dd HH:mm:ss';
 
-  processesToDelete: string[] = [];
   private modalRef: any;
 
   isProcessingSub: Subscription;
 
+  isProcessing$: Observable<boolean>;
+
   constructor(protected processService: ProcessDataService,
               protected paginationService: PaginationService,
               protected ePersonService: EPersonDataService,
@@ -69,6 +70,7 @@ export class ProcessOverviewComponent implements OnInit, OnDestroy {
   ngOnInit(): void {
     this.setProcesses();
     this.processBulkDeleteService.clearAllProcesses();
+    this.isProcessing$ = this.processBulkDeleteService.isProcessing$();
   }
 
   /**

src/app/profile-page/profile-page-researcher-form/profile-page-researcher-form.component.html

@@ -13,12 +13,12 @@
     <p>{{'researcher.profile.not.associated' | translate}}</p>
   </div>
   <button *ngIf="!researcherProfile" class="btn btn-primary mr-2"
-          [dsBtnDisabled]="(isProcessingCreate() | async)"
+          [dsBtnDisabled]="(processingCreate$ | async) === true"
           (click)="createProfile()">
-    <span *ngIf="(isProcessingCreate() | async)">
+    <span *ngIf="(processingCreate$ | async) === true">
         <i class='fas fa-circle-notch fa-spin'></i> {{'researcher.profile.action.processing' | translate}}
     </span>
-    <span *ngIf="!(isProcessingCreate() | async)">
+    <span *ngIf="(processingCreate$ | async) !== true">
         <i class="fas fa-plus"></i> &nbsp;{{'researcher.profile.create.new' | translate}}
     </span>
   </button>
@@ -27,10 +27,10 @@
       <i class="fas fa-info-circle"></i> {{'researcher.profile.view' | translate}}
     </button>
     <button class="btn btn-danger" [dsBtnDisabled]="!researcherProfile" (click)="deleteProfile(researcherProfile)">
-        <span *ngIf="(isProcessingDelete() | async)">
+        <span *ngIf="(processingDelete$ | async) === true">
             <i class='fas fa-circle-notch fa-spin'></i> {{'researcher.profile.action.processing' | translate}}
         </span>
-        <span *ngIf="!(isProcessingDelete() | async)">
+        <span *ngIf="(processingDelete$ | async) !== true">
             <i class="fas fa-trash-alt"></i> &nbsp;{{'researcher.profile.delete' | translate}}
         </span>
     </button>

src/app/profile-page/profile-page-researcher-form/profile-page-researcher-form.component.ts

@@ -3,7 +3,7 @@ import { Router } from '@angular/router';
 
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateService } from '@ngx-translate/core';
-import { BehaviorSubject, Observable } from 'rxjs';
+import { BehaviorSubject } from 'rxjs';
 import { map, mergeMap, switchMap, take, tap } from 'rxjs/operators';
 
 import { getFirstCompletedRemoteData, getFirstSucceededRemoteDataPayload } from '../../core/shared/operators';
@@ -157,24 +157,6 @@ export class ProfilePageResearcherFormComponent implements OnInit {
     });
   }
 
-  /**
-   * Return a boolean representing if a delete operation is pending.
-   *
-   * @return {Observable<boolean>}
-   */
-  isProcessingDelete(): Observable<boolean> {
-    return this.processingDelete$.asObservable();
-  }
-
-  /**
-   * Return a boolean representing if a create operation is pending.
-   *
-   * @return {Observable<boolean>}
-   */
-  isProcessingCreate(): Observable<boolean> {
-    return this.processingCreate$.asObservable();
-  }
-
   /**
    * Create a new profile related to the current user from scratch.
    */

src/app/register-email-form/register-email-form.component.html

@@ -44,13 +44,13 @@
       <p class="m-0"><a href="javascript:void(0);" (click)="this.klaroService.showSettings()">{{ MESSAGE_PREFIX + '.google-recaptcha.open-cookie-settings' | translate }}</a></p>
     </ds-alert>
 
-    <div class="my-3" *ngIf="isRecaptchaCookieAccepted() && (googleRecaptchaService.captchaVersion() | async) === 'v2'">
-      <ds-google-recaptcha [captchaMode]="(googleRecaptchaService.captchaMode() | async)"
+    <div class="my-3" *ngIf="isRecaptchaCookieAccepted() && (captchaVersion$ | async) === 'v2'">
+      <ds-google-recaptcha [captchaMode]="(captchaMode$ | async)"
                            (executeRecaptcha)="register($event)" (checkboxChecked)="onCheckboxChecked($event)"
                            (showNotification)="showNotification($event)"></ds-google-recaptcha>
     </div>
 
-    <ng-container *ngIf="!((googleRecaptchaService.captchaVersion() | async) === 'v2' && (googleRecaptchaService.captchaMode() | async) === 'invisible'); else v2Invisible">
+    <ng-container *ngIf="!((captchaVersion$ | async) === 'v2' && (captchaMode$ | async) === 'invisible'); else v2Invisible">
       <button class="btn btn-primary" [dsBtnDisabled]="form.invalid || registrationVerification && !isRecaptchaCookieAccepted() || disableUntilChecked" (click)="register()">
         {{ MESSAGE_PREFIX + '.submit' | translate }}
       </button>

src/app/register-email-form/register-email-form.component.ts

@@ -66,13 +66,9 @@ export class RegisterEmailFormComponent implements OnDestroy, OnInit {
 
   subscriptions: Subscription[] = [];
 
-  captchaVersion(): Observable<string> {
-    return this.googleRecaptchaService.captchaVersion();
-  }
+  captchaVersion$: Observable<string>;
 
-  captchaMode(): Observable<string> {
-    return this.googleRecaptchaService.captchaMode();
-  }
+  captchaMode$: Observable<string>;
 
   constructor(
     private epersonRegistrationService: EpersonRegistrationService,
@@ -94,6 +90,8 @@ export class RegisterEmailFormComponent implements OnDestroy, OnInit {
   }
 
   ngOnInit(): void {
+    this.captchaVersion$ = this.googleRecaptchaService.captchaVersion();
+    this.captchaMode$ = this.googleRecaptchaService.captchaMode();
     const validators: ValidatorFn[] = [
       Validators.required,
       Validators.email,
@@ -150,7 +148,7 @@ export class RegisterEmailFormComponent implements OnDestroy, OnInit {
   register(tokenV2?) {
     if (!this.form.invalid) {
       if (this.registrationVerification) {
-        this.subscriptions.push(combineLatest([this.captchaVersion(), this.captchaMode()]).pipe(
+        this.subscriptions.push(combineLatest([this.captchaVersion$, this.captchaMode$]).pipe(
           switchMap(([captchaVersion, captchaMode])  => {
             if (captchaVersion === 'v3') {
               return this.googleRecaptchaService.getRecaptchaToken('register_email');
@@ -213,7 +211,7 @@ export class RegisterEmailFormComponent implements OnDestroy, OnInit {
    */
   disableUntilCheckedFcn(): Observable<boolean> {
     const checked$ = this.checkboxCheckedSubject$.asObservable();
-    return combineLatest([this.captchaVersion(), this.captchaMode(), checked$]).pipe(
+    return combineLatest([this.captchaVersion$, this.captchaMode$, checked$]).pipe(
       // disable if checkbox is not checked or if reCaptcha is not in v2 checkbox mode
       switchMap(([captchaVersion, captchaMode, checked])  => captchaVersion === 'v2' && captchaMode === 'checkbox' ? of(!checked) : of(false)),
       startWith(true),

src/app/request-copy/grant-deny-request-copy/grant-deny-request-copy.component.html

@@ -8,13 +8,15 @@
       <div class="btn-group ">
         <a [routerLink]="grantRoute$ | async"
            class="btn btn-outline-primary"
-           title="{{'grant-deny-request-copy.grant' | translate }}">
+           title="{{'grant-deny-request-copy.grant' | translate }}"
+           role="button" tabindex="0">
           {{'grant-deny-request-copy.grant' | translate }}
         </a>
 
         <a [routerLink]="denyRoute$ | async"
            class="btn btn-outline-danger"
-           title="{{'grant-deny-request-copy.deny' | translate }}">
+           title="{{'grant-deny-request-copy.deny' | translate }}"
+           role="button" tabindex="0">
           {{'grant-deny-request-copy.deny' | translate }}
         </a>
       </div>
@@ -22,7 +24,7 @@
     <div *ngIf="itemRequestRD.payload.decisionDate" class="processed-message">
       <p>{{'grant-deny-request-copy.processed' | translate}}</p>
       <p class="text-center">
-        <a routerLink="/home" class="btn btn-primary">{{'grant-deny-request-copy.home-page' | translate}}</a>
+        <a routerLink="/home" class="btn btn-primary" role="link" tabindex="0">{{'grant-deny-request-copy.home-page' | translate}}</a>
       </p>
     </div>
   </div>

src/app/search-navbar/search-navbar.component.html

@@ -7,7 +7,7 @@
              [class.display]="searchExpanded ? 'inline-block' : 'none'"
              [tabIndex]="searchExpanded ? 0 : -1"
              [attr.data-test]="'header-search-box' | dsBrowserOnly">
-      <button class="submit-icon btn btn-link btn-link-inline" [attr.aria-label]="'nav.search.button' | translate" type="button" (click)="searchExpanded ? onSubmit(searchForm.value) : expand()" [attr.data-test]="'header-search-icon' | dsBrowserOnly">
+      <button class="submit-icon btn btn-link btn-link-inline" [attr.aria-label]="'nav.search.button' | translate" type="button" (click)="searchExpanded ? onSubmit(searchForm.value) : expand()" [attr.data-test]="'header-search-icon' | dsBrowserOnly" role="button" tabindex="0">
         <em class="fas fa-search fa-lg fa-fw"></em>
       </button>
     </form>

src/app/shared/access-control-form-container/access-control-array-form/access-control-array-form.component.ts

@@ -119,6 +119,10 @@ export class AccessControlArrayFormComponent implements OnInit {
     return item.id;
   }
 
+  isValid() {
+    return this.ngForm.valid;
+  }
+
 }
 
 

src/app/shared/access-control-form-container/access-control-form-container.component.ts

@@ -156,5 +156,9 @@ export class AccessControlFormContainerComponent<T extends DSpaceObject> impleme
     this.selectableListService.deselectAll(ITEM_ACCESS_CONTROL_SELECT_BITSTREAMS_LIST_ID);
   }
 
+  isValid() {
+    return this.bitstreamAccessCmp.isValid() || this.itemAccessCmp.isValid();
+  }
+
 }
 

src/app/shared/access-control-form-container/item-access-control-select-bitstreams-modal/item-access-control-select-bitstreams-modal.component.html

@@ -8,20 +8,19 @@
   </button>
 </div>
 <div class="modal-body">
-  <ng-container *ngIf="data$ | async as data">
+  <ng-container *ngIf="bitstreams$ | async as bitstreams">
     <ds-viewable-collection
-      *ngIf="data.payload.page.length > 0"
+      *ngIf="bitstreams.payload?.page?.length > 0"
       [config]="paginationConfig"
       [context]="context"
-      [objects]="data"
+      [objects]="bitstreams"
       [selectable]="true"
       [selectionConfig]="{ repeatable: true, listId: LIST_ID }"
-      [showPaginator]="true"
-      (pageChange)="loadForPage($event)">
+      [showPaginator]="true">
     </ds-viewable-collection>
 
-    <div *ngIf="data && data.payload.page.length === 0"
-      class="alert alert-info w-100" role="alert">
+    <div *ngIf="bitstreams && bitstreams.payload?.page?.length === 0"
+         class="alert alert-info w-100" role="alert">
       {{'access-control-select-bitstreams-modal.no-items' | translate}}
     </div>
 

src/app/shared/access-control-form-container/item-access-control-select-bitstreams-modal/item-access-control-select-bitstreams-modal.component.ts

@@ -1,6 +1,6 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { Component, Input, OnInit, OnDestroy } from '@angular/core';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { BehaviorSubject } from 'rxjs';
+import {  Observable } from 'rxjs';
 import { PaginatedList } from 'src/app/core/data/paginated-list.model';
 import { RemoteData } from 'src/app/core/data/remote-data';
 import { Bitstream } from 'src/app/core/shared/bitstream.model';
@@ -10,8 +10,7 @@ import { Item } from '../../../core/shared/item.model';
 import { BitstreamDataService } from '../../../core/data/bitstream-data.service';
 import { PaginationService } from '../../../core/pagination/pagination.service';
 import { TranslateService } from '@ngx-translate/core';
-import { hasValue } from '../../empty.util';
-import { getFirstCompletedRemoteData } from '../../../core/shared/operators';
+import { switchMap } from 'rxjs/operators';
 
 export const ITEM_ACCESS_CONTROL_SELECT_BITSTREAMS_LIST_ID = 'item-access-control-select-bitstreams';
 
@@ -20,19 +19,22 @@ export const ITEM_ACCESS_CONTROL_SELECT_BITSTREAMS_LIST_ID = 'item-access-contro
   templateUrl: './item-access-control-select-bitstreams-modal.component.html',
   styleUrls: [ './item-access-control-select-bitstreams-modal.component.scss' ]
 })
-export class ItemAccessControlSelectBitstreamsModalComponent implements OnInit {
+export class ItemAccessControlSelectBitstreamsModalComponent implements OnInit, OnDestroy {
 
   LIST_ID = ITEM_ACCESS_CONTROL_SELECT_BITSTREAMS_LIST_ID;
 
   @Input() item!: Item;
   @Input() selectedBitstreams: string[] = [];
 
-  data$ = new BehaviorSubject<RemoteData<PaginatedList<Bitstream>> | null>(null);
-  paginationConfig: PaginationComponentOptions;
-  pageSize = 5;
-
+  bitstreams$: Observable<RemoteData<PaginatedList<Bitstream>>>;
   context: Context = Context.Bitstream;
 
+  paginationConfig = Object.assign(new PaginationComponentOptions(), {
+    id: 'iacsbm',
+    currentPage: 1,
+    pageSize: 5
+  });
+
   constructor(
     private bitstreamService: BitstreamDataService,
     protected paginationService: PaginationService,
@@ -40,23 +42,20 @@ export class ItemAccessControlSelectBitstreamsModalComponent implements OnInit {
     public activeModal: NgbActiveModal
   ) { }
 
-  ngOnInit() {
-    this.loadForPage(1);
-
-    this.paginationConfig = new PaginationComponentOptions();
-    this.paginationConfig.id = 'iacsbm';
-    this.paginationConfig.currentPage = 1;
-    if (hasValue(this.pageSize)) {
-      this.paginationConfig.pageSize = this.pageSize;
-    }
+  ngOnInit(): void {
+    this.bitstreams$ = this.paginationService.getCurrentPagination(this.paginationConfig.id, this.paginationConfig).pipe(
+      switchMap((options: PaginationComponentOptions) => this.bitstreamService.findAllByItemAndBundleName(
+        this.item,
+        'ORIGINAL',
+        { elementsPerPage: options.pageSize, currentPage: options.currentPage },
+        true,
+        true,
+      ))
+    );
   }
 
-  loadForPage(page: number) {
-    this.bitstreamService.findAllByItemAndBundleName(this.item, 'ORIGINAL', { currentPage: page}, false)
-      .pipe(
-        getFirstCompletedRemoteData(),
-      )
-      .subscribe(this.data$);
+  ngOnDestroy(): void {
+    this.paginationService.clearPagination(this.paginationConfig.id);
   }
 
 }

src/app/shared/auth-nav-menu/auth-nav-menu.component.html

@@ -6,6 +6,7 @@
       <a href="javascript:void(0);" class="dropdownLogin px-0.5" [attr.aria-label]="'nav.login' |translate"
          (click)="$event.preventDefault()" [attr.data-test]="'login-menu' | dsBrowserOnly"
          role="menuitem"
+         tabindex="0"
          aria-haspopup="menu"
          aria-controls="loginDropdownMenu"
          [attr.aria-expanded]="loginDrop.isOpen()"
@@ -22,6 +23,7 @@
     <div ngbDropdown display="dynamic" placement="bottom-right" class="d-inline-block" @fadeInOut>
       <a href="javascript:void(0);"
          role="menuitem"
+         tabindex="0"
          [attr.aria-label]="'nav.user-profile-menu-and-logout' | translate"
          aria-controls="user-menu-dropdown"
          (click)="$event.preventDefault()" [title]="'nav.user-profile-menu-and-logout' | translate"
@@ -39,10 +41,10 @@
 
 <ng-template #mobileButtons>
   <div data-test="auth-nav">
-    <a *ngIf="!(isAuthenticated | async)" routerLink="/login" routerLinkActive="active" class="loginLink px-0.5" role="button">
+    <a *ngIf="!(isAuthenticated | async)" routerLink="/login" routerLinkActive="active" class="loginLink px-0.5" role="button" tabindex="0">
       {{ 'nav.login' | translate }}<span class="sr-only">(current)</span>
     </a>
-    <a *ngIf="(isAuthenticated | async)" role="button" [attr.aria-label]="'nav.logout' |translate" [title]="'nav.logout' | translate" routerLink="/logout" routerLinkActive="active" class="logoutLink px-1">
+    <a *ngIf="(isAuthenticated | async)" role="button" [attr.aria-label]="'nav.logout' |translate" [title]="'nav.logout' | translate" routerLink="/logout" routerLinkActive="active" class="logoutLink px-1" tabindex="0">
       <i class="fas fa-sign-out-alt fa-lg fa-fw"></i>
       <span class="sr-only">(current)</span>
     </a>