hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2696 from DSpace/backport-2683-to-dspace-7_x

Browse Source 
[Port dspace-7_x] Fix accessibility issues
This commit is contained in:
Tim Donohue
2023-12-06 10:30:55 -06:00
committed by GitHub
parent 970c449b30 4a0bf8a7af
commit 2fec884072
128 changed files with 513 additions and 343 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
cypress/e2e/header.cy.ts
View File

@@ -8,11 +8,6 @@ describe('Header', () => {
cy.get('ds-header').should('be.visible');
// Analyze <ds-header> for accessibility
testA11y({
include: ['ds-header'],
exclude: [
['#search-navbar-container'] // search in navbar has duplicative ID. Will be fixed in #1174
],
});
testA11y('ds-header');
});
});

2
package.json
View File

@@ -121,7 +121,7 @@
"ngx-infinite-scroll": "^15.0.0",
"ngx-pagination": "6.0.3",
"ngx-sortablejs": "^11.1.0",
"ngx-ui-switch": "^14.0.3",
"ngx-ui-switch": "^14.1.0",
"nouislider": "^15.7.1",
"pem": "1.14.7",
"prop-types": "^15.8.1",

16
src/app/access-control/bulk-access/browse/bulk-access-browse.component.html
View File

@@ -1,15 +1,15 @@
<ngb-accordion #acc="ngbAccordion" [activeIds]="'browse'">
<ngb-panel [id]="'browse'">
<ng-template ngbPanelHeader>
<div class="w-100 d-flex justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle('browse')"
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle('browse')"
data-test="browse">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()"
[attr.aria-expanded]="!acc.isExpanded('browse')"
aria-controls="collapsePanels">
[attr.aria-expanded]="acc.isExpanded('browse')"
aria-controls="bulk-access-browse-panel-content">
{{ 'admin.access-control.bulk-access-browse.header' | translate }}
</button>
<div class="text-right d-flex">
<div class="ml-3 d-inline-block">
<div class="text-right d-flex gap-2">
<div class="d-flex my-auto">
<span *ngIf="acc.isExpanded('browse')" class="fas fa-chevron-up fa-fw"></span>
<span *ngIf="!acc.isExpanded('browse')" class="fas fa-chevron-down fa-fw"></span>
</div>
@@ -17,8 +17,9 @@
</div>
</ng-template>
<ng-template ngbPanelContent>
<div id="bulk-access-browse-panel-content">
<ul ngbNav #nav="ngbNav" [(activeId)]="activateId" class="nav-pills">
<li [ngbNavItem]="'search'">
<li [ngbNavItem]="'search'" role="presentation">
<a ngbNavLink>{{'admin.access-control.bulk-access-browse.search.header' | translate}}</a>
<ng-template ngbNavContent>
<div class="mx-n3">
@@ -29,7 +30,7 @@
</div>
</ng-template>
</li>
<li [ngbNavItem]="'selected'">
<li [ngbNavItem]="'selected'" role="presentation">
<a ngbNavLink>
{{'admin.access-control.bulk-access-browse.selected.header' | translate: {number: ((objectsSelected$ | async)?.payload?.totalElements) ? (objectsSelected$ | async)?.payload?.totalElements : '0'} }}
</a>
@@ -62,6 +63,7 @@
</li>
</ul>
<div [ngbNavOutlet]="nav" class="mt-5"></div>
</div>
</ng-template>
</ngb-panel>
</ngb-accordion>

12
src/app/access-control/bulk-access/settings/bulk-access-settings.component.html
View File

@@ -1,13 +1,13 @@
<ngb-accordion #acc="ngbAccordion" [activeIds]="'settings'">
<ngb-panel [id]="'settings'">
<ng-template ngbPanelHeader>
<div class="w-100 d-flex justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle('settings')" data-test="settings">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="!acc.isExpanded('browse')"
aria-controls="collapsePanels">
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle('settings')" data-test="settings">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="acc.isExpanded('settings')"
aria-controls="bulk-access-settings-panel-content">
{{ 'admin.access-control.bulk-access-settings.header' | translate }}
</button>
<div class="text-right d-flex">
<div class="ml-3 d-inline-block">
<div class="text-right d-flex gap-2">
<div class="d-flex my-auto">
<span *ngIf="acc.isExpanded('settings')" class="fas fa-chevron-up fa-fw"></span>
<span *ngIf="!acc.isExpanded('settings')" class="fas fa-chevron-down fa-fw"></span>
</div>
@@ -15,7 +15,7 @@
</div>
</ng-template>
<ng-template ngbPanelContent>
<ds-access-control-form-container #dsAccessControlForm [showSubmit]="false"></ds-access-control-form-container>
<ds-access-control-form-container id="bulk-access-settings-panel-content" #dsAccessControlForm [showSubmit]="false"></ds-access-control-form-container>
</ng-template>
</ngb-panel>
</ngb-accordion>

8
src/app/access-control/epeople-registry/epeople-registry.component.html
View File

@@ -2,7 +2,7 @@
<div class="epeople-registry row">
<div class="col-12">
<div class="d-flex justify-content-between border-bottom mb-3">
<h2 id="header" class="pb-2">{{labelPrefix + 'head' | translate}}</h2>
<h1 id="header" class="pb-2">{{labelPrefix + 'head' | translate}}</h1>
<div>
<button class="mr-auto btn btn-success addEPerson-button"
@@ -13,9 +13,9 @@
</div>
</div>
<h3 id="search" class="border-bottom pb-2">{{labelPrefix + 'search.head' | translate}}
</h3>
<h2 id="search" class="border-bottom pb-2">
{{labelPrefix + 'search.head' | translate}}
</h2>
<form [formGroup]="searchForm" (ngSubmit)="search(searchForm.value)" class="d-flex justify-content-between">
<div>
<select name="scope" id="scope" formControlName="scope" class="form-control" aria-label="Search scope">

6
src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
View File

@@ -5,11 +5,11 @@
<div *ngIf="epersonService.getActiveEPerson() | async; then editHeader; else createHeader"></div>
<ng-template #createHeader>
<h2 class="border-bottom pb-2">{{messagePrefix + '.create' | translate}}</h2>
<h1 class="border-bottom pb-2">{{messagePrefix + '.create' | translate}}</h1>
</ng-template>
<ng-template #editHeader>
<h2 class="border-bottom pb-2">{{messagePrefix + '.edit' | translate}}</h2>
<h1 class="border-bottom pb-2">{{messagePrefix + '.edit' | translate}}</h1>
</ng-template>
<ds-form [formId]="formId"
@@ -45,7 +45,7 @@
<ds-themed-loading [showMessage]="false" *ngIf="!formGroup"></ds-themed-loading>
<div *ngIf="epersonService.getActiveEPerson() | async">
<h5>{{messagePrefix + '.groupsEPersonIsMemberOf' | translate}}</h5>
<h2>{{messagePrefix + '.groupsEPersonIsMemberOf' | translate}}</h2>
<ds-themed-loading [showMessage]="false" *ngIf="!(groups | async)"></ds-themed-loading>

11
src/app/access-control/group-registry/group-form/group-form.component.html
View File

@@ -5,11 +5,11 @@
<div *ngIf="groupDataService.getActiveGroup() | async; then editHeader; else createHeader"></div>
<ng-template #createHeader>
<h2 class="border-bottom pb-2">{{messagePrefix + '.head.create' | translate}}</h2>
<h1 class="border-bottom pb-2">{{messagePrefix + '.head.create' | translate}}</h1>
</ng-template>
<ng-template #editHeader>
<h2 class="border-bottom pb-2">
<h1 class="border-bottom pb-2">
<span
*dsContextHelp="{
content: 'admin.access-control.groups.form.tooltip.editGroupPage',
@@ -20,7 +20,7 @@
>
{{messagePrefix + '.head.edit' | translate}}
</span>
</h2>
</h1>
</ng-template>
<ds-alert *ngIf="groupBeingEdited?.permanent" [type]="AlertTypeEnum.Warning"
@@ -39,9 +39,8 @@
<button (click)="onCancel()" type="button"
class="btn btn-outline-secondary"><i class="fas fa-arrow-left"></i> {{messagePrefix + '.return' | translate}}</button>
</div>
<div after *ngIf="(canEdit$ | async) && !groupBeingEdited.permanent" class="btn-group">
<button class="btn btn-danger delete-button" [disabled]="!(canEdit$ | async) || groupBeingEdited.permanent"
(click)="delete()" type="button">
<div after *ngIf="(canEdit$ | async) && !groupBeingEdited?.permanent" class="btn-group">
<button (click)="delete()" class="btn btn-danger delete-button" type="button">
<i class="fa fa-trash"></i> {{ messagePrefix + '.actions.delete' | translate}}
</button>
</div>

8
src/app/access-control/group-registry/group-form/members-list/members-list.component.html
View File

@@ -1,7 +1,7 @@
<ng-container>
<h3 class="border-bottom pb-2">{{messagePrefix + '.head' | translate}}</h3>
<h2 class="border-bottom pb-2">{{messagePrefix + '.head' | translate}}</h2>
<h4>{{messagePrefix + '.headMembers' | translate}}</h4>
<h3>{{messagePrefix + '.headMembers' | translate}}</h3>
<ds-pagination *ngIf="(ePeopleMembersOfGroup | async)?.totalElements > 0"
[paginationOptions]="config"
@@ -55,7 +55,7 @@
{{messagePrefix + '.no-members-yet' | translate}}
</div>
<h4 id="search" class="border-bottom pb-2">
<h3 id="search" class="border-bottom pb-2">
<span
*dsContextHelp="{
content: 'admin.access-control.groups.form.tooltip.editGroup.addEpeople',
@@ -66,7 +66,7 @@
>
{{messagePrefix + '.search.head' | translate}}
</span>
</h4>
</h3>
<form [formGroup]="searchForm" (ngSubmit)="search(searchForm.value)" class="d-flex justify-content-between">
<div class="flex-grow-1 mr-3">

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

@@ -2,7 +2,7 @@
<div class="groups-registry row">
<div class="col-12">
<div class="d-flex justify-content-between border-bottom mb-3">
<h2 id="header" class="pb-2">{{messagePrefix + 'head' | translate}}</h2>
<h1 id="header" class="pb-2">{{messagePrefix + 'head' | translate}}</h1>
<div>
<button class="mr-auto btn btn-success"
[routerLink]="'create'">
@@ -12,7 +12,7 @@
</div>
</div>
<h3 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | translate}}</h3>
<h2 id="search" class="border-bottom pb-2">{{messagePrefix + 'search.head' | translate}}</h2>
<form [formGroup]="searchForm" (ngSubmit)="search(searchForm.value)" class="d-flex justify-content-between">
<div class="flex-grow-1 mr-3">
<div class="form-group input-group">

2
src/app/admin/admin-curation-tasks/admin-curation-tasks.component.html
View File

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

2
src/app/admin/admin-import-metadata-page/metadata-import-page.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h2 id="header">{{'admin.metadata-import.page.header' | translate}}</h2>
<h1 id="header">{{'admin.metadata-import.page.header' | translate}}</h1>
<p>{{'admin.metadata-import.page.help' | translate}}</p>
<div class="form-group">
<div class="form-check">

4
src/app/admin/admin-registries/bitstream-formats/add-bitstream-format/add-bitstream-format.component.html
View File

