diff --git a/src/app/cdk/panel/panels/panels.component.html b/src/app/cdk/panel/panels/panels.component.html index ac6874be3a..1e5ac1657a 100644 --- a/src/app/cdk/panel/panels/panels.component.html +++ b/src/app/cdk/panel/panels/panels.component.html @@ -232,6 +232,7 @@

mat-menu-item (click)="sortChange(option)" *ngFor="let option of sortTypes" + [attr.aria-label]="option | appPanelsSortByAriaLabel" > {{ option | sortLabel }} { + it('create an instance', () => { + const pipe = new AppPanelsSortByAriaLabelPipe(); + expect(pipe).toBeTruthy(); + }); +}); diff --git a/src/app/shared/pipes/app-panels-sort-by-aria-label/app-panels-sort-by-aria-label.pipe.ts b/src/app/shared/pipes/app-panels-sort-by-aria-label/app-panels-sort-by-aria-label.pipe.ts new file mode 100644 index 0000000000..170cef667a --- /dev/null +++ b/src/app/shared/pipes/app-panels-sort-by-aria-label/app-panels-sort-by-aria-label.pipe.ts @@ -0,0 +1,25 @@ +import { Pipe, PipeTransform } from '@angular/core'; +import { SortOrderType } from '../../../types/sort' + +@Pipe({ + name: 'appPanelsSortByAriaLabel' +}) +export class AppPanelsSortByAriaLabelPipe implements PipeTransform { + + transform(sortBy: SortOrderType): string { + switch (sortBy) { + case 'title': + return $localize`:@@shared.sortTitle:Sort by title` + case 'start': + return $localize`:@@shared.sortStart:Sort by start date` + case 'end': + return $localize`:@@shared.sortEnd:Sort by end date` + case 'date': + return $localize`:@@shared.sortDate:Sort by type` + case 'type': + return $localize`:@@shared.sortType:Sort by type` + case 'order': + return $localize`:@@shared.sortOrder:Sort by order` + } + } +} diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index d614ad45d8..bc52a8a249 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -48,7 +48,8 @@ import { AppPanelActivityActionAriaLabelPipe } from './pipes/app-panel-activity- import { SortByPipe } from './pipes/sort-by/sort-by.pipe' import { AffiliationLabelPipe } from './pipes/affiliation-label.pipe' import { AffiliationTypePipe } from './pipes/affiliation-type/affiliation-type.pipe' -import { ScopePathTypePipe } from './pipes/scope-path-type/scope-path-type.pipe' +import { ScopePathTypePipe } from './pipes/scope-path-type/scope-path-type.pipe'; +import { AppPanelsSortByAriaLabelPipe } from './pipes/app-panels-sort-by-aria-label/app-panels-sort-by-aria-label.pipe' @NgModule({ imports: [ CommonModule, @@ -97,6 +98,7 @@ import { ScopePathTypePipe } from './pipes/scope-path-type/scope-path-type.pipe' AffiliationLabelPipe, AffiliationTypePipe, ScopePathTypePipe, + AppPanelsSortByAriaLabelPipe, ], exports: [ CommonModule, @@ -143,6 +145,7 @@ import { ScopePathTypePipe } from './pipes/scope-path-type/scope-path-type.pipe' SortByPipe, AffiliationTypePipe, ScopePathTypePipe, + AppPanelsSortByAriaLabelPipe, ], providers: [], // Should not provide anything }) diff --git a/src/locale/properties/shared/shared.en.properties b/src/locale/properties/shared/shared.en.properties index 613988d3f0..b38b7b0bea 100644 --- a/src/locale/properties/shared/shared.en.properties +++ b/src/locale/properties/shared/shared.en.properties @@ -598,3 +598,11 @@ share.selfService=Self Service - ORCID share.orcidTitle=- ORCID share.myOrcidTitle=- My ORCID share.developerTools=Developer tools - ORCID +shared.addProfessionalActivity=Add a professional activity +shared.sortProfessionalActivities=Sort your professional activities +shared.sortTitle=Sort by title +shared.sortStart=Sort by start date +shared.sortEnd=Sort by end date +shared.sortType=Sort by type +shared.sortDate=Sort by type +shared.sortOrder=Sort by order