From 096859f72c1d6322e68fd04f23455c36ef08390d Mon Sep 17 00:00:00 2001 From: markuczy Date: Mon, 26 Feb 2024 11:53:32 +0100 Subject: [PATCH 1/6] refactor: basic renamed to simple --- .../assets/i18n/de.json | 2 +- .../assets/i18n/en.json | 2 +- libs/portal-integration-angular/src/index.ts | 2 +- .../search-config.component.spec.ts | 2 +- .../search-criteria.component.stories.ts | 4 +-- .../search-criteria.component.ts | 30 +++++++++---------- .../components/search-criteria/search-page.ts | 8 ++--- .../search-header/search-header.component.ts | 10 +++---- ...basic.directive.ts => simple.directive.ts} | 8 ++--- .../src/lib/core/portal-core.module.ts | 6 ++-- .../services/portal-dialog.service.spec.ts | 2 +- .../testing/search-header.harness.ts | 12 ++++---- 12 files changed, 44 insertions(+), 44 deletions(-) rename libs/portal-integration-angular/src/lib/core/directives/{basic.directive.ts => simple.directive.ts} (73%) diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json index 6700ddf1..c915de84 100644 --- a/libs/portal-integration-angular/assets/i18n/de.json +++ b/libs/portal-integration-angular/assets/i18n/de.json @@ -64,7 +64,7 @@ }, "OCX_SEARCH_HEADER": { "TOGGLE_BUTTON": { - "BASIC": "Basis", + "SIMPLE": "Einfach", "ADVANCED": "Erweitert" }, "OCX_SEARCH_CONFIG": { diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json index 357b85a7..eb35fd07 100644 --- a/libs/portal-integration-angular/assets/i18n/en.json +++ b/libs/portal-integration-angular/assets/i18n/en.json @@ -64,7 +64,7 @@ }, "OCX_SEARCH_HEADER": { "TOGGLE_BUTTON": { - "BASIC": "Basic", + "SIMPLE": "Simple", "ADVANCED": "Advanced" }, "OCX_SEARCH_CONFIG": { diff --git a/libs/portal-integration-angular/src/index.ts b/libs/portal-integration-angular/src/index.ts index bde66c78..f0b49c15 100644 --- a/libs/portal-integration-angular/src/index.ts +++ b/libs/portal-integration-angular/src/index.ts @@ -3,7 +3,7 @@ export * from './lib/core/directives/autofocus.directive' export * from './lib/core/directives/if-breakpoint.directive' export * from './lib/core/directives/if-permission.directive' export * from './lib/core/directives/advanced.directive' -export * from './lib/core/directives/basic.directive' +export * from './lib/core/directives/simple.directive' export * from './lib/core/directives/patch-form-group-values.driective' export * from './lib/core/directives/set-input-value.directive' export * from './lib/core/directives/loading-indicator.directive' diff --git a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts index 229285ea..fe24ea9f 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-config/search-config.component.spec.ts @@ -33,7 +33,7 @@ describe('SearchConfigComponent', () => { const searchConfigsEntries: SearchConfig[] = [ { id: '01', - name: 'Basic search config', + name: 'Simple search config', version: 1, readonly: true, isAdvanced: true, diff --git a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.stories.ts b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.stories.ts index 6910a6fc..31c3a5fb 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.stories.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.stories.ts @@ -47,7 +47,7 @@ export default { MenuModule, BreadcrumbModule, SkeletonModule, - StorybookTranslateModule + StorybookTranslateModule, ], providers: [], }), @@ -117,7 +117,7 @@ const TemplateWithProjectionAndExtraToolbar: StoryFn = `, }) -export const Basic = { +export const Simple = { render: Template, args: { diff --git a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts index ab571295..1b9fa2a9 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts @@ -40,18 +40,18 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn } /** Event emitted when the search button has been pressed. */ - @Output() readonly search: EventEmitter<'basic' | 'advanced'> = new EventEmitter<'basic' | 'advanced'>() + @Output() readonly search: EventEmitter<'simple' | 'advanced'> = new EventEmitter<'simple' | 'advanced'>() /** Event emitted when the reset button has been pressed. */ // eslint-disable-next-line @angular-eslint/no-output-native - @Output() readonly reset: EventEmitter<'basic' | 'advanced'> = new EventEmitter<'basic' | 'advanced'>() + @Output() readonly reset: EventEmitter<'simple' | 'advanced'> = new EventEmitter<'simple' | 'advanced'>() /** Event emitted when the adnvanced view has been toggled. */ @Output() readonly advancedViewToggle = new EventEmitter() protected advancedSearchActive = false - // in BASIC mode ... enable switching to ADVANCED + // in SIMPLE mode ... enable switching to ADVANCED private enableAdvancedSearch: Action = { label: 'Advanced', title: 'Switch to Advanced Search', @@ -60,10 +60,10 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn this.activateAdvancedSearch(true) }, } - // in ADVANCED mode ... enable switching to BASIC - private enableBasicSearch: Action = { - label: 'Basic', - title: 'Switch to Basic Search', + // in ADVANCED mode ... enable switching to SIMPLE + private enableSimpleSearch: Action = { + label: 'Simple', + title: 'Switch to Simple Search', show: 'always', actionCallback: () => { this.activateAdvancedSearch(false) @@ -75,7 +75,7 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn translateService: TranslateService, appStateService: AppStateService, userService: UserService, - @Inject(PortalSearchPage) @Optional() private searchPage?: PortalSearchPage, + @Inject(PortalSearchPage) @Optional() private searchPage?: PortalSearchPage ) { super(breadcrumbs, translateService, appStateService, userService) } @@ -95,15 +95,15 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn this.advancedViewToggle.emit() } protected emitSearchEvent() { - this.search.emit(this.advancedSearchActive ? 'advanced' : 'basic') + this.search.emit(this.advancedSearchActive ? 'advanced' : 'simple') if (this.searchPage) { - this.searchPage.onSearch(this.advancedSearchActive ? 'advanced' : 'basic') + this.searchPage.onSearch(this.advancedSearchActive ? 'advanced' : 'simple') } } protected emitResetEvent() { - this.reset.emit(this.advancedSearchActive ? 'advanced' : 'basic') + this.reset.emit(this.advancedSearchActive ? 'advanced' : 'simple') if (this.searchPage) { - this.searchPage.onReset(this.advancedSearchActive ? 'advanced' : 'basic') + this.searchPage.onReset(this.advancedSearchActive ? 'advanced' : 'simple') } } @@ -111,12 +111,12 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn this.advancedSearchActive = advanced const actions = [...(this.actions || [])] const index = actions.findIndex( - (a) => (advanced && a === this.enableAdvancedSearch) || (!advanced && a === this.enableBasicSearch) + (a) => (advanced && a === this.enableAdvancedSearch) || (!advanced && a === this.enableSimpleSearch) ) if (index >= 0) { - actions[index] = advanced ? this.enableBasicSearch : this.enableAdvancedSearch + actions[index] = advanced ? this.enableSimpleSearch : this.enableAdvancedSearch } else { - actions.push(advanced ? this.enableBasicSearch : this.enableAdvancedSearch) + actions.push(advanced ? this.enableSimpleSearch : this.enableAdvancedSearch) } this.actions = actions } diff --git a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts index 3b841ac9..9f005631 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts @@ -13,10 +13,10 @@ export abstract class PortalSearchPage { searchInProgress = false public results: T[] = [] - abstract search(mode: 'basic' | 'advanced'): T[] | Observable - abstract reset(mode: 'basic' | 'advanced'): void + abstract search(mode: 'simple' | 'advanced'): T[] | Observable + abstract reset(mode: 'simple' | 'advanced'): void - onSearch(mode: 'basic' | 'advanced') { + onSearch(mode: 'simple' | 'advanced') { this.searchInProgress = true const resultIntermediate = this.search(mode) if (isObservable(resultIntermediate)) { @@ -31,7 +31,7 @@ export abstract class PortalSearchPage { } } - onReset(mode: 'basic' | 'advanced') { + onReset(mode: 'simple' | 'advanced') { this.results = [] this.reset(mode) } diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts index 0680ddd0..dae3b68e 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts @@ -49,7 +49,7 @@ export class SearchHeaderComponent implements AfterViewInit { @ViewChild('searchParameterFields') searchParameterFields: ElementRef | undefined - viewMode: 'basic' | 'advanced' = 'basic' + viewMode: 'simple' | 'advanced' = 'simple' hasAdvanced = false headerActions: Action[] = [] @@ -58,7 +58,7 @@ export class SearchHeaderComponent implements AfterViewInit { } toggleViewMode() { - this.viewMode = this.viewMode === 'basic' ? 'advanced' : 'basic' + this.viewMode = this.viewMode === 'simple' ? 'advanced' : 'simple' this.updateHeaderActions() setTimeout(() => this.addKeyUpEventListener()) } @@ -75,11 +75,11 @@ export class SearchHeaderComponent implements AfterViewInit { const headerActions: Action[] = [] if (this.hasAdvanced) { headerActions.push({ - id: 'basicAdvancedButton', + id: 'simpleAdvancedButton', labelKey: - this.viewMode === 'basic' + this.viewMode === 'simple' ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED' - : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.BASIC', + : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE', actionCallback: () => this.toggleViewMode(), show: 'always', }) diff --git a/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts b/libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts similarity index 73% rename from libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts rename to libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts index 2f989c24..16b1945a 100644 --- a/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts +++ b/libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts @@ -1,19 +1,19 @@ import { Directive, DoCheck, Optional, TemplateRef, ViewContainerRef } from '@angular/core' import { SearchHeaderComponent } from '../components/search-header/search-header.component' -@Directive({ selector: '[ocxBasic]' }) -export class BasicDirective implements DoCheck { +@Directive({ selector: '[ocxSimple]' }) +export class SimpleDirective implements DoCheck { constructor( private viewContainer: ViewContainerRef, @Optional() private templateRef?: TemplateRef, @Optional() private searchHeader?: SearchHeaderComponent ) { if (!searchHeader) { - throw 'Basic directive can only be used inside search header component' + throw 'Simple directive can only be used inside search header component' } } ngDoCheck(): void { - if (this.searchHeader?.viewMode === 'basic') { + if (this.searchHeader?.viewMode === 'simple') { if (this.templateRef && !this.viewContainer.length) { this.viewContainer.createEmbeddedView(this.templateRef) } diff --git a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts index 98e64f1c..2b39fe48 100644 --- a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts +++ b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts @@ -65,7 +65,7 @@ import { ColumnGroupSelectionComponent } from './components/column-group-selecti import { CustomGroupColumnSelectorComponent } from './components/custom-group-column-selector/custom-group-column-selector.component' import { SearchHeaderComponent } from './components/search-header/search-header.component' import { AdvancedDirective } from './directives/advanced.directive' -import { BasicDirective } from './directives/basic.directive' +import { SimpleDirective } from './directives/simple.directive' import { DataListGridSortingComponent } from './components/data-list-grid-sorting/data-list-grid-sorting.component' import { RelativeDatePipe } from './pipes/relative-date.pipe' import { PatchFormGroupValuesDirective } from './directives/patch-form-group-values.driective' @@ -153,7 +153,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle LoadingIndicatorComponent, LoadingIndicatorDirective, AdvancedDirective, - BasicDirective, + SimpleDirective, DataListGridSortingComponent, RelativeDatePipe, PatchFormGroupValuesDirective, @@ -224,7 +224,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle LoadingIndicatorComponent, LoadingIndicatorDirective, AdvancedDirective, - BasicDirective, + SimpleDirective, RelativeDatePipe, PatchFormGroupValuesDirective, SetInputValueDirective, diff --git a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts index bdc9ca67..3df6cd78 100644 --- a/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts +++ b/libs/portal-integration-angular/src/lib/services/portal-dialog.service.spec.ts @@ -208,7 +208,7 @@ describe('PortalDialogService', () => { let fixture: ComponentFixture const translations = { - TITLE_TRANSLATE: 'basicTitle', + TITLE_TRANSLATE: 'simpleTitle', TITLE_TRANSLATE_PARAM: 'translatedTitle {{val}}', MESSAGE: 'myMessage', MESSAGE_PARAM: 'myMessage {{val}}', diff --git a/libs/portal-integration-angular/testing/search-header.harness.ts b/libs/portal-integration-angular/testing/search-header.harness.ts index c1cc8e37..226d6ae3 100644 --- a/libs/portal-integration-angular/testing/search-header.harness.ts +++ b/libs/portal-integration-angular/testing/search-header.harness.ts @@ -18,9 +18,9 @@ export class SearchHeaderHarness extends ContentContainerComponentHarness { }) ) - getBasicAdvancedButton = this.locatorForOptional( + getSimpleAdvancedButton = this.locatorForOptional( ButtonHarness.with({ - id: 'basicAdvancedButton', + id: 'simpleAdvancedButton', }) ) @@ -34,11 +34,11 @@ export class SearchHeaderHarness extends ContentContainerComponentHarness { await (await this.getResetButton()).click() } - async toggleBasicAdvanced() { - if (await this.getBasicAdvancedButton()) { - await (await this.getBasicAdvancedButton())?.click() + async toggleSimpleAdvanced() { + if (await this.getSimpleAdvancedButton()) { + await (await this.getSimpleAdvancedButton())?.click() } else { - console.warn('No BasicAdvancedButton is being displayed to toggle, because no advanced form field is defined.') + console.warn('No SimpleAdvancedButton is being displayed to toggle, because no advanced form field is defined.') } } } From 9f962b0b99ef6c04cc57825c20dd20e3b28ba465 Mon Sep 17 00:00:00 2001 From: markuczy Date: Mon, 26 Feb 2024 12:36:53 +0100 Subject: [PATCH 2/6] feat: search header now has buttons with informational aria labels --- .../assets/i18n/de.json | 18 +++++++++++++++-- .../assets/i18n/en.json | 20 +++++++++++++++---- .../page-header/page-header.component.html | 1 + .../page-header/page-header.component.ts | 1 + .../search-header.component.html | 12 +++++------ .../search-header/search-header.component.ts | 8 ++++++-- 6 files changed, 46 insertions(+), 14 deletions(-) diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json index c915de84..f5944c80 100644 --- a/libs/portal-integration-angular/assets/i18n/de.json +++ b/libs/portal-integration-angular/assets/i18n/de.json @@ -64,13 +64,27 @@ }, "OCX_SEARCH_HEADER": { "TOGGLE_BUTTON": { - "SIMPLE": "Einfach", - "ADVANCED": "Erweitert" + "SIMPLE": { + "TEXT": "Einfach", + "ARIA_LABEL": "Switch to simple search criteria" + }, + "ADVANCED": { + "TEXT": "Erweitert", + "ARIA_LABEL": "Switch to advanced search criteria" + } }, "OCX_SEARCH_CONFIG": { "DROPDOWN_DEFAULT": "Gespeicherte Suchvorlage auswählen" }, "HEADLINE": "Suche", + "RESET_BUTTON": { + "TEXT": "Zurücksetzen", + "ARIA_LABEL": "Reset search criteria" + }, + "SEARCH_BUTTON": { + "TEXT": "Suchen", + "ARIA_LABEL": "Search" + }, "RESET_BUTTON_TEXT": "Zurücksetzen", "SEARCH_BUTTON_TEXT": "Suchen", "EXPORT": "Alle Ereignisse exportieren" diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json index eb35fd07..0d4eb614 100644 --- a/libs/portal-integration-angular/assets/i18n/en.json +++ b/libs/portal-integration-angular/assets/i18n/en.json @@ -64,15 +64,27 @@ }, "OCX_SEARCH_HEADER": { "TOGGLE_BUTTON": { - "SIMPLE": "Simple", - "ADVANCED": "Advanced" + "SIMPLE": { + "TEXT": "Simple", + "ARIA_LABEL": "Switch to simple search criteria" + }, + "ADVANCED": { + "TEXT": "Advanced", + "ARIA_LABEL": "Switch to advanced search criteria" + } }, "OCX_SEARCH_CONFIG": { "DROPDOWN_DEFAULT": "Pick predefined template" }, "HEADLINE": "Search", - "RESET_BUTTON_TEXT": "Reset", - "SEARCH_BUTTON_TEXT": "Search", + "RESET_BUTTON": { + "TEXT": "Reset", + "ARIA_LABEL": "Reset search criteria" + }, + "SEARCH_BUTTON": { + "TEXT": "Search", + "ARIA_LABEL": "Search" + }, "EXPORT": "Export all events" }, "OCX_PAGE_HEADER": { diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html index cb9d8ab7..97ec354c 100644 --- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html +++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html @@ -48,6 +48,7 @@

{{ subheader }}

[title]="(action.titleKey ? (action.titleKey | translate) : action.title) || (action.labelKey ? (action.labelKey | translate) : action.label)" [disabled]="action.disabled ? action.disabled : false" [attr.name]="action.icon ? 'ocx-page-header-inline-action-icon-button' : 'ocx-page-header-inline-action-button'" + [ariaLabel]="action.ariaLabel ? (action.ariaLabel | translate) : (action.titleKey ? (action.titleKey | translate) : action.title) || (action.labelKey ? (action.labelKey | translate) : action.label)" > diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts index 490c8404..39a5e681 100644 --- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts @@ -40,6 +40,7 @@ export interface Action { // Note: This currently doesn't work with dynamic values, since a passed in Action is just a copy of the original object. // As a workaround, you can manually update/replace the passed in Action if you wish to update a showCondition showCondition?: boolean + ariaLabel?: string } export interface ObjectDetailItem { diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html index 98f0abbb..4b9831ea 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html @@ -15,20 +15,20 @@ id="resetButton" *ngIf="resetted.observed" (onClick)="onResetClicked()" - label="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON_TEXT' | translate }}" + label="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}" icon="pi pi-eraser" - [attr.aria-label]="'OCX_SEARCH_HEADER.RESET_BUTTON_TEXT' | translate" - title="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON_TEXT' | translate }}" + [ariaLabel]="'OCX_SEARCH_HEADER.RESET_BUTTON.ARIA_LABEL' | translate" + title="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}" > diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts index dae3b68e..f96d3fee 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts @@ -78,10 +78,14 @@ export class SearchHeaderComponent implements AfterViewInit { id: 'simpleAdvancedButton', labelKey: this.viewMode === 'simple' - ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED' - : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE', + ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.TEXT' + : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.TEXT', actionCallback: () => this.toggleViewMode(), show: 'always', + ariaLabel: + this.viewMode === 'simple' + ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.ARIA_LABEL' + : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.ARIA_LABEL', }) } this.headerActions = headerActions.concat(this.actions) From 40f02771c2624cfa223b85e40741b2f2ec0fd00c Mon Sep 17 00:00:00 2001 From: markuczy Date: Mon, 26 Feb 2024 13:38:55 +0100 Subject: [PATCH 3/6] feat: german translations --- libs/portal-integration-angular/assets/i18n/de.json | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json index 742f2703..de1a09db 100644 --- a/libs/portal-integration-angular/assets/i18n/de.json +++ b/libs/portal-integration-angular/assets/i18n/de.json @@ -71,11 +71,11 @@ "TOGGLE_BUTTON": { "SIMPLE": { "TEXT": "Einfach", - "ARIA_LABEL": "Switch to simple search criteria" + "ARIA_LABEL": "Zu einfachen Suchkriterien wechseln" }, "ADVANCED": { "TEXT": "Erweitert", - "ARIA_LABEL": "Switch to advanced search criteria" + "ARIA_LABEL": "Zu erweiterten Suchkriterien wechseln" } }, "OCX_SEARCH_CONFIG": { @@ -84,11 +84,11 @@ "HEADLINE": "Suche", "RESET_BUTTON": { "TEXT": "Zurücksetzen", - "ARIA_LABEL": "Reset search criteria" + "ARIA_LABEL": "Suchkriterien zurücksetzen" }, "SEARCH_BUTTON": { "TEXT": "Suchen", - "ARIA_LABEL": "Search" + "ARIA_LABEL": "Suchen" }, "RESET_BUTTON_TEXT": "Zurücksetzen", "SEARCH_BUTTON_TEXT": "Suchen", From 34a8f53681376aa4f787e2bfc2aa9252180d8b81 Mon Sep 17 00:00:00 2001 From: markuczy Date: Tue, 27 Feb 2024 08:20:35 +0100 Subject: [PATCH 4/6] refactor: reverted naming changes --- libs/portal-integration-angular/src/index.ts | 2 +- .../search-criteria/search-criteria.component.ts | 12 ++++++------ .../core/components/search-criteria/search-page.ts | 8 ++++---- .../search-header/search-header.component.ts | 8 ++++---- .../{simple.directive.ts => basic.directive.ts} | 6 +++--- .../src/lib/core/portal-core.module.ts | 6 +++--- 6 files changed, 21 insertions(+), 21 deletions(-) rename libs/portal-integration-angular/src/lib/core/directives/{simple.directive.ts => basic.directive.ts} (83%) diff --git a/libs/portal-integration-angular/src/index.ts b/libs/portal-integration-angular/src/index.ts index 947d6cbb..e4189909 100644 --- a/libs/portal-integration-angular/src/index.ts +++ b/libs/portal-integration-angular/src/index.ts @@ -3,7 +3,7 @@ export * from './lib/core/directives/autofocus.directive' export * from './lib/core/directives/if-breakpoint.directive' export * from './lib/core/directives/if-permission.directive' export * from './lib/core/directives/advanced.directive' -export * from './lib/core/directives/simple.directive' +export * from './lib/core/directives/basic.directive' export * from './lib/core/directives/patch-form-group-values.driective' export * from './lib/core/directives/set-input-value.directive' export * from './lib/core/directives/loading-indicator.directive' diff --git a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts index 1b9fa2a9..ce969d20 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-criteria.component.ts @@ -40,11 +40,11 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn } /** Event emitted when the search button has been pressed. */ - @Output() readonly search: EventEmitter<'simple' | 'advanced'> = new EventEmitter<'simple' | 'advanced'>() + @Output() readonly search: EventEmitter<'basic' | 'advanced'> = new EventEmitter<'basic' | 'advanced'>() /** Event emitted when the reset button has been pressed. */ // eslint-disable-next-line @angular-eslint/no-output-native - @Output() readonly reset: EventEmitter<'simple' | 'advanced'> = new EventEmitter<'simple' | 'advanced'>() + @Output() readonly reset: EventEmitter<'basic' | 'advanced'> = new EventEmitter<'basic' | 'advanced'>() /** Event emitted when the adnvanced view has been toggled. */ @Output() readonly advancedViewToggle = new EventEmitter() @@ -95,15 +95,15 @@ export class SearchCriteriaComponent extends PageHeaderComponent implements OnIn this.advancedViewToggle.emit() } protected emitSearchEvent() { - this.search.emit(this.advancedSearchActive ? 'advanced' : 'simple') + this.search.emit(this.advancedSearchActive ? 'advanced' : 'basic') if (this.searchPage) { - this.searchPage.onSearch(this.advancedSearchActive ? 'advanced' : 'simple') + this.searchPage.onSearch(this.advancedSearchActive ? 'advanced' : 'basic') } } protected emitResetEvent() { - this.reset.emit(this.advancedSearchActive ? 'advanced' : 'simple') + this.reset.emit(this.advancedSearchActive ? 'advanced' : 'basic') if (this.searchPage) { - this.searchPage.onReset(this.advancedSearchActive ? 'advanced' : 'simple') + this.searchPage.onReset(this.advancedSearchActive ? 'advanced' : 'basic') } } diff --git a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts index 9f005631..3b841ac9 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-criteria/search-page.ts @@ -13,10 +13,10 @@ export abstract class PortalSearchPage { searchInProgress = false public results: T[] = [] - abstract search(mode: 'simple' | 'advanced'): T[] | Observable - abstract reset(mode: 'simple' | 'advanced'): void + abstract search(mode: 'basic' | 'advanced'): T[] | Observable + abstract reset(mode: 'basic' | 'advanced'): void - onSearch(mode: 'simple' | 'advanced') { + onSearch(mode: 'basic' | 'advanced') { this.searchInProgress = true const resultIntermediate = this.search(mode) if (isObservable(resultIntermediate)) { @@ -31,7 +31,7 @@ export abstract class PortalSearchPage { } } - onReset(mode: 'simple' | 'advanced') { + onReset(mode: 'basic' | 'advanced') { this.results = [] this.reset(mode) } diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts index 93b09a79..313b40ac 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts @@ -26,7 +26,7 @@ import { SearchConfig } from '../../../model/search-config' export class SearchHeaderComponent implements AfterViewInit { @Input() searchConfigs: SearchConfig[] | undefined @Input() headline = '' - @Input() viewMode: 'simple' | 'advanced' = 'simple' + @Input() viewMode: 'basic' | 'advanced' = 'basic' @Input() manualBreadcrumbs = false _actions: Action[] = [] @Input() @@ -59,7 +59,7 @@ export class SearchHeaderComponent implements AfterViewInit { } toggleViewMode() { - this.viewMode = this.viewMode === 'simple' ? 'advanced' : 'simple' + this.viewMode = this.viewMode === 'basic' ? 'advanced' : 'basic' this.viewModeChanged?.emit(this.viewMode) this.updateHeaderActions() setTimeout(() => this.addKeyUpEventListener()) @@ -79,13 +79,13 @@ export class SearchHeaderComponent implements AfterViewInit { headerActions.push({ id: 'simpleAdvancedButton', labelKey: - this.viewMode === 'simple' + this.viewMode === 'basic' ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.TEXT' : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.TEXT', actionCallback: () => this.toggleViewMode(), show: 'always', ariaLabel: - this.viewMode === 'simple' + this.viewMode === 'basic' ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.ARIA_LABEL' : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.ARIA_LABEL', }) diff --git a/libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts b/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts similarity index 83% rename from libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts rename to libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts index 16b1945a..6457c83a 100644 --- a/libs/portal-integration-angular/src/lib/core/directives/simple.directive.ts +++ b/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts @@ -1,8 +1,8 @@ import { Directive, DoCheck, Optional, TemplateRef, ViewContainerRef } from '@angular/core' import { SearchHeaderComponent } from '../components/search-header/search-header.component' -@Directive({ selector: '[ocxSimple]' }) -export class SimpleDirective implements DoCheck { +@Directive({ selector: '[ocxBasic]' }) +export class BasicDirective implements DoCheck { constructor( private viewContainer: ViewContainerRef, @Optional() private templateRef?: TemplateRef, @@ -13,7 +13,7 @@ export class SimpleDirective implements DoCheck { } } ngDoCheck(): void { - if (this.searchHeader?.viewMode === 'simple') { + if (this.searchHeader?.viewMode === 'basic') { if (this.templateRef && !this.viewContainer.length) { this.viewContainer.createEmbeddedView(this.templateRef) } diff --git a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts index 8ca51668..393b6a49 100644 --- a/libs/portal-integration-angular/src/lib/core/portal-core.module.ts +++ b/libs/portal-integration-angular/src/lib/core/portal-core.module.ts @@ -65,7 +65,7 @@ import { ColumnGroupSelectionComponent } from './components/column-group-selecti import { CustomGroupColumnSelectorComponent } from './components/custom-group-column-selector/custom-group-column-selector.component' import { SearchHeaderComponent } from './components/search-header/search-header.component' import { AdvancedDirective } from './directives/advanced.directive' -import { SimpleDirective } from './directives/simple.directive' +import { BasicDirective } from './directives/basic.directive' import { DataListGridSortingComponent } from './components/data-list-grid-sorting/data-list-grid-sorting.component' import { RelativeDatePipe } from './pipes/relative-date.pipe' import { PatchFormGroupValuesDirective } from './directives/patch-form-group-values.driective' @@ -154,7 +154,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle LoadingIndicatorComponent, LoadingIndicatorDirective, AdvancedDirective, - SimpleDirective, + BasicDirective, DataListGridSortingComponent, RelativeDatePipe, PatchFormGroupValuesDirective, @@ -226,7 +226,7 @@ export class PortalMissingTranslationHandler implements MissingTranslationHandle LoadingIndicatorComponent, LoadingIndicatorDirective, AdvancedDirective, - SimpleDirective, + BasicDirective, RelativeDatePipe, PatchFormGroupValuesDirective, SetInputValueDirective, From 122bf3f71ecfe4b80f9c1a119214c2b487196745 Mon Sep 17 00:00:00 2001 From: markuczy Date: Wed, 28 Feb 2024 12:45:58 +0100 Subject: [PATCH 5/6] fix: basic directive error throw adjusted --- .../src/lib/core/directives/basic.directive.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts b/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts index 6457c83a..2f989c24 100644 --- a/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts +++ b/libs/portal-integration-angular/src/lib/core/directives/basic.directive.ts @@ -9,7 +9,7 @@ export class BasicDirective implements DoCheck { @Optional() private searchHeader?: SearchHeaderComponent ) { if (!searchHeader) { - throw 'Simple directive can only be used inside search header component' + throw 'Basic directive can only be used inside search header component' } } ngDoCheck(): void { From dc117108c133127f346c3dee0eb7c625a2edc8ec Mon Sep 17 00:00:00 2001 From: markuczy Date: Mon, 4 Mar 2024 10:17:13 +0100 Subject: [PATCH 6/6] feat: search-header tooltips --- libs/portal-integration-angular/assets/i18n/de.json | 8 ++++---- libs/portal-integration-angular/assets/i18n/en.json | 8 ++++---- .../components/page-header/page-header.component.html | 2 +- .../core/components/page-header/page-header.component.ts | 1 - .../components/search-header/search-header.component.html | 8 ++++---- .../components/search-header/search-header.component.ts | 6 +++--- 6 files changed, 16 insertions(+), 17 deletions(-) diff --git a/libs/portal-integration-angular/assets/i18n/de.json b/libs/portal-integration-angular/assets/i18n/de.json index 6f78e0cf..7daa21f8 100644 --- a/libs/portal-integration-angular/assets/i18n/de.json +++ b/libs/portal-integration-angular/assets/i18n/de.json @@ -72,11 +72,11 @@ "TOGGLE_BUTTON": { "SIMPLE": { "TEXT": "Einfach", - "ARIA_LABEL": "Zu einfachen Suchkriterien wechseln" + "DETAIL": "Zu einfachen Suchkriterien wechseln" }, "ADVANCED": { "TEXT": "Erweitert", - "ARIA_LABEL": "Zu erweiterten Suchkriterien wechseln" + "DETAIL": "Zu erweiterten Suchkriterien wechseln" } }, "OCX_SEARCH_CONFIG": { @@ -85,11 +85,11 @@ "HEADLINE": "Suche", "RESET_BUTTON": { "TEXT": "Zurücksetzen", - "ARIA_LABEL": "Suchkriterien zurücksetzen" + "DETAIL": "Suchkriterien zurücksetzen" }, "SEARCH_BUTTON": { "TEXT": "Suchen", - "ARIA_LABEL": "Suchen" + "DETAIL": "Suche starten" }, "RESET_BUTTON_TEXT": "Zurücksetzen", "SEARCH_BUTTON_TEXT": "Suchen", diff --git a/libs/portal-integration-angular/assets/i18n/en.json b/libs/portal-integration-angular/assets/i18n/en.json index e9d19e17..b5b5be65 100644 --- a/libs/portal-integration-angular/assets/i18n/en.json +++ b/libs/portal-integration-angular/assets/i18n/en.json @@ -72,11 +72,11 @@ "TOGGLE_BUTTON": { "SIMPLE": { "TEXT": "Simple", - "ARIA_LABEL": "Switch to simple search criteria" + "DETAIL": "Switch to simple search criteria" }, "ADVANCED": { "TEXT": "Advanced", - "ARIA_LABEL": "Switch to advanced search criteria" + "DETAIL": "Switch to advanced search criteria" } }, "OCX_SEARCH_CONFIG": { @@ -85,11 +85,11 @@ "HEADLINE": "Search", "RESET_BUTTON": { "TEXT": "Reset", - "ARIA_LABEL": "Reset search criteria" + "DETAIL": "Reset search criteria" }, "SEARCH_BUTTON": { "TEXT": "Search", - "ARIA_LABEL": "Search" + "DETAIL": "Start search" }, "EXPORT": "Export all events" }, diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html index 97ec354c..bd778301 100644 --- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html +++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.html @@ -48,7 +48,7 @@

{{ subheader }}

[title]="(action.titleKey ? (action.titleKey | translate) : action.title) || (action.labelKey ? (action.labelKey | translate) : action.label)" [disabled]="action.disabled ? action.disabled : false" [attr.name]="action.icon ? 'ocx-page-header-inline-action-icon-button' : 'ocx-page-header-inline-action-button'" - [ariaLabel]="action.ariaLabel ? (action.ariaLabel | translate) : (action.titleKey ? (action.titleKey | translate) : action.title) || (action.labelKey ? (action.labelKey | translate) : action.label)" + [ariaLabel]="(action.titleKey ? (action.titleKey | translate) : action.title) || (action.labelKey ? (action.labelKey | translate) : action.label)" > diff --git a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts index e66a6a54..859d5ca4 100644 --- a/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/page-header/page-header.component.ts @@ -41,7 +41,6 @@ export interface Action { // Note: This currently doesn't work with dynamic values, since a passed in Action is just a copy of the original object. // As a workaround, you can manually update/replace the passed in Action if you wish to update a showCondition showCondition?: boolean - ariaLabel?: string } export interface ObjectDetailItem { diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html index 31eacc6e..b3173824 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.html @@ -19,8 +19,8 @@ (onClick)="onResetClicked()" label="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}" icon="pi pi-eraser" - [ariaLabel]="'OCX_SEARCH_HEADER.RESET_BUTTON.ARIA_LABEL' | translate" - title="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.TEXT' | translate }}" + [ariaLabel]="'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate" + title="{{ 'OCX_SEARCH_HEADER.RESET_BUTTON.DETAIL' | translate }}" > @@ -29,8 +29,8 @@ (onClick)="onSearchClicked()" label="{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}" icon="pi pi-search" - [ariaLabel]="'OCX_SEARCH_HEADER.SEARCH_BUTTON.ARIA_LABEL' | translate" - title="{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.TEXT' | translate }}" + [ariaLabel]="'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate" + title="{{ 'OCX_SEARCH_HEADER.SEARCH_BUTTON.DETAIL' | translate }}" > diff --git a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts index 61f11311..95f66d1e 100644 --- a/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts +++ b/libs/portal-integration-angular/src/lib/core/components/search-header/search-header.component.ts @@ -85,10 +85,10 @@ export class SearchHeaderComponent implements AfterViewInit { : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.TEXT', actionCallback: () => this.toggleViewMode(), show: 'always', - ariaLabel: + titleKey: this.viewMode === 'basic' - ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.ARIA_LABEL' - : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.ARIA_LABEL', + ? 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.ADVANCED.DETAIL' + : 'OCX_SEARCH_HEADER.TOGGLE_BUTTON.SIMPLE.DETAIL', }) } this.headerActions = headerActions.concat(this.actions)