@@ -1,8 +1,8 @@
<div class="container">
<div class="row">
<div class="col-12 mb-4">
<h2 id="sub-header"
class="border-bottom mb-2">{{ 'admin.registries.bitstream-formats.create.new' | translate }}</h2>
<h1 id="sub-header"
class="border-bottom pb-2">{{ 'admin.registries.bitstream-formats.create.new' | translate }}</h1>
<ds-bitstream-format-form (updatedFormat)="createBitstreamFormat($event)"></ds-bitstream-format-form>

5
src/app/admin/admin-registries/bitstream-formats/bitstream-formats.component.html
View File

@@ -2,7 +2,7 @@
<div class="bitstream-formats row">
<div class="col-12">
<h2 id="header" class="border-bottom pb-2 ">{{'admin.registries.bitstream-formats.head' | translate}}</h2>
<h1 id="header" class="border-bottom pb-2">{{'admin.registries.bitstream-formats.head' | translate}}</h1>
<p id="description">{{'admin.registries.bitstream-formats.description' | translate}}</p>
<p id="create-new" class="mb-2"><a [routerLink]="'add'" class="btn btn-success">{{'admin.registries.bitstream-formats.create.new' | translate}}</a></p>
@@ -19,7 +19,7 @@
<table id="formats" class="table table-striped table-hover">
<thead>
<tr>
<th scope="col"></th>
<th scope="col" [attr.aria-label]="'admin.registries.bitstream-formats.select' | translate"></th>
<th scope="col">{{'admin.registries.bitstream-formats.table.id' | translate}}</th>
<th scope="col">{{'admin.registries.bitstream-formats.table.name' | translate}}</th>
<th scope="col">{{'admin.registries.bitstream-formats.table.mimetype' | translate}}</th>
@@ -31,6 +31,7 @@
<td>
<label class="mb-0">
<input type="checkbox"
[attr.aria-label]="'admin.registries.bitstream-formats.select' | translate"
[checked]="isSelected(bitstreamFormat) | async"
(change)="selectBitStreamFormat(bitstreamFormat, $event)"
>

4
src/app/admin/admin-registries/bitstream-formats/edit-bitstream-format/edit-bitstream-format.component.html
View File

@@ -1,8 +1,8 @@
<div class="container">
<div class="row">
<div class="col-12 mb-4">
<h2 id="sub-header"
class="border-bottom mb-2">{{'admin.registries.bitstream-formats.edit.head' | translate:{format: (bitstreamFormatRD$ | async)?.payload.shortDescription} }}</h2>
<h1 id="sub-header"
class="border-bottom pb-2">{{'admin.registries.bitstream-formats.edit.head' | translate:{format: (bitstreamFormatRD$ | async)?.payload.shortDescription} }}</h1>
<ds-bitstream-format-form [bitstreamFormat]="(bitstreamFormatRD$ | async)?.payload" (updatedFormat)="updateFormat($event)"></ds-bitstream-format-form>

13
src/app/admin/admin-sidebar/admin-sidebar.component.html
View File

@@ -34,22 +34,21 @@
</div>
<div class="navbar-nav">
<div class="sidebar-section" id="sidebar-collapse-toggle">
<a class="nav-item nav-link sidebar-section d-flex flex-row flex-nowrap"
href="javascript:void(0);"
<button class="nav-item nav-link sidebar-section d-flex flex-row flex-nowrap border-0" type="button"
(click)="toggle($event)"
(keyup.space)="toggle($event)"
>
<div class="shortcut-icon">
<span class="shortcut-icon">
<i *ngIf="(menuCollapsed | async)" class="fas fa-fw fa-angle-double-right"
[title]="'menu.section.icon.pin' | translate"></i>
<i *ngIf="!(menuCollapsed | async)" class="fas fa-fw fa-angle-double-left"
[title]="'menu.section.icon.unpin' | translate"></i>
</div>
<div class="sidebar-collapsible">
</span>
<span class="sidebar-collapsible text-left">
<span *ngIf="menuCollapsed | async" class="section-header-text">{{'menu.section.pin' | translate }}</span>
<span *ngIf="!(menuCollapsed | async)" class="section-header-text">{{'menu.section.unpin' | translate }}</span>
</div>
</a>
</span>
</button>
</div>
</div>
</nav>

2
src/app/admin/admin-sidebar/admin-sidebar.component.spec.ts
View File

@@ -143,7 +143,7 @@ describe('AdminSidebarComponent', () => {
describe('when the collapse link is clicked', () => {
beforeEach(() => {
spyOn(menuService, 'toggleMenu');
const sidebarToggler = fixture.debugElement.query(By.css('#sidebar-collapse-toggle > a'));
const sidebarToggler = fixture.debugElement.query(By.css('#sidebar-collapse-toggle > button'));
sidebarToggler.triggerEventHandler('click', {
preventDefault: () => {/**/
}

2
src/app/bitstream-page/bitstream-download-page/bitstream-download-page.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h3>{{'bitstream.download.page' | translate:{ bitstream: dsoNameService.getName((bitstream$ | async)) } }}</h3>
<h1 class="h2">{{'bitstream.download.page' | translate:{ bitstream: dsoNameService.getName((bitstream$ | async)) } }}</h1>
<div class="pt-3">
<button (click)="back()" class="btn btn-outline-secondary">
<i class="fas fa-arrow-left"></i> {{'bitstream.download.page.back' | translate}}

2
src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.html
View File

@@ -8,7 +8,7 @@
<div class="container">
<div class="row">
<div class="col-12">
<h3>{{dsoNameService.getName(bitstreamRD?.payload)}} <span class="text-muted">({{bitstreamRD?.payload?.sizeBytes | dsFileSize}})</span></h3>
<h1 class="h2">{{dsoNameService.getName(bitstreamRD?.payload)}} <span class="text-muted">({{bitstreamRD?.payload?.sizeBytes | dsFileSize}})</span></h1>
</div>
</div>
</div>

1
src/app/browse-by/browse-by-taxonomy-page/browse-by-taxonomy-page.component.html
View File

@@ -1,4 +1,5 @@
<div class="container">
<h1>{{ ('browse.taxonomy_' + vocabularyName + '.title') | translate }}</h1>
<div class="mb-3">
<ds-vocabulary-treeview [vocabularyOptions]=vocabularyOptions
[multiSelect]="true"

4
src/app/collection-page/collection-item-mapper/collection-item-mapper.component.html
View File

@@ -6,7 +6,7 @@
<p>{{'collection.edit.item-mapper.description' | translate}}</p>
<ul ngbNav (navChange)="tabChange($event)" [destroyOnHide]="true" #tabs="ngbNav" class="nav-tabs">
<li [ngbNavItem]="'browseTab'">
<li [ngbNavItem]="'browseTab'" role="presentation">
<a ngbNavLink>{{'collection.edit.item-mapper.tabs.browse' | translate}}</a>
<ng-template ngbNavContent>
<div class="mt-2">
@@ -23,7 +23,7 @@
</div>
</ng-template>
</li>
<li [ngbNavItem]="'mapTab'">
<li [ngbNavItem]="'mapTab'" role="presentation">
<a ngbNavLink>{{'collection.edit.item-mapper.tabs.map' | translate}}</a>
<ng-template ngbNavContent>
<div class="row mt-2">

2
src/app/collection-page/delete-collection-page/delete-collection-page.component.html
View File

@@ -2,7 +2,7 @@
<div class="row">
<ng-container *ngVar="(dsoRD$ | async)?.payload as dso">
<div class="col-12 pb-4">
<h2 id="header" class="border-bottom pb-2">{{ 'collection.delete.head' | translate}}</h2>
<h1 id="header" class="border-bottom pb-2">{{ 'collection.delete.head' | translate}}</h1>
<p class="pb-2">{{ 'collection.delete.text' | translate:{ dso: dsoNameService.getName(dso) } }}</p>
<div class="form-group row">
<div class="col text-right space-children-mr">

2
src/app/collection-page/edit-collection-page/collection-curate/collection-curate.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h3>{{'collection.curate.header' |translate:{collection: (collectionName$ |async)} }}</h3>
<h2>{{'collection.curate.header' |translate:{collection: (collectionName$ |async)} }}</h2>
<ds-curation-form
[dsoHandle]="(dsoRD$|async)?.payload.handle"
></ds-curation-form>

2
src/app/collection-page/edit-collection-page/collection-source/collection-source.component.html
View File

@@ -18,7 +18,7 @@
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.metadata.save-button" | translate}}</span>
</button>
</div>
<h4>{{ 'collection.edit.tabs.source.head' | translate }}</h4>
<h2>{{ 'collection.edit.tabs.source.head' | translate }}</h2>
<div *ngIf="contentSource" class="form-check mb-4">
<input type="checkbox" class="form-check-input" id="externalSourceCheck"
[checked]="(contentSource?.harvestType !== harvestTypeNone)" (change)="changeExternalSource()">

2
src/app/collection-page/edit-item-template-page/edit-item-template-page.component.html
View File

@@ -2,7 +2,7 @@
<div class="row">
<div class="col-12" *ngVar="(itemRD$ | async) as itemRD">
<ng-container *ngIf="itemRD?.hasSucceeded">
<h2 class="border-bottom">{{ 'collection.edit.template.head' | translate:{ collection: dsoNameService.getName(collection) } }}</h2>
<h1 class="border-bottom">{{ 'collection.edit.template.head' | translate:{ collection: dsoNameService.getName(collection) } }}</h1>
<ds-themed-dso-edit-metadata [updateDataService]="itemTemplateService" [dso]="itemRD?.payload"></ds-themed-dso-edit-metadata>
<button [routerLink]="getCollectionEditUrl(collection)" class="btn btn-outline-secondary">{{ 'collection.edit.template.cancel' | translate }}</button>
</ng-container>

2
src/app/community-page/delete-community-page/delete-community-page.component.html
View File

@@ -2,7 +2,7 @@
<div class="row">
<ng-container *ngVar="(dsoRD$ | async)?.payload as dso">
<div class="col-12 pb-4">
<h2 id="header" class="border-bottom pb-2">{{ 'community.delete.head' | translate}}</h2>
<h1 id="header" class="border-bottom pb-2">{{ 'community.delete.head' | translate}}</h1>
<p class="pb-2">{{ 'community.delete.text' | translate:{ dso: dsoNameService.getName(dso) } }}</p>
<div class="form-group row">
<div class="col text-right space-children-mr">

2
src/app/community-page/edit-community-page/community-curate/community-curate.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h3>{{'community.curate.header' |translate:{community: (communityName$ |async)} }}</h3>
<h2>{{'community.curate.header' |translate:{community: (communityName$ |async)} }}</h2>
<ds-curation-form
[dsoHandle]="(dsoRD$|async)?.payload.handle"
></ds-curation-form>

4
src/app/core/breadcrumbs/dso-name.service.ts
View File

@@ -50,7 +50,7 @@ export class DSONameService {
}
},
OrgUnit: (dso: DSpaceObject): string => {
return dso.firstMetadataValue('organization.legalName');
return dso.firstMetadataValue('organization.legalName') || this.translateService.instant('dso.name.untitled');
},
Default: (dso: DSpaceObject): string => {
// If object doesn't have dc.title metadata use name property
@@ -106,7 +106,7 @@ export class DSONameService {
}
return `${familyName}, ${givenName}`;
} else if (entityType === 'OrgUnit') {
return this.firstMetadataValue(object, dso, 'organization.legalName');
return this.firstMetadataValue(object, dso, 'organization.legalName') || this.translateService.instant('dso.name.untitled');
}
return this.firstMetadataValue(object, dso, 'dc.title') || dso.name || this.translateService.instant('dso.name.untitled');
}

2
src/app/dso-shared/dso-edit-metadata/dso-edit-metadata-value/dso-edit-metadata-value.component.html
View File

@@ -4,6 +4,7 @@
<div class="flex-grow-1 ds-flex-cell ds-value-cell d-flex align-items-center" *ngVar="(mdRepresentation$ | async) as mdRepresentation" role="cell">
<div class="dont-break-out preserve-line-breaks" *ngIf="!mdValue.editing && !mdRepresentation">{{ mdValue.newValue.value }}</div>
<textarea class="form-control" rows="5" *ngIf="mdValue.editing && !mdRepresentation" [(ngModel)]="mdValue.newValue.value"
[attr.aria-label]="(dsoType + '.edit.metadata.edit.value') | translate"
[dsDebounce]="300" (onDebounce)="confirm.emit(false)"></textarea>
<div class="d-flex" *ngIf="mdRepresentation">
<a class="mr-2" target="_blank" [routerLink]="mdRepresentationItemRoute$ | async">{{ mdRepresentationName$ | async }}</a>
@@ -13,6 +14,7 @@
<div class="ds-flex-cell ds-lang-cell" role="cell">
<div class="dont-break-out preserve-line-breaks" *ngIf="!mdValue.editing">{{ mdValue.newValue.language }}</div>
<input class="form-control" type="text" *ngIf="mdValue.editing" [(ngModel)]="mdValue.newValue.language"
[attr.aria-label]="(dsoType + '.edit.metadata.edit.language') | translate"
[dsDebounce]="300" (onDebounce)="confirm.emit(false)" />
</div>
<div class="text-center ds-flex-cell ds-edit-cell" role="cell">

13
src/app/footer/footer.component.html
View File

@@ -62,21 +62,22 @@
<a class="text-white"
href="https://www.lyrasis.org/">{{ 'footer.link.lyrasis' | translate}}</a>
</p>
<ul class="footer-info list-unstyled small d-flex justify-content-center mb-0">
<ul class="footer-info list-unstyled d-flex justify-content-center mb-0">
<li>
<a class="text-white" href="javascript:void(0);"
(click)="showCookieSettings()">{{ 'footer.link.cookies' | translate}}</a>
<button class="btn btn-link text-white" type="button" (click)="showCookieSettings()">
{{ 'footer.link.cookies' | translate}}
</button>
</li>
<li *ngIf="showPrivacyPolicy">
<a class="text-white"
<a class="btn text-white"
routerLink="info/privacy">{{ 'footer.link.privacy-policy' | translate}}</a>
</li>
<li *ngIf="showEndUserAgreement">
<a class="text-white"
<a class="btn text-white"
routerLink="info/end-user-agreement">{{ 'footer.link.end-user-agreement' | translate}}</a>
</li>
<li *ngIf="showSendFeedback$ | async">
<a class="text-white"
<a class="btn text-white"
routerLink="info/feedback">{{ 'footer.link.feedback' | translate}}</a>
</li>
</ul>

14
src/app/footer/footer.component.scss
View File

@@ -26,9 +26,19 @@
li {
display: inline-flex;
a {
a, .btn-link {
padding: 0 calc(var(--bs-spacer) / 2);
color: inherit
color: inherit;
font-size: .875em;
&:focus {
box-shadow: none;
text-decoration: underline;
}
&:focus-visible {
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
}
}
&:not(:last-child) {

8
src/app/health-page/health-info/health-info-component/health-info-component.component.html
View File

@@ -1,16 +1,16 @@
<div *ngFor="let entry of healthInfoComponent | dsObjNgFor" data-test="collapse">
<div *ngIf="entry && !isPlainProperty(entry.value)" class="mb-3 border-bottom">
<div class="w-100 d-flex justify-content-between collapse-toggle" (click)="collapse.toggle()">
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" (click)="collapse.toggle()">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="!collapse.collapsed"
aria-controls="collapseExample">
[attr.aria-controls]="'health-info-component-' + entry.key + '-content'">
{{ entry.key | titlecase }}
</button>
<div class="d-inline-block">
<div class="d-flex my-auto">
<span *ngIf="collapse.collapsed" class="fas fa-chevron-down"></span>
<span *ngIf="!collapse.collapsed" class="fas fa-chevron-up"></span>
</div>
</div>
<div #collapse="ngbCollapse" [ngbCollapse]="isCollapsed">
<div #collapse="ngbCollapse" [id]="'health-info-component-' + entry.key + '-content'" [ngbCollapse]="isCollapsed">
<div class="card border-0">
<div class="card-body">
<ds-health-info-component [healthInfoComponent]="entry.value"

15
src/app/health-page/health-info/health-info.component.html
View File

@@ -2,14 +2,14 @@
<ngb-accordion #acc="ngbAccordion" [activeIds]="activeId">
<ngb-panel [id]="entry.key" *ngFor="let entry of healthInfoResponse | dsObjNgFor">
<ng-template ngbPanelHeader>
<div class="w-100 d-flex justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle(entry.key)" data-test="info-component">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="!acc.isExpanded(entry.key)"
aria-controls="collapsePanels">
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle(entry.key)" data-test="info-component">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="acc.isExpanded(entry.key)"
[attr.aria-controls]="'health-info-' + entry.key + '-content'">
{{ getPanelLabel(entry.key) | titlecase }}
</button>
<div class="text-right d-flex">
<div class="text-right d-flex gap-2">
<ds-health-status [status]="entry.value?.status"></ds-health-status>
<div class="ml-3 d-inline-block">
<div class="d-flex my-auto">
<span *ngIf="acc.isExpanded(entry.key)" class="fas fa-chevron-up fa-fw"></span>
<span *ngIf="!acc.isExpanded(entry.key)" class="fas fa-chevron-down fa-fw"></span>
</div>
@@ -17,8 +17,9 @@
</div>
</ng-template>
<ng-template ngbPanelContent>
<ds-health-info-component [healthInfoComponentName]="entry.key"
[healthInfoComponent]="entry.value"></ds-health-info-component>
<ds-health-info-component [healthInfoComponentName]="entry.key" [healthInfoComponent]="entry.value"
[id]="'health-info-' + entry.key + '-content'">
</ds-health-info-component>
</ng-template>
</ngb-panel>
</ngb-accordion>

6
src/app/health-page/health-page.component.html
View File

@@ -2,7 +2,7 @@
<h2>{{'health-page.heading' | translate}}</h2>
<div *ngIf="(healthResponse | async) && (healthInfoResponse | async)">
<ul ngbNav #nav="ngbNav" [activeId]="'status'" class="nav-tabs">
<li [ngbNavItem]="'status'">
<li [ngbNavItem]="'status'" role="presentation">
<a ngbNavLink>{{'health-page.status-tab' | translate}}</a>
<ng-template ngbNavContent>
<div id="status">
@@ -10,7 +10,7 @@
</div>
</ng-template>
</li>
<li [ngbNavItem]="'info'">
<li [ngbNavItem]="'info'" role="presentation">
<a ngbNavLink>{{'health-page.info-tab' | translate}}</a>
<ng-template ngbNavContent>
<div id="info">
@@ -21,7 +21,7 @@
</ul>
<div [ngbNavOutlet]="nav" class="mt-2"></div>
</div>
<ds-alert *ngIf="!(healthResponse | async) || !(healthInfoResponse | async)" [type]="'alert-danger'" [content]="'health-page.error.msg'"></ds-alert>
<ds-alert *ngIf="!(healthResponse | async) || !(healthInfoResponse | async)" [type]="AlertType.Error" [content]="'health-page.error.msg'"></ds-alert>
</div>

3
src/app/health-page/health-page.component.ts
View File

@@ -5,6 +5,7 @@ import { take } from 'rxjs/operators';
import { HealthService } from './health.service';
import { HealthInfoResponse, HealthResponse } from './models/health-component.model';
import { AlertType } from '../shared/alert/alert-type';
@Component({
selector: 'ds-health-page',
@@ -33,6 +34,8 @@ export class HealthPageComponent implements OnInit {
*/
healthInfoResponseInitialised: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
readonly AlertType = AlertType;
constructor(private healthDataService: HealthService) {
}

8
src/app/health-page/health-panel/health-component/health-component.component.html
View File

@@ -1,16 +1,16 @@
<ng-container *ngIf="healthComponent?.components">
<div *ngFor="let entry of healthComponent?.components | dsObjNgFor" class="mb-3 border-bottom" data-test="collapse">
<div class="w-100 d-flex justify-content-between collapse-toggle" (click)="collapse.toggle()">
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" (click)="collapse.toggle()">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="!collapse.collapsed"
aria-controls="collapseExample">
[attr.aria-controls]="'health-component-' + entry.key + 'content'">
{{ entry.key | titlecase }}
</button>
<div class="d-inline-block">
<div class="d-flex my-auto">
<span *ngIf="collapse.collapsed" class="fas fa-chevron-down"></span>
<span *ngIf="!collapse.collapsed" class="fas fa-chevron-up"></span>
</div>
</div>
<div #collapse="ngbCollapse" [ngbCollapse]="isCollapsed">
<div #collapse="ngbCollapse" [id]="'health-component-' + entry.key + 'content'" [ngbCollapse]="isCollapsed">
<div class="card border-0">
<div class="card-body">
<ds-health-component [healthComponent]="entry.value"

21
src/app/health-page/health-panel/health-panel.component.html
View File

@@ -1,15 +1,18 @@
<p class="h4">{{'health-page.status' | translate}} : <ds-health-status [status]="healthResponse.status"></ds-health-status></p>
<p class="h4">
{{'health-page.status' | translate}}:
<ds-health-status [status]="healthResponse.status" class="d-inline-flex"></ds-health-status>
</p>
<ngb-accordion #acc="ngbAccordion" [activeIds]="activeId">
<ngb-panel [id]="entry.key" *ngFor="let entry of healthResponse.components | dsObjNgFor">
<ng-template ngbPanelHeader>
<div class="w-100 d-flex justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle(entry.key)" data-test="component">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="!acc.isExpanded(entry.key)"
aria-controls="collapsePanels">
<div class="w-100 d-flex gap-3 justify-content-between collapse-toggle" ngbPanelToggle (click)="acc.toggle(entry.key)" data-test="component">
<button type="button" class="btn btn-link p-0" (click)="$event.preventDefault()" [attr.aria-expanded]="acc.isExpanded(entry.key)"
[attr.aria-controls]="'health-panel-' + entry.key + '-content'">
{{ getPanelLabel(entry.key) | titlecase }}
</button>
<div class="text-right d-flex">
<div class="text-right d-flex gap-2">
<ds-health-status [status]="entry.value?.status"></ds-health-status>
<div class="ml-3 d-inline-block">
<div class="d-flex my-auto">
<span *ngIf="acc.isExpanded(entry.key)" class="fas fa-chevron-up fa-fw"></span>
<span *ngIf="!acc.isExpanded(entry.key)" class="fas fa-chevron-down fa-fw"></span>
</div>
@@ -17,9 +20,9 @@
</div>
</ng-template>
<ng-template ngbPanelContent>
<ds-health-component [healthComponent]="entry.value" [healthComponentName]="entry.key"></ds-health-component>
<ds-health-component [healthComponent]="entry.value" [healthComponentName]="entry.key"
[id]="'health-panel-' + entry.key + '-content'" role="presentation">
</ds-health-component>
</ng-template>
</ngb-panel>
</ngb-accordion>

6
src/app/health-page/health-panel/health-status/health-status.component.html
View File

@@ -1,12 +1,12 @@
<ng-container [ngSwitch]="status">
<i *ngSwitchCase="HealthStatus.UP"
class="fa fa-check-circle text-success ml-2 mt-1"
class="fa fa-check-circle text-success my-auto"
ngbTooltip="{{'health-page.status.ok.info' | translate}}" container="body" ></i>
<i *ngSwitchCase="HealthStatus.UP_WITH_ISSUES"
class="fa fa-exclamation-triangle text-warning ml-2 mt-1"
class="fa fa-exclamation-triangle text-warning my-auto"
ngbTooltip="{{'health-page.status.warning.info' | translate}}" container="body"></i>
<i *ngSwitchCase="HealthStatus.DOWN"
class="fa fa-times-circle text-danger ml-2 mt-1"
class="fa fa-times-circle text-danger my-auto"
ngbTooltip="{{'health-page.status.error.info' | translate}}" container="body"></i>
</ng-container>

3
src/app/health-page/health-panel/health-status/health-status.component.scss
View File

@@ -0,0 +1,3 @@
:host {
display: flex;
}

2
src/app/info/feedback/feedback-form/feedback-form.component.html
View File

@@ -1,7 +1,7 @@
<div class="row row-offcanvas row-offcanvas-right">
<div class="col-xs-12 col-sm-12 col-md-9">
<form class="primary" [formGroup]="feedbackForm" (ngSubmit)="createFeedback()">
<h2>{{ 'info.feedback.head' | translate }}</h2>
<h1>{{ 'info.feedback.head' | translate }}</h1>
<p>{{ 'info.feedback.info' | translate }}</p>
<fieldset class="col p-0">
<div class="row">

2
src/app/item-page/bitstreams/request-a-copy/bitstream-request-a-copy-page.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h3 class="mb-4">{{'bitstream-request-a-copy.header' | translate}}</h3>
<h1 class="mb-4">{{'bitstream-request-a-copy.header' | translate}}</h1>
<div *ngIf="canDownload$|async" class="alert alert-success">
<span>{{'bitstream-request-a-copy.alert.canDownload1' | translate}}</span>
<a [routerLink]="getBitstreamLink()">{{'bitstream-request-a-copy.alert.canDownload2'| translate}}</a>

2
src/app/item-page/bitstreams/upload/upload-bitstream.component.html
View File

@@ -2,7 +2,7 @@
<ng-container *ngIf="bundles">
<div class="row">
<div class="col-12 mb-2">
<h2>{{'item.bitstreams.upload.title' | translate}}</h2>
<h1>{{'item.bitstreams.upload.title' | translate}}</h1>
<ng-container *ngVar="(itemRD$ | async)?.payload as item">
<div *ngIf="item">
<span class="font-weight-bold">{{'item.bitstreams.upload.item' | translate}}</span>

8
src/app/item-page/edit-item-page/edit-item-page.component.html
View File

@@ -1,14 +1,16 @@
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="border-bottom">{{'item.edit.head' | translate}}</h2>
<h1 class="border-bottom">{{'item.edit.head' | translate}}</h1>
<div class="pt-2">
<ul class="nav nav-tabs justify-content-start" role="tablist">
<li *ngFor="let page of pages" class="nav-item" [attr.aria-selected]="page.page === currentPage" role="tab">
<li *ngFor="let page of pages" class="nav-item" role="presentation">
<a *ngIf="(page.enabled | async)"
[attr.aria-selected]="page.page === currentPage"
class="nav-link"
[ngClass]="{'active' : page.page === currentPage}"
[routerLink]="['./' + page.page]">
[routerLink]="['./' + page.page]"
role="tab">
{{'item.edit.tabs.' + page.page + '.head' | translate}}
</a>
<span [ngbTooltip]="'item.edit.tabs.disabled.tooltip' | translate">

7
src/app/item-page/edit-item-page/item-bitstreams/item-bitstreams.component.html
View File

@@ -1,21 +1,25 @@
<div class="item-bitstreams" *ngVar="(bundles$ | async) as bundles">
<div class="button-row top d-flex mt-2 space-children-mr">
<button class="mr-auto btn btn-success"
[attr.aria-label]="'item.edit.bitstreams.upload-button' | translate"
[routerLink]="[itemPageRoute, 'bitstreams', 'new']"><i
class="fas fa-upload"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.bitstreams.upload-button" | translate}}</span>
</button>
<button class="btn btn-warning" *ngIf="isReinstatable() | async"
[attr.aria-label]="'item.edit.bitstreams.reinstate-button' | translate"
(click)="reinstate()"><i
class="fas fa-undo-alt"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.bitstreams.reinstate-button" | translate}}</span>
</button>
<button class="btn btn-primary" [disabled]="!(hasChanges() | async) || submitting"
[attr.aria-label]="'item.edit.bitstreams.save-button' | translate"
(click)="submit()"><i
class="fas fa-save"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.bitstreams.save-button" | translate}}</span>
</button>
<button class="btn btn-danger" *ngIf="!(isReinstatable() | async)"
[attr.aria-label]="'item.edit.bitstreams.discard-button' | translate"
[disabled]="!(hasChanges() | async) || submitting"
(click)="discard()"><i
class="fas fa-times"></i>
@@ -49,16 +53,19 @@
<div class="button-row bottom">
<div class="mt-4 float-right space-children-mr ml-gap">
<button class="btn btn-warning" *ngIf="isReinstatable() | async"
[attr.aria-label]="'item.edit.bitstreams.reinstate-button' | translate"
(click)="reinstate()"><i
class="fas fa-undo-alt"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.bitstreams.reinstate-button" | translate}}</span>
</button>
<button class="btn btn-primary" [disabled]="!(hasChanges() | async) || submitting"
[attr.aria-label]="'item.edit.bitstreams.save-button' | translate"
(click)="submit()"><i
class="fas fa-save"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.bitstreams.save-button" | translate}}</span>
</button>
<button class="btn btn-danger" *ngIf="!(isReinstatable() | async)"
[attr.aria-label]="'item.edit.bitstreams.discard-button' | translate"
[disabled]="!(hasChanges() | async) || submitting"
(click)="discard()"><i
class="fas fa-times"></i>

1
src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.html
View File

@@ -10,6 +10,7 @@
<div class="btn-group bundle-action-buttons">
<button [routerLink]="[itemPageRoute, 'bitstreams', 'new']"
[queryParams]="{bundle: bundle.id}"
[attr.aria-label]="'item.edit.bitstreams.bundle.edit.buttons.upload' | translate"
class="btn btn-outline-success btn-sm"
title="{{'item.edit.bitstreams.bundle.edit.buttons.upload' | translate}}">
<i class="fas fa-upload fa-fw"></i>

4
src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream/item-edit-bitstream.component.html
View File

@@ -26,21 +26,25 @@
<div class="text-center w-100">
<div class="btn-group relationship-action-buttons">
<a *ngIf="bitstreamDownloadUrl != null" [routerLink]="bitstreamDownloadUrl"
[attr.aria-label]="'item.edit.bitstreams.edit.buttons.download' | translate"
class="btn btn-outline-primary btn-sm"
title="{{'item.edit.bitstreams.edit.buttons.download' | translate}}"
[attr.data-test]="'download-button' | dsBrowserOnly">
<i class="fas fa-download fa-fw"></i>
</a>
<button [routerLink]="['/bitstreams/', bitstream.id, 'edit']" class="btn btn-outline-primary btn-sm"
[attr.aria-label]="'item.edit.bitstreams.edit.buttons.edit' | translate"
title="{{'item.edit.bitstreams.edit.buttons.edit' | translate}}">
<i class="fas fa-edit fa-fw"></i>
</button>
<button [disabled]="!canRemove()" (click)="remove()"
[attr.aria-label]="'item.edit.bitstreams.edit.buttons.remove' | translate"
class="btn btn-outline-danger btn-sm"
title="{{'item.edit.bitstreams.edit.buttons.remove' | translate}}">
<i class="fas fa-trash-alt fa-fw"></i>
</button>
<button [disabled]="!canUndo()" (click)="undo()"
[attr.aria-label]="'item.edit.bitstreams.edit.buttons.undo' | translate"
class="btn btn-outline-warning btn-sm"
title="{{'item.edit.bitstreams.edit.buttons.undo' | translate}}">
<i class="fas fa-undo-alt fa-fw"></i>

4
src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.html
View File

@@ -6,7 +6,7 @@
<p>{{'item.edit.item-mapper.description' | translate}}</p>
<ul ngbNav (navChange)="tabChange($event)" [destroyOnHide]="true" #tabs="ngbNav" class="nav-tabs">
<li [ngbNavItem]="'browseTab'">
<li [ngbNavItem]="'browseTab'" role="presentation">
<a ngbNavLink>{{'item.edit.item-mapper.tabs.browse' | translate}}</a>
<ng-template ngbNavContent>
<div class="mt-2">
@@ -22,7 +22,7 @@
</div>
</ng-template>
</li>
<li [ngbNavItem]="'mapTab'">
<li [ngbNavItem]="'mapTab'" role="presentation">
<a ngbNavLink>{{'item.edit.item-mapper.tabs.map' | translate}}</a>
<ng-template ngbNavContent>
<div class="row mt-2">

2
src/app/item-page/edit-item-page/item-curate/item-curate.component.html
View File

@@ -1,5 +1,5 @@
<div class="container mt-3">
<h3>{{'item.edit.curate.title' |translate:{item: (itemName$ |async)} }}</h3>
<h2>{{'item.edit.curate.title' |translate:{item: (itemName$ |async)} }}</h2>
<ds-curation-form
*ngIf="dsoRD$ | async as dsoRD"
[dsoHandle]="dsoRD?.payload.handle"

2
src/app/item-page/edit-item-page/item-delete/item-delete.component.html
View File

@@ -2,7 +2,7 @@
<div class="row">
<div class="col-12">
<h2>{{headerMessage | translate: {id: item.handle} }}</h2>
<h1>{{headerMessage | translate: {id: item.handle} }}</h1>
<p>{{descriptionMessage | translate}}</p>
<ds-modify-item-overview [item]="item"></ds-modify-item-overview>

2
src/app/item-page/edit-item-page/item-delete/item-delete.component.spec.ts
View File

@@ -171,7 +171,7 @@ describe('ItemDeleteComponent', () => {
});
it('should render a page with messages based on the \'delete\' messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.delete.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;
expect(description.innerHTML).toContain('item.edit.delete.description');

2
src/app/item-page/edit-item-page/item-move/item-move.component.html
View File

@@ -1,7 +1,7 @@
<div class="container">
<div class="row">
<div class="col-12">
<h2>{{'item.edit.move.head' | translate: {id: (itemRD$ | async)?.payload?.handle} }}</h2>
<h1>{{'item.edit.move.head' | translate: {id: (itemRD$ | async)?.payload?.handle} }}</h1>
<p>{{'item.edit.move.description' | translate}}</p>
<div class="row">
<div class="col-12">

2
src/app/item-page/edit-item-page/item-private/item-private.component.spec.ts
View File

@@ -80,7 +80,7 @@ describe('ItemPrivateComponent', () => {
});
it('should render a page with messages based on the \'private\' messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.private.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;
expect(description.innerHTML).toContain('item.edit.private.description');

2
src/app/item-page/edit-item-page/item-public/item-public.component.spec.ts
View File

@@ -74,7 +74,7 @@ describe('ItemPublicComponent', () => {
});
it('should render a page with messages based on the \'public\' messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.public.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;
expect(description.innerHTML).toContain('item.edit.public.description');

2
src/app/item-page/edit-item-page/item-reinstate/item-reinstate.component.spec.ts
View File

@@ -76,7 +76,7 @@ describe('ItemReinstateComponent', () => {
});
it('should render a page with messages based on the \'reinstate\' messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.reinstate.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;
expect(description.innerHTML).toContain('item.edit.reinstate.description');

4
src/app/item-page/edit-item-page/item-relationships/edit-relationship-list/edit-relationship-list.component.html
View File

@@ -1,10 +1,10 @@
<h5>
<h2 class="h4">
{{getRelationshipMessageKey() | async | translate}}
<button class="ml-2 btn btn-success" [disabled]="(hasChanges | async)" (click)="openLookup()">
<i class="fas fa-plus"></i>
<span class="d-none d-sm-inline">&nbsp;{{"item.edit.relationships.edit.buttons.add" | translate}}</span>
</button>
</h5>
</h2>
<ng-container *ngVar="updates$ | async as updates">
<ng-container *ngIf="updates && !(loading$ | async)">
<ng-container *ngVar="updates | dsObjectValues as updateValues">

2
src/app/item-page/edit-item-page/item-withdraw/item-withdraw.component.spec.ts
View File

@@ -74,7 +74,7 @@ describe('ItemWithdrawComponent', () => {
});
it('should render a page with messages based on the \'withdraw\' messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.withdraw.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;
expect(description.innerHTML).toContain('item.edit.withdraw.description');

2
src/app/item-page/edit-item-page/simple-item-action/abstract-simple-item-action.component.html
View File

@@ -1,7 +1,7 @@
<div class="container">
<div class="row">
<div class="col-12">
<h2>{{headerMessage | translate: {id: item.handle} }}</h2>
<h1>{{headerMessage | translate: {id: item.handle} }}</h1>
<p>{{descriptionMessage | translate}}</p>
<ds-modify-item-overview [item]="item"></ds-modify-item-overview>
<div class="space-children-mr">

2
src/app/item-page/edit-item-page/simple-item-action/abstract-simple-item-action.component.spec.ts
View File

@@ -111,7 +111,7 @@ describe('AbstractSimpleItemActionComponent', () => {
});
it('should render a page with messages based on the provided messageKey', () => {
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
const header = fixture.debugElement.query(By.css('h1')).nativeElement;
expect(header.innerHTML).toContain('item.edit.myEditAction.header');
const description = fixture.debugElement.query(By.css('p')).nativeElement;

4
src/app/item-page/full/field-components/file-section/full-file-section.component.html
View File

@@ -1,7 +1,7 @@
<ds-metadata-field-wrapper [label]="label | translate">
<div *ngVar="(originals$ | async)?.payload as originals">
<div *ngIf="hasValuesInBundle(originals)">
<h5 class="simple-view-element-header">{{"item.page.filesection.original.bundle" | translate}}</h5>
<h3 class="h5 simple-view-element-header">{{"item.page.filesection.original.bundle" | translate}}</h3>
<ds-pagination *ngIf="originals?.page?.length > 0"
[hideGear]="true"
[hidePagerWhenSinglePage]="true"
@@ -44,7 +44,7 @@
</div>
<div *ngVar="(licenses$ | async)?.payload as licenses">
<div *ngIf="hasValuesInBundle(licenses)">
<h5 class="simple-view-element-header">{{"item.page.filesection.license.bundle" | translate}}</h5>
<h3 class="h5 simple-view-element-header">{{"item.page.filesection.license.bundle" | translate}}</h3>
<ds-pagination *ngIf="licenses?.page?.length > 0"
[hideGear]="true"
[hidePagerWhenSinglePage]="true"

2
src/app/item-page/orcid-page/orcid-auth/orcid-auth.component.html
View File

@@ -1,5 +1,5 @@
<div class="container mb-5">
<h2>{{'person.orcid.registry.auth' | translate}}</h2>
<h1>{{'person.orcid.registry.auth' | translate}}</h1>
<ng-container *ngIf="(isLinkedToOrcid() | async); then orcidLinked; else orcidNotLinked"></ng-container>
</div>

20
src/app/item-page/orcid-page/orcid-page.component.html
View File

@@ -1,13 +1,3 @@
<div *ngIf="!(processingConnection | async) && (item | async)" class="container">
<div class="button-row bottom mb-3">
<div class="text-right">
<a [routerLink]="getItemPage()" role="button" class="btn btn-outline-secondary" data-test="back-button">
<i class="fas fa-arrow-left"></i> {{'item.orcid.return' | translate}}
</a>
</div>
</div>
</div>
<ds-loading *ngIf="(processingConnection | async)" [message]="'person.page.orcid.link.processing' | translate"></ds-loading>
<div class="container" *ngIf="!(processingConnection | async) && !(connectionStatus | async)" data-test="error-box">
<ds-alert [type]="'alert-danger'">{{'person.page.orcid.link.error.message' | translate}}</ds-alert>
@@ -17,3 +7,13 @@
<ds-orcid-sync-setting *ngIf="isLinkedToOrcid()" [item]="(item | async)" (settingsUpdated)="updateItem()" data-test="orcid-sync-setting"></ds-orcid-sync-setting>
<ds-orcid-queue *ngIf="isLinkedToOrcid()" [item]="(item | async)"></ds-orcid-queue>
</ng-container>
<div *ngIf="!(processingConnection | async) && (item | async)" class="container">
<div class="button-row bottom mb-3">
<div class="text-right">
<a [routerLink]="getItemPage()" role="button" class="btn btn-outline-secondary" data-test="back-button">
<i class="fas fa-arrow-left"></i> {{'item.orcid.return' | translate}}
</a>
</div>
</div>
</div>

2
src/app/item-page/simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component.html
View File

@@ -1,6 +1,6 @@
<ng-container *ngIf="relationTypes.length > 1">
<ul ngbNav #tabs="ngbNav" [destroyOnHide]="true" [activeId]="activeTab$ | async" (navChange)="onTabChange($event)" class="nav-tabs">
<li *ngFor="let relationType of relationTypes" [ngbNavItem]="relationType.filter">
<li *ngFor="let relationType of relationTypes" [ngbNavItem]="relationType.filter" rel="presentation">
<a ngbNavLink>{{'item.page.relationships.' + relationType.label | translate}}</a>
<ng-template ngbNavContent>
<div class="mt-4">

7
src/app/item-page/versions/item-versions.component.html
View File

@@ -1,7 +1,7 @@
<div *ngVar="(versionsRD$ | async)?.payload as versions">
<div *ngVar="(versionRD$ | async)?.payload as itemVersion">
<div class="mb-2" *ngIf="versions?.page?.length > 0 || displayWhenEmpty">
<h2 *ngIf="displayTitle">{{"item.version.history.head" | translate}}</h2>
<h2 *ngIf="displayTitle" class="h4">{{"item.version.history.head" | translate}}</h2>
<ds-alert [type]="AlertTypeEnum.Info" *ngIf="itemVersion">
{{ "item.version.history.selected.alert" | translate : {version: itemVersion.version} }}
</ds-alert>
@@ -98,8 +98,9 @@
<ng-container *ngIf="isThisBeingEdited(version); then editSummary else showSummary"></ng-container>
<ng-template #showSummary>{{version?.summary}}</ng-template>
<ng-template #editSummary>
<input class="form-control" type="text" [(ngModel)]="versionBeingEditedSummary"
(keyup.enter)="onSummarySubmit()"/>
<input [attr.aria-label]="'item.version.history.table.action.editSummary' | translate"
[(ngModel)]="versionBeingEditedSummary" (keyup.enter)="onSummarySubmit()"
class="form-control" type="text"/>
</ng-template>
</div>

5
src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-external-dropdown/my-dspace-new-external-dropdown.component.html
View File

@@ -1,5 +1,6 @@
<div class="add" *ngIf="!(moreThanOne$ | async)">
<button class="btn btn-lg btn-outline-primary mt-1 ml-2" [disabled]="!(initialized$|async)"
<button class="btn btn-lg btn-outline-primary mt-1 ml-2"
[attr.aria-label]="'mydspace.new-submission-external' | translate" [disabled]="!(initialized$|async)"
(click)="openPage(singleEntity)" role="button"
title="{{'mydspace.new-submission-external' | translate}}">
<i class="fa fa-file-import" aria-hidden="true"></i>
@@ -10,7 +11,7 @@
*ngIf="(moreThanOne$ | async)">
<button class="btn btn-lg btn-outline-primary mt-1 ml-2" id="dropdownImport" ngbDropdownToggle
type="button" [disabled]="!(initialized$|async)"
attr.aria-label="{{'mydspace.new-submission-external' | translate}}"
[attr.aria-label]="'mydspace.new-submission-external' | translate"
[attr.data-test]="'import-dropdown' | dsBrowserOnly"
title="{{'mydspace.new-submission-external' | translate}}">
<i class="fa fa-file-import" aria-hidden="true"></i>

5
src/app/my-dspace-page/my-dspace-new-submission/my-dspace-new-submission-dropdown/my-dspace-new-submission-dropdown.component.html
View File

@@ -1,5 +1,6 @@
<div class="add" *ngIf="!(moreThanOne$ | async)">
<button class="btn btn-lg btn-primary mt-1 ml-2" [disabled]="!(initialized$|async)" (click)="openDialog(singleEntity)" role="button">
<button class="btn btn-lg btn-primary mt-1 ml-2" [attr.aria-label]="'mydspace.new-submission' | translate"
[disabled]="!(initialized$|async)" (click)="openDialog(singleEntity)" role="button">
<i class="fa fa-plus-circle" aria-hidden="true"></i>
</button>
</div>
@@ -8,7 +9,7 @@
*ngIf="(moreThanOne$ | async)">
<button class="btn btn-lg btn-primary mt-1 ml-2" id="dropdownSubmission" ngbDropdownToggle
type="button" [disabled]="!(initialized$|async)"
attr.aria-label="{{'mydspace.new-submission' | translate}}"
[attr.aria-label]="'mydspace.new-submission' | translate"
[attr.data-test]="'submission-dropdown' | dsBrowserOnly"
title="{{'mydspace.new-submission' | translate}}">
<i class="fa fa-plus-circle" aria-hidden="true"></i>

6
src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
View File

@@ -5,13 +5,13 @@
(keydown.space)="$event.preventDefault()"
(mouseenter)="activateSection($event)"
(mouseleave)="deactivateSection($event)">
<a href="javascript:void(0);" class="nav-link dropdown-toggle" routerLinkActive="active"
<button class="btn btn-link nav-link dropdown-toggle" routerLinkActive="active" type="button"
[class.disabled]="section.model?.disabled"
id="browseDropdown" (click)="toggleSection($event)"
(click)="toggleSection($event)"
data-toggle="dropdown">
<ng-container
*ngComponentOutlet="(sectionMap$ | async).get(section.id).component; injector: (sectionMap$ | async).get(section.id).injector;"></ng-container>
</a>
</button>
<ul @slide *ngIf="(active | async)" (click)="deactivateSection($event)"
class="m-0 shadow-none border-top-0 dropdown-menu show">
<li *ngFor="let subSection of (subSections$ | async)">

9
src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.scss
View File

@@ -5,6 +5,15 @@
justify-content: center;
}
.btn.nav-link {
text-align: left;
border: none;
&:active, &:focus {
box-shadow: none !important;
}
}
.dropdown-menu {
background-color: var(--ds-expandable-navbar-bg);
overflow: hidden;

8
src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts
View File

@@ -152,7 +152,7 @@ describe('ExpandableNavbarSectionComponent', () => {
describe('when a click occurs on the section header', () => {
beforeEach(() => {
spyOn(menuService, 'toggleActiveSection');
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > a'));
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > button'));
sidebarToggler.triggerEventHandler('click', {
preventDefault: () => {/**/
}
@@ -195,7 +195,7 @@ describe('ExpandableNavbarSectionComponent', () => {
describe('when the mouse enters the section header', () => {
beforeEach(() => {
spyOn(menuService, 'activateSection');
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > a'));
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > button'));
sidebarToggler.triggerEventHandler('mouseenter', {
preventDefault: () => {/**/
}
@@ -210,7 +210,7 @@ describe('ExpandableNavbarSectionComponent', () => {
describe('when the mouse leaves the section header', () => {
beforeEach(() => {
spyOn(menuService, 'deactivateSection');
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > a'));
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > button'));
sidebarToggler.triggerEventHandler('mouseleave', {
preventDefault: () => {/**/
}
@@ -225,7 +225,7 @@ describe('ExpandableNavbarSectionComponent', () => {
describe('when a click occurs on the section header link', () => {
beforeEach(() => {
spyOn(menuService, 'toggleActiveSection');
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > a'));
const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown > button'));
sidebarToggler.triggerEventHandler('click', {
preventDefault: () => {/**/
}

4
src/app/navbar/navbar.component.scss
View File

@@ -37,8 +37,8 @@ nav.navbar {
}
}
.navbar-nav {
::ng-deep a.nav-link {
.navbar-nav ::ng-deep {
a.nav-link, .btn.nav-link {
color: var(--ds-navbar-link-color);
&:hover, &:focus {

2
src/app/process-page/detail/process-detail-field/process-detail-field.component.html
View File

@@ -1,2 +1,2 @@
<h4 class="mt-4">{{title | translate}}</h4>
<h2 class="h3 mt-4">{{title | translate}}</h2>
<ng-content></ng-content>

2
src/app/process-page/detail/process-detail-field/process-detail-field.component.spec.ts
View File

@@ -32,7 +32,7 @@ describe('ProcessDetailFieldComponent', () => {
});
it('should display the given title', () => {
const header = fixture.debugElement.query(By.css('h4')).nativeElement;
const header = fixture.debugElement.query(By.css('h2')).nativeElement;
expect(header.textContent).toContain(title);
});
});

6
src/app/process-page/detail/process-detail.component.html
View File

@@ -1,9 +1,9 @@
<div class="container" *ngIf="(processRD$ | async)?.payload as process">
<div class="row">
<div class="col-10">
<h2 class="flex-grow-1">
<h1 class="flex-grow-1">
{{ 'process.detail.title' | translate:{ id: process?.processId, name: process?.scriptName } }}
</h2>
</h1>
</div>
<div *ngIf="refreshCounter$ | async as seconds" class="col-2 refresh-counter">
Refreshing in {{ seconds }}s <i class="fas fa-sync-alt fa-spin"></i>
@@ -53,7 +53,7 @@
</button>
<ds-themed-loading *ngIf="retrievingOutputLogs$ | async" class="ds-themed-loading"
message="{{ 'process.detail.logs.loading' | translate }}"></ds-themed-loading>
<pre class="font-weight-bold text-secondary bg-light p-3"
<pre class="font-weight-bold text-secondary bg-light p-3" tabindex="0"
*ngIf="showOutputLogs && (outputLogs$ | async)?.length > 0">{{ (outputLogs$ | async) }}</pre>
<p id="no-output-logs-message" *ngIf="(!(retrievingOutputLogs$ | async) && showOutputLogs)
&& !(outputLogs$ | async) || (outputLogs$ | async)?.length == 0 || !process._links.output">

12
src/app/process-page/form/process-form.component.html
View File

@@ -1,18 +1,18 @@
<div class="container">
<div class="row">
<h2 class="col-12">
<h1 class="col-12">
{{headerKey | translate}}
</h2>
<div class="col-12 col-md-6">
</h1>
<div class="col-12 col-md-6 mb-2">
<form #form="ngForm" (ngSubmit)="submitForm(form)">
<ds-scripts-select [script]="selectedScript" (select)="selectedScript = $event; parameters = undefined"></ds-scripts-select>
<ds-process-parameters [initialParams]="parameters" [script]="selectedScript" (updateParameters)="parameters = $event"></ds-process-parameters>
<button [routerLink]="['/processes']" class="btn btn-light float-left">{{ 'process.new.cancel' | translate }}</button>
<button type="submit" class="btn btn-light float-right">{{ 'process.new.submit' | translate }}</button>
<a [routerLink]="['/processes']" class="btn btn-danger float-left">{{ 'process.new.cancel' | translate }}</a>
<button type="submit" class="btn btn-primary float-right">{{ 'process.new.submit' | translate }}</button>
</form>
</div>
<div class="col-12 col-md-6">
<ds-script-help [script]="selectedScript"></ds-script-help>
<ds-script-help *ngIf="selectedScript" [script]="selectedScript"></ds-script-help>
</div>
</div>

12
src/app/process-page/form/process-parameters/parameter-select/parameter-select.component.html
View File

@@ -1,16 +1,20 @@
<div class="form-row mb-2 mx-0">
<div class="form-row gap-2 mb-2 mx-0">
<select id="process-parameters"
class="form-control col"
name="parameter-{{index}}"
[attr.aria-label]="'process.new.select-parameter' | translate"
[(ngModel)]="selectedParameter"
#param="ngModel">
<option [ngValue]="undefined">Add a parameter...</option>
<option [ngValue]="undefined">{{ 'process.new.add-parameter' | translate }}</option>
<option *ngFor="let param of parameters" [ngValue]="param.name">
{{param.nameLong || param.name}}
</option>
</select>
<ds-parameter-value-input [initialValue]="parameterValue.value" [parameter]="selectedScriptParameter" (updateValue)="selectedParameterValue = $event" class="d-block col" [index]="index"></ds-parameter-value-input>
<button *ngIf="removable" class="btn btn-light col-1 remove-button" (click)="removeParameter.emit(parameterValue);"><span class="fas fa-trash"></span></button>
<ds-parameter-value-input [initialValue]="parameterValue.value" [parameter]="selectedScriptParameter" (updateValue)="selectedParameterValue = $event" class="d-block col px-0" [index]="index"></ds-parameter-value-input>
<button *ngIf="removable" [attr.aria-label]="'process.new.delete-parameter' | translate"
(click)="removeParameter.emit(parameterValue);" class="btn btn-danger col-1 remove-button">
<i class="fas fa-trash"></i>
</button>
<span *ngIf="!removable" class="col-1"></span>
</div>

7
src/app/process-page/form/process-parameters/parameter-select/parameter-select.component.spec.ts
View File

@@ -1,5 +1,5 @@
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
import { TranslateModule } from '@ngx-translate/core';
import { ParameterSelectComponent } from './parameter-select.component';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { FormsModule } from '@angular/forms';
@@ -33,7 +33,10 @@ describe('ParameterSelectComponent', () => {
beforeEach(waitForAsync(() => {
init();
TestBed.configureTestingModule({
imports: [FormsModule],
imports: [
FormsModule,
TranslateModule.forRoot(),
],
declarations: [ParameterSelectComponent],
schemas: [NO_ERRORS_SCHEMA]
})

2
src/app/process-page/form/process-parameters/parameter-value-input/boolean-value-input/boolean-value-input.component.html
View File

@@ -1 +1 @@
<input type="hidden" value="true" name="boolean-value-{{index}}" id="boolean-value-{{index}}"/>
<input [attr.aria-label]="'process.new.parameter.label' | translate" type="hidden" value="true" name="boolean-value-{{index}}" id="boolean-value-{{index}}"/>

5
src/app/process-page/form/process-parameters/parameter-value-input/boolean-value-input/boolean-value-input.component.spec.ts
View File

@@ -1,5 +1,5 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { TranslateModule } from '@ngx-translate/core';
import { BooleanValueInputComponent } from './boolean-value-input.component';
describe('BooleanValueInputComponent', () => {
@@ -8,6 +8,9 @@ describe('BooleanValueInputComponent', () => {
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot(),
],
declarations: [BooleanValueInputComponent]
})
.compileComponents();

4
src/app/process-page/form/process-parameters/parameter-value-input/date-value-input/date-value-input.component.html
View File

@@ -1,6 +1,6 @@
<input required #string="ngModel" type="text" class="form-control" name="date-value-{{index}}" id="date-value-{{index}}" [ngModel]="value" (ngModelChange)="setValue($event)"/>
<input [attr.aria-label]="'process.new.parameter.label' | translate" required #string="ngModel" type="text" class="form-control" name="date-value-{{index}}" id="date-value-{{index}}" [ngModel]="value" (ngModelChange)="setValue($event)"/>
<div *ngIf="string.invalid && (string.dirty || string.touched)"
class="alert alert-danger validation-error">
class="alert alert-danger validation-error mb-0">
<div *ngIf="string.errors.required">
{{'process.new.parameter.string.required' | translate}}
</div>

5
src/app/process-page/form/process-parameters/parameter-value-input/date-value-input/date-value-input.component.scss
View File

@@ -0,0 +1,5 @@
:host {
display: flex;
flex-direction: column;
gap: calc(var(--bs-spacer) / 2);
}

2
src/app/process-page/form/process-parameters/parameter-value-input/file-value-input/file-value-input.component.html
View File

@@ -1,5 +1,5 @@
<label for="file-upload-{{index}}" class="d-flex align-items-center m-0">
<span class="btn btn-light">
<span class="btn btn-primary">
{{'process.new.parameter.file.upload-button' | translate}}
</span>
<span class="file-name ml-1">{{fileObject?.name}}</span>

4
src/app/process-page/form/process-parameters/parameter-value-input/string-value-input/string-value-input.component.html
View File

@@ -1,6 +1,6 @@
<input required #string="ngModel" type="text" name="string-value-{{index}}" class="form-control" id="string-value-{{index}}" [ngModel]="value" (ngModelChange)="setValue($event)"/>
<input [attr.aria-label]="'process.new.parameter.label' | translate" required #string="ngModel" type="text" name="string-value-{{index}}" class="form-control" id="string-value-{{index}}" [ngModel]="value" (ngModelChange)="setValue($event)"/>
<div *ngIf="string.invalid && (string.dirty || string.touched)"
class="alert alert-danger validation-error">
class="alert alert-danger validation-error mb-0">
<div *ngIf="string.errors.required">
{{'process.new.parameter.string.required' | translate}}
</div>

5
src/app/process-page/form/process-parameters/parameter-value-input/string-value-input/string-value-input.component.scss
View File

@@ -0,0 +1,5 @@
:host {
display: flex;
flex-direction: column;
gap: calc(var(--bs-spacer) / 2);
}

2
src/app/process-page/form/script-help/script-help.component.html
View File

@@ -1,5 +1,5 @@
<div class="text-secondary">
<h3>{{script?.name}}</h3>
<h2>{{script?.name}}</h2>
<span>{{script?.description}}</span>
<table class="table-borderless mt-3">

10
src/app/process-page/overview/process-overview.component.html
View File

@@ -1,6 +1,6 @@
<div class="container">
<div class="d-flex">
<h2 class="flex-grow-1">{{'process.overview.title' | translate}}</h2>
<h1 class="flex-grow-1">{{'process.overview.title' | translate}}</h1>
</div>
<div class="d-flex justify-content-end">
<button *ngIf="processBulkDeleteService.hasSelected()" class="btn btn-primary mr-2"
@@ -44,9 +44,11 @@
<td>{{process.endTime | date:dateFormat:'UTC'}}</td>
<td>{{process.processStatus}}</td>
<td>
<button class="btn btn-outline-danger"
(click)="processBulkDeleteService.toggleDelete(process.processId)"><i
class="fas fa-trash"></i></button>
<button [attr.aria-label]="'process.overview.delete-process' | translate"
(click)="processBulkDeleteService.toggleDelete(process.processId)"
class="btn btn-outline-danger">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
</tbody>

6
src/app/profile-page/profile-page.component.html
View File

@@ -1,7 +1,7 @@
<ng-container *ngVar="(user$ | async) as user">
<div class="container" *ngIf="user">
<ng-container *ngIf="isResearcherProfileEnabled() | async">
<h3 class="mb-4">{{'profile.head' | translate}}</h3>
<h2 class="mb-4">{{'profile.head' | translate}}</h2>
<div class="card mb-4">
<div class="card-header">{{'profile.card.researcher' | translate}}</div>
<div class="card-body">
@@ -34,7 +34,7 @@
<ng-container *ngVar="(groupsRD$ | async)?.payload?.page as groups">
<div *ngIf="groups?.length > 0">
<h3 class="mt-4">{{'profile.groups.head' | translate}}</h3>
<h2 class="mt-4">{{'profile.groups.head' | translate}}</h2>
<ul class="list-group list-group-flush">
<li *ngFor="let group of groups" class="list-group-item">{{ dsoNameService.getName(group) }}</li>
</ul>
@@ -43,7 +43,7 @@
<ng-container *ngVar="(specialGroupsRD$ | async)?.payload?.page as specialGroups">
<div *ngIf="specialGroups?.length > 0" data-test="specialGroups">
<h3 class="mt-4">{{'profile.special.groups.head' | translate}}</h3>
<h2 class="mt-4">{{'profile.special.groups.head' | translate}}</h2>
<ul class="list-group list-group-flush">
<li *ngFor="let specialGroup of specialGroups" class="list-group-item">
{{ dsoNameService.getName(specialGroup) }}

2
src/app/register-email-form/register-email-form.component.html
View File

@@ -1,5 +1,5 @@
<div class="container">
<h2>{{MESSAGE_PREFIX + '.header'|translate}}</h2>
<h1>{{MESSAGE_PREFIX + '.header'|translate}}</h1>
<p>{{MESSAGE_PREFIX + '.info' | translate}}</p>
<p *ngIf="validMailDomains.length != 0 && typeRequest === TYPE_REQUEST_REGISTER">

2
src/app/search-navbar/search-navbar.component.html
View File

@@ -1,4 +1,4 @@
<div id="search-navbar-container" [title]="'nav.search' | translate" (dsClickOutside)="collapse()">
<div [title]="'nav.search' | translate" (dsClickOutside)="collapse()">
<div class="d-inline-block position-relative">
<form [formGroup]="searchForm" (ngSubmit)="onSubmit(searchForm.value)" autocomplete="on" class="d-flex">
<input #searchInput [@toggleAnimation]="isExpanded" [attr.aria-label]="('nav.search' | translate)" name="query"

21
src/app/search-navbar/search-navbar.component.spec.ts
View File

@@ -8,7 +8,6 @@ import { SearchService } from '../core/shared/search/search.service';
import { TranslateLoaderMock } from '../shared/mocks/translate-loader.mock';
import { SearchNavbarComponent } from './search-navbar.component';
import { PaginationServiceStub } from '../shared/testing/pagination-service.stub';
import { RouterTestingModule } from '@angular/router/testing';
import { BrowserOnlyMockPipe } from '../shared/testing/browser-only-mock.pipe';
@@ -17,8 +16,6 @@ describe('SearchNavbarComponent', () => {
let fixture: ComponentFixture<SearchNavbarComponent>;
let mockSearchService: any;
let router: Router;
let routerStub;
let paginationService;
beforeEach(waitForAsync(() => {
mockSearchService = {
@@ -27,12 +24,6 @@ describe('SearchNavbarComponent', () => {
}
};
routerStub = {
navigate: (commands) => commands
};
paginationService = new PaginationServiceStub();
TestBed.configureTestingModule({
imports: [
FormsModule,
@@ -72,7 +63,7 @@ describe('SearchNavbarComponent', () => {
spyOn(component, 'expand').and.callThrough();
spyOn(component, 'onSubmit').and.callThrough();
spyOn(router, 'navigate');
const searchIcon = fixture.debugElement.query(By.css('#search-navbar-container form .submit-icon'));
const searchIcon = fixture.debugElement.query(By.css('form .submit-icon'));
searchIcon.triggerEventHandler('click', {
preventDefault: () => {/**/
}
@@ -88,7 +79,7 @@ describe('SearchNavbarComponent', () => {
describe('empty query', () => {
describe('press submit button', () => {
beforeEach(fakeAsync(() => {
const searchIcon = fixture.debugElement.query(By.css('#search-navbar-container form .submit-icon'));
const searchIcon = fixture.debugElement.query(By.css('form .submit-icon'));
searchIcon.triggerEventHandler('click', {
preventDefault: () => {/**/
}
@@ -97,7 +88,7 @@ describe('SearchNavbarComponent', () => {
fixture.detectChanges();
}));
it('to search page with empty query', () => {
const extras: NavigationExtras = {queryParams: { query: '' }, queryParamsHandling: 'merge'};
const extras: NavigationExtras = { queryParams: { query: '' }, queryParamsHandling: 'merge' };
expect(component.onSubmit).toHaveBeenCalledWith({ query: '' });
expect(router.navigate).toHaveBeenCalledWith(['search'], extras);
});
@@ -109,20 +100,20 @@ describe('SearchNavbarComponent', () => {
beforeEach(async () => {
await fixture.whenStable();
fixture.detectChanges();
searchInput = fixture.debugElement.query(By.css('#search-navbar-container form input'));
searchInput = fixture.debugElement.query(By.css('form input'));
searchInput.nativeElement.value = 'test';
searchInput.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
});
describe('press submit button', () => {
beforeEach(fakeAsync(() => {
const searchIcon = fixture.debugElement.query(By.css('#search-navbar-container form .submit-icon'));
const searchIcon = fixture.debugElement.query(By.css('form .submit-icon'));
searchIcon.triggerEventHandler('click', null);
tick();
fixture.detectChanges();
}));
it('to search page with query', async () => {
const extras: NavigationExtras = { queryParams: { query: 'test' }, queryParamsHandling: 'merge'};
const extras: NavigationExtras = { queryParams: { query: 'test' }, queryParamsHandling: 'merge' };
expect(component.onSubmit).toHaveBeenCalledWith({ query: 'test' });
expect(router.navigate).toHaveBeenCalledWith(['search'], extras);

1
src/app/shared/access-control-form-container/access-control-array-form/access-control-array-form.component.html
View File

@@ -92,6 +92,7 @@
<div class="input-group">
<button type="button" class="btn btn-outline-danger"
[attr.aria-label]="'access-control-remove' | translate"
[disabled]="ngForm.disabled || form.accessControls.length === 1"
(click)="removeAccessControlItem(control.id)">
<i class="fas fa-trash"></i>

20
src/app/shared/access-control-form-container/access-control-form-container.component.html
View File

@@ -4,18 +4,20 @@
<ds-alert
*ngIf="titleMessage"
[type]="AlertType.Info"
[content]="titleMessage">
[content]="titleMessage"
class="d-block pb-3">
</ds-alert>
<div class="row mt-5">
<div class="row">
<div class="col-12 col-md-6 border-right d-flex flex-column justify-content-between">
<div>
<div class="d-flex align-items-center">
<h4 class="mb-0 mr-4">
<h2 class="h3 mb-0 mr-4">
{{ 'access-control-item-header-toggle' | translate }}
</h4>
</h2>
<ui-switch
[ariaLabel]="(state.bitstream.toggleStatus ? 'access-control-item-toggle.disable' : 'access-control-item-toggle.enable') | translate"
[(ngModel)]="state.item.toggleStatus"
(ngModelChange)="handleStatusChange('item', $event)">
</ui-switch>
@@ -49,7 +51,7 @@
</div>
<div>
<h5 class="mt-3">{{'access-control-access-conditions' | translate}}</h5>
<h3 class="h4 mt-3">{{'access-control-access-conditions' | translate}}</h3>
<ds-access-control-array-form
#itemAccessCmp
@@ -65,10 +67,11 @@
<div>
<div class="d-flex align-items-center">
<h4 class="mb-0 mr-4">
<h2 class="h3 mb-0 mr-4">
{{'access-control-bitstream-header-toggle' | translate}}
</h4>
</h2>
<ui-switch
[ariaLabel]="(state.bitstream.toggleStatus ? 'access-control-bitstream-toggle.disable' : 'access-control-bitstream-toggle.enable') | translate"
[(ngModel)]="state.bitstream.toggleStatus"
(ngModelChange)="handleStatusChange('bitstream', $event)">
</ui-switch>
@@ -99,6 +102,7 @@
<button
*ngIf="itemRD"
[attr.aria-label]="'access-control-bitstreams-select' | translate"
[disabled]="!state.bitstream.toggleStatus || state.bitstream.changesLimit !== 'selected'"
(click)="openSelectBitstreamsModal(itemRD.payload)"
class="btn btn-outline-dark border-0" type="button">
@@ -138,7 +142,7 @@
</div>
<div>
<h5 class="mt-3">{{'access-control-access-conditions' | translate}}</h5>
<h3 class="h4 mt-3">{{'access-control-access-conditions' | translate}}</h3>
<ds-access-control-array-form
#bitstreamAccessCmp

11
src/app/shared/auth-nav-menu/auth-nav-menu.component.html
View File

@@ -2,9 +2,11 @@
<li *ngIf="!(isAuthenticated | async) && !(isXsOrSm$ | async) && (showAuth | async)" class="nav-item"
(click)="$event.stopPropagation();">
<div ngbDropdown #loginDrop display="dynamic" placement="bottom-right" class="d-inline-block" @fadeInOut>
<a href="javascript:void(0);" class="dropdownLogin px-0.5" [attr.aria-label]="'nav.login' |translate"
<button class="btn btn-link dropdownLogin px-0.5" [attr.aria-label]="'nav.login' |translate"
(click)="$event.preventDefault()" [attr.data-test]="'login-menu' | dsBrowserOnly"
ngbDropdownToggle>{{ 'nav.login' | translate }}</a>
ngbDropdownToggle>
{{ 'nav.login' | translate }}
</button>
<div class="loginDropdownMenu" [ngClass]="{'pl-3 pr-3': (loading | async)}" ngbDropdownMenu
[attr.aria-label]="'nav.login' | translate">
<ds-themed-log-in
@@ -19,8 +21,9 @@
</li>
<li *ngIf="(isAuthenticated | async) && !(isXsOrSm$ | async) && (showAuth | async)" class="nav-item">
<div ngbDropdown display="dynamic" placement="bottom-right" class="d-inline-block" @fadeInOut>
<a href="javascript:void(0);" role="button" [attr.aria-label]="'nav.user-profile-menu-and-logout' |translate" (click)="$event.preventDefault()" [title]="'nav.user-profile-menu-and-logout' | translate" class="dropdownLogout px-1" [attr.data-test]="'user-menu' | dsBrowserOnly" ngbDropdownToggle>
<i class="fas fa-user-circle fa-lg fa-fw"></i></a>
<button role="button" [attr.aria-label]="'nav.user-profile-menu-and-logout' |translate" (click)="$event.preventDefault()" [title]="'nav.user-profile-menu-and-logout' | translate" class="btn btn-link dropdownLogout px-1" [attr.data-test]="'user-menu' | dsBrowserOnly" ngbDropdownToggle>
<i class="fas fa-user-circle fa-lg fa-fw"></i>
</button>
<div class="logoutDropdownMenu" ngbDropdownMenu [attr.aria-label]="'nav.user-profile-menu-and-logout' |translate">
<ds-themed-user-menu></ds-themed-user-menu>
</div>

9
src/app/shared/auth-nav-menu/auth-nav-menu.component.scss
View File

@@ -19,3 +19,12 @@
color: var(--ds-header-icon-color-hover);
}
}
.dropdownLogin, .dropdownLogout {
&:not(:focus-visible).active,
&:not(:focus-visible):active,
&:not(:focus-visible).active:focus,
&:not(:focus-visible):active:focus {
box-shadow: unset;
}
}

2
src/app/shared/browse-by/browse-by.component.html
View File

@@ -1,5 +1,5 @@
<ng-container *ngVar="(objects$ | async) as objects">
<h3 [ngClass]="{'sr-only': parentname }">{{title | translate}}</h3>
<h1 [ngClass]="{'sr-only': parentname }">{{title | translate}}</h1>
<ng-container *ngComponentOutlet="getStartsWithComponent(); injector: objectInjector;"></ng-container>
<div *ngIf="objects?.hasSucceeded && !objects?.isLoading && objects?.payload?.page.length > 0" @fadeIn>
<div *ngIf="shouldDisplayResetButton$ |async" class="mb-2 reset">

4
src/app/shared/comcol/comcol-forms/edit-comcol-page/comcol-role/comcol-role.component.html
View File

@@ -3,9 +3,9 @@
<div class="card-body d-flex flex-column"
*ngVar="group$ | async as group">
<h5 class="w-100">
<h2 class="h4 w-100">
{{ roleName$ | async }}
</h5>
</h2>
<div class="mt-2 mb-2">
<ds-alert [type]="'alert-info'" >{{'comcol-role.edit.' + (comcolRole$ | async)?.name + '.description' | translate}}</ds-alert>

4
src/app/shared/comcol/comcol-forms/edit-comcol-page/edit-comcol-page.component.html
View File

@@ -2,8 +2,8 @@
<div class="row">
<div class="col-12">
<div class="d-flex justify-content-between border-bottom">
<h2>{{ type + '.edit.head' | translate }}</h2>
<div>
<h1>{{ type + '.edit.head' | translate }}</h1>
<div class="my-auto">
<a class="btn btn-danger"
[routerLink]="((type === 'community') ? '/communities/' : '/collections/') + (dsoRD$ | async)?.payload.uuid + '/delete'">
<i class="fas fa-trash"></i> {{type + '.edit.delete' | translate}}</a>

8
src/app/shared/comcol/comcol-page-handle/comcol-page-handle.component.html
View File

@@ -1,4 +1,4 @@
<div *ngIf="content" class="content-with-optional-title mb-2">
<h2 class="d-inline-block h6" *ngIf="title">{{ title | translate }}</h2>
<div class="d-inline-block px-2"><a href="{{getHandle()}}">{{getHandle()}}</a></div>
</div>
<p *ngIf="content" class="d-flex flex-wrap gapx-2 text-break">
<span class="mb-0" *ngIf="title">{{ title | translate }}</span>
<a [href]="getHandle()">{{getHandle()}}</a>
</p>

5
src/app/shared/comcol/comcol-page-handle/comcol-page-handle.component.scss
View File

@@ -1,5 +0,0 @@
div {
word-break: break-word;
word-wrap: break-word;
overflow-wrap: break-word;
}

2
src/app/shared/file-download-link/file-download-link.component.html
View File

@@ -1,5 +1,5 @@
<a [routerLink]="(bitstreamPath$| async)?.routerLink" class="dont-break-out" [queryParams]="(bitstreamPath$| async)?.queryParams" [target]="isBlank ? '_blank': '_self'" [ngClass]="cssClasses">
<span *ngIf="!(canDownload$ |async)" class="pr-1"><i class="fas fa-lock"></i></span>
<span *ngIf="!(canDownload$ |async)" [attr.aria-label]="'file-download-link.restricted' | translate" class="pr-1"><i class="fas fa-lock"></i></span>
<ng-container *ngTemplateOutlet="content"></ng-container>
</a>

4
src/app/shared/file-download-link/file-download-link.component.spec.ts
View File

@@ -10,6 +10,7 @@ import { FeatureID } from '../../core/data/feature-authorization/feature-id';
import { Item } from '../../core/shared/item.model';
import { getItemModuleRoute } from '../../item-page/item-page-routing-paths';
import { RouterLinkDirectiveStub } from '../testing/router-link-directive.stub';
import { TranslateModule } from '@ngx-translate/core';
describe('FileDownloadLinkComponent', () => {
let component: FileDownloadLinkComponent;
@@ -41,6 +42,9 @@ describe('FileDownloadLinkComponent', () => {
function initTestbed() {
TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot(),
],
declarations: [FileDownloadLinkComponent, RouterLinkDirectiveStub],
providers: [
{provide: AuthorizationDataService, useValue: authorizationService},

6
src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/dynamic-lookup-relation-modal.component.html
View File

@@ -9,7 +9,7 @@
<ds-themed-loading *ngIf="!item || !collection"></ds-themed-loading>
<ng-container *ngIf="item && collection">
<ul ngbNav #nav="ngbNav" class="nav-tabs">
<li ngbNavItem>
<li ngbNavItem role="presentation">
<a ngbNavLink>{{'submission.sections.describe.relationship-lookup.search-tab.tab-title.' + relationshipOptions.relationshipType | translate : { count: (totalInternal$ | async)} }}</a>
<ng-template ngbNavContent>
<ds-themed-dynamic-lookup-relation-search-tab
@@ -31,7 +31,7 @@
</ds-themed-dynamic-lookup-relation-search-tab>
</ng-template>
</li>
<li ngbNavItem *ngFor="let source of (externalSourcesRD$ | async); let idx = index">
<li ngbNavItem *ngFor="let source of (externalSourcesRD$ | async); let idx = index" role="presentation">
<a ngbNavLink>{{'submission.sections.describe.relationship-lookup.search-tab.tab-title.' + source.id | translate : { count: (totalExternal$ | async)[idx] } }}</a>
<ng-template ngbNavContent>
<ds-themed-dynamic-lookup-relation-external-source-tab
@@ -49,7 +49,7 @@
</ds-themed-dynamic-lookup-relation-external-source-tab>
</ng-template>
</li>
<li ngbNavItem *ngIf="!isEditRelationship">
<li ngbNavItem *ngIf="!isEditRelationship" role="presentation">
<a ngbNavLink>{{'submission.sections.describe.relationship-lookup.selection-tab.tab-title' | translate : { count: (selection$ | async)?.length } }}</a>
<ng-template ngbNavContent>
<ds-dynamic-lookup-relation-selection-tab

22
src/app/shared/form/vocabulary-treeview/vocabulary-treeview.component.html
View File

@@ -1,8 +1,9 @@
<ds-alert [content]="'vocabulary-treeview.info' | translate" [type]="'alert-info'"></ds-alert>
<div class="treeview-header row">
<ds-alert [content]="'vocabulary-treeview.info' | translate" [type]="AlertType.Info"></ds-alert>
<div class="treeview-header row mb-1">
<div class="col-12">
<div class="input-group">
<input type="text" class="form-control" [(ngModel)]="searchText" (keyup.enter)="search()">
<input type="text" class="form-control" [(ngModel)]="searchText" (keyup.enter)="search()"
[placeholder]="'vocabulary-treeview.search.form.search-placeholder' | translate">
<div class="input-group-append" id="button-addon4">
<button class="btn btn-outline-primary" type="button" (click)="search()" [disabled]="!isSearchEnabled()">
{{'vocabulary-treeview.search.form.search' | translate}}
@@ -19,15 +20,15 @@
</div>
<div class="treeview-container">
<ds-themed-loading *ngIf="loading | async" [showMessage]="false"></ds-themed-loading>
<h4 *ngIf="!(loading | async) && dataSource.data.length === 0" class="text-center text-muted mt-4" >
<h2 *ngIf="!(loading | async) && dataSource.data.length === 0" class="h4 text-center text-muted mt-4" >
<span>{{'vocabulary-treeview.search.no-result' | translate}}</span>
</h4>
</h2>
<cdk-tree [dataSource]="dataSource" [treeControl]="treeControl">
<!-- Leaf node -->
<cdk-tree-node *cdkTreeNodeDef="let node" cdkTreeNodePadding class="d-flex">
<button type="button" class="btn btn-default" cdkTreeNodeToggle>
<span class="fas fa-fw fa-angle-right invisible" aria-hidden="true"></span>
</button>
<span aria-hidden="true" type="button" class="btn btn-default px-2 mr-1" cdkTreeNodeToggle>
<i class="fas fa-fw fa-angle-right invisible"></i>
</span>
<label *ngIf="multiSelect" class="d-flex align-items-center m-0 p-0 form-check"
[class.text-success]="node.isSelected"
[ngbTooltip]="node.item?.otherInformation?.note"
@@ -55,11 +56,10 @@
<!-- expandable node -->
<cdk-tree-node *cdkTreeNodeDef="let node; when: hasChildren" cdkTreeNodePadding class="d-flex">
<button type="button" class="btn btn-default" cdkTreeNodeToggle
<button type="button" class="btn btn-default px-2 mr-1" cdkTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name"
(click)="loadChildren(node)">
<span class="fas fa-fw {{treeControl.isExpanded(node) ? 'fa-angle-down' : 'fa-angle-right'}}"
aria-hidden="true"></span>
<i class="fas fa-fw {{treeControl.isExpanded(node) ? 'fa-angle-down' : 'fa-angle-right'}}"></i>
</button>
<label *ngIf="multiSelect" class="d-flex align-items-center m-0 p-0 form-check"

Some files were not shown because too many files have changed in this diff Show More