From c32f2cabde2d016ce70e6e715a8c4a68d4d33260 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Fri, 8 Dec 2023 10:25:08 +0100 Subject: [PATCH 01/15] feat(organizations): add email field --- .../gn4/organizations/organizations-from-metadata.service.ts | 3 ++- libs/common/domain/src/lib/model/record/organization.model.ts | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/libs/api/repository/src/lib/gn4/organizations/organizations-from-metadata.service.ts b/libs/api/repository/src/lib/gn4/organizations/organizations-from-metadata.service.ts index 6a508144e9..4b18c68530 100644 --- a/libs/api/repository/src/lib/gn4/organizations/organizations-from-metadata.service.ts +++ b/libs/api/repository/src/lib/gn4/organizations/organizations-from-metadata.service.ts @@ -220,9 +220,10 @@ export class OrganizationsFromMetadataService .includes(this.normalizeString(group.email, false)) ) const { emails, ...fullOrg } = organisation - if (!group) return fullOrg + if (!group) return organisation return { ...fullOrg, + ...(group.email ? { emails: [...emails, group.email] } : emails), ...(group.description && { description: group.description }), ...(group.logo && { logoUrl: getAsUrl(`${IMAGE_URL}${group.logo}`) }), ...(group.website && { website: getAsUrl(group.website) }), diff --git a/libs/common/domain/src/lib/model/record/organization.model.ts b/libs/common/domain/src/lib/model/record/organization.model.ts index fa387137b0..e598fbed53 100644 --- a/libs/common/domain/src/lib/model/record/organization.model.ts +++ b/libs/common/domain/src/lib/model/record/organization.model.ts @@ -1,6 +1,7 @@ export interface Organization { name: string description?: string + emails?: string[] website?: URL logoUrl?: URL recordCount?: number From 324a85766b07bb937fc2f01d78b4ad9592d0d9e9 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Fri, 8 Dec 2023 10:26:05 +0100 Subject: [PATCH 02/15] feat(organizations): implement search --- .../organisations.component.html | 1 + .../organisations/organisations.component.ts | 42 ++++++++++++++++--- .../organisations-sort.component.html | 4 +- .../organisations-sort.component.ts | 5 +++ 4 files changed, 45 insertions(+), 7 deletions(-) diff --git a/libs/feature/catalog/src/lib/organisations/organisations.component.html b/libs/feature/catalog/src/lib/organisations/organisations.component.html index 14f76db490..eab66a4de9 100644 --- a/libs/feature/catalog/src/lib/organisations/organisations.component.html +++ b/libs/feature/catalog/src/lib/organisations/organisations.component.html @@ -1,5 +1,6 @@
= new BehaviorSubject(['asc', 'name']) + filterBy$: BehaviorSubject = new BehaviorSubject('') + filterByDebounced$: Observable = this.filterBy$.pipe( + debounceTime(300) + ) - organisationsSorted$: Observable = combineLatest([ + organisationsFilteredAndSorted$: Observable = combineLatest([ this.organisationsService.organisations$.pipe( startWith(Array(this.itemsOnPage).fill({})) ), this.sortBy$, + this.filterByDebounced$, ]).pipe( - map(([organisations, sortBy]) => - this.sortOrganisations(organisations, sortBy) - ) + map(([organisations, sortBy, filterByDebounced]) => { + const filteredOrganisations = this.filterOrganisations( + organisations, + filterByDebounced + ) + return this.sortOrganisations(filteredOrganisations, sortBy) + }) ) organisations$: Observable = combineLatest([ - this.organisationsSorted$, + this.organisationsFilteredAndSorted$, this.currentPage$, ]).pipe( tap( @@ -66,10 +75,31 @@ export class OrganisationsComponent { this.currentPage$.next(page) } + protected setFilterBy(value: string): void { + this.filterBy$.next(value) + } + protected setSortBy(value: SortByField): void { this.sortBy$.next(value) } + private filterOrganisations(organisations: Organization[], filterBy: string) { + if (!filterBy) return organisations + const filterRegex = new RegExp( + filterBy + .replace(/[()[\]{}*+?^$|#.,/\\]/g, '\\$&') //escape special characters + .replace(/\s(?=.)/g, '|') //replace whitespaces by separator + .replace(/\s/g, ''), //remove potential whitespaces left + 'i' + ) + return [...organisations].filter((org) => { + return ( + org.name.match(filterRegex) || + org.emails?.filter((email) => email.match(filterRegex))?.length > 0 + ) + }) + } + private sortOrganisations( organisations: Organization[], sortBy: SortByField diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html b/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html index 6edd40bab9..9f20e2fccb 100644 --- a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html +++ b/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html @@ -2,7 +2,9 @@ class="flex flex-wrap sm:flex-nowrap bg-primary text-white px-6 py-7 mt-4 mb-8 rounded-lg" > -

organisation.sort.intro

+ () + @Output() filterBy = new EventEmitter() selectOrderToDisplay(selectValue: string) { this.sortBy.emit(selectValue.split(',') as SortByField) } + + filterOrganisations(inputValue: string) { + this.filterBy.emit(inputValue) + } } From 8465f9b3d2c599bd659a3b5b37e4983eeb20ee3a Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Fri, 8 Dec 2023 14:37:05 +0100 Subject: [PATCH 03/15] feat(organisations-result): add component to display number of results --- .../organisations.component.html | 7 +++++++ .../organisations/organisations.component.ts | 11 +++++----- .../organisations-result.component.html | 5 +++++ .../organisations-result.component.spec.ts | 21 +++++++++++++++++++ .../organisations-result.component.ts | 11 ++++++++++ libs/ui/catalog/src/lib/ui-catalog.module.ts | 3 +++ translations/de.json | 1 + translations/en.json | 1 + translations/es.json | 1 + translations/fr.json | 1 + translations/it.json | 1 + translations/nl.json | 1 + translations/pt.json | 1 + translations/sk.json | 1 + 14 files changed, 61 insertions(+), 5 deletions(-) create mode 100644 libs/ui/catalog/src/lib/organisations-result/organisations-result.component.html create mode 100644 libs/ui/catalog/src/lib/organisations-result/organisations-result.component.spec.ts create mode 100644 libs/ui/catalog/src/lib/organisations-result/organisations-result.component.ts diff --git a/libs/feature/catalog/src/lib/organisations/organisations.component.html b/libs/feature/catalog/src/lib/organisations/organisations.component.html index eab66a4de9..017700b915 100644 --- a/libs/feature/catalog/src/lib/organisations/organisations.component.html +++ b/libs/feature/catalog/src/lib/organisations/organisations.component.html @@ -2,6 +2,13 @@ (sortBy)="setSortBy($event)" (filterBy)="setFilterBy($event)" > +
+ +
diff --git a/libs/feature/catalog/src/lib/organisations/organisations.component.ts b/libs/feature/catalog/src/lib/organisations/organisations.component.ts index 4438034c26..53b28ed197 100644 --- a/libs/feature/catalog/src/lib/organisations/organisations.component.ts +++ b/libs/feature/catalog/src/lib/organisations/organisations.component.ts @@ -33,12 +33,13 @@ export class OrganisationsComponent { totalPages: number currentPage$ = new BehaviorSubject(1) + organisationResults: number sortBy$: BehaviorSubject = new BehaviorSubject(['asc', 'name']) filterBy$: BehaviorSubject = new BehaviorSubject('') filterByDebounced$: Observable = this.filterBy$.pipe( debounceTime(300) ) - + organisationsTotal$ = this.organisationsService.organisationsCount$ organisationsFilteredAndSorted$: Observable = combineLatest([ this.organisationsService.organisations$.pipe( startWith(Array(this.itemsOnPage).fill({})) @@ -59,10 +60,10 @@ export class OrganisationsComponent { this.organisationsFilteredAndSorted$, this.currentPage$, ]).pipe( - tap( - ([organisations]) => - (this.totalPages = Math.ceil(organisations.length / this.itemsOnPage)) - ), + tap(([organisations]) => { + this.organisationResults = organisations.length + this.totalPages = Math.ceil(organisations.length / this.itemsOnPage) + }), map(([organisations, page]) => organisations.slice( (page - 1) * this.itemsOnPage, diff --git a/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.html b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.html new file mode 100644 index 0000000000..f9dc225276 --- /dev/null +++ b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.html @@ -0,0 +1,5 @@ +
+ organisations.hits.found +
diff --git a/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.spec.ts b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.spec.ts new file mode 100644 index 0000000000..4c9a6314a7 --- /dev/null +++ b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing' + +import { OrganisationsResultComponent } from './organisations-result.component' + +describe('OrganisationsResultComponent', () => { + let component: OrganisationsResultComponent + let fixture: ComponentFixture + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [OrganisationsResultComponent], + }) + fixture = TestBed.createComponent(OrganisationsResultComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) + + it('should create', () => { + expect(component).toBeTruthy() + }) +}) diff --git a/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.ts b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.ts new file mode 100644 index 0000000000..3ed741624b --- /dev/null +++ b/libs/ui/catalog/src/lib/organisations-result/organisations-result.component.ts @@ -0,0 +1,11 @@ +import { ChangeDetectionStrategy, Component, Input } from '@angular/core' + +@Component({ + selector: 'gn-ui-organisations-result', + templateUrl: './organisations-result.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class OrganisationsResultComponent { + @Input() hits: number + @Input() total: number +} diff --git a/libs/ui/catalog/src/lib/ui-catalog.module.ts b/libs/ui/catalog/src/lib/ui-catalog.module.ts index d1b97a9597..a54661aea7 100644 --- a/libs/ui/catalog/src/lib/ui-catalog.module.ts +++ b/libs/ui/catalog/src/lib/ui-catalog.module.ts @@ -8,6 +8,7 @@ import { UiElementsModule } from '@geonetwork-ui/ui/elements' import { OrganisationsSortComponent } from './organisations-sort/organisations-sort.component' import { UiInputsModule } from '@geonetwork-ui/ui/inputs' import { LanguageSwitcherComponent } from './language-switcher/language-switcher.component' +import { OrganisationsResultComponent } from './organisations-result/organisations-result.component' @NgModule({ declarations: [ @@ -15,6 +16,7 @@ import { LanguageSwitcherComponent } from './language-switcher/language-switcher OrganisationPreviewComponent, OrganisationsSortComponent, LanguageSwitcherComponent, + OrganisationsResultComponent, ], imports: [ CommonModule, @@ -28,6 +30,7 @@ import { LanguageSwitcherComponent } from './language-switcher/language-switcher OrganisationPreviewComponent, OrganisationsSortComponent, LanguageSwitcherComponent, + OrganisationsResultComponent, ], }) export class UiCatalogModule {} diff --git a/translations/de.json b/translations/de.json index b1cb3219cc..243147e9d1 100644 --- a/translations/de.json +++ b/translations/de.json @@ -180,6 +180,7 @@ "next": "weiter", "organisation.sort.intro": "Datengeber sind hier aufgelistet.", "organisation.sort.sortBy": "Sortieren nach:", + "organisations.hits.found": "{hits, plural, =0{Keine Organisation gefunden} other{{hits} von {total} Organisationen angezeigt}}", "organisations.sortBy.nameAsc": "Name A → Z", "organisations.sortBy.nameDesc": "Name Z → A", "organisations.sortBy.recordCountAsc": "Veröffentlichungen 0 → 9", diff --git a/translations/en.json b/translations/en.json index d6aaeb0b89..d764418e5a 100644 --- a/translations/en.json +++ b/translations/en.json @@ -180,6 +180,7 @@ "next": "next", "organisation.sort.intro": "Dataset providers are listed here.", "organisation.sort.sortBy": "Sort by:", + "organisations.hits.found": "{hits, plural, =0{No organizations found} other{{hits} out of {total} organizations shown}}", "organisations.sortBy.nameAsc": "Name A → Z", "organisations.sortBy.nameDesc": "Name Z → A", "organisations.sortBy.recordCountAsc": "Publications 0 → 9", diff --git a/translations/es.json b/translations/es.json index a9be25643d..994a5158d8 100644 --- a/translations/es.json +++ b/translations/es.json @@ -180,6 +180,7 @@ "next": "", "organisation.sort.intro": "", "organisation.sort.sortBy": "", + "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", "organisations.sortBy.nameDesc": "", "organisations.sortBy.recordCountAsc": "", diff --git a/translations/fr.json b/translations/fr.json index 88bf7fa157..b002b73695 100644 --- a/translations/fr.json +++ b/translations/fr.json @@ -180,6 +180,7 @@ "next": "suivant", "organisation.sort.intro": "Retrouvez sur cette page l'ensemble des fournisseurs de données de la plateforme.", "organisation.sort.sortBy": "Trier par :", + "organisations.hits.found": "{hits, plural, =0{Aucune organisation trouvé} one{1 organisation sur {total} affichée} other{{hits} organisations sur {total} affichées}}", "organisations.sortBy.nameAsc": "Nom A → Z", "organisations.sortBy.nameDesc": "Nom Z → A", "organisations.sortBy.recordCountAsc": "Données 0 → 9", diff --git a/translations/it.json b/translations/it.json index 83caee58a4..cf8fcb513b 100644 --- a/translations/it.json +++ b/translations/it.json @@ -180,6 +180,7 @@ "next": "", "organisation.sort.intro": "", "organisation.sort.sortBy": "", + "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", "organisations.sortBy.nameDesc": "", "organisations.sortBy.recordCountAsc": "", diff --git a/translations/nl.json b/translations/nl.json index bf47237a21..ee5f8b8e36 100644 --- a/translations/nl.json +++ b/translations/nl.json @@ -180,6 +180,7 @@ "next": "", "organisation.sort.intro": "", "organisation.sort.sortBy": "", + "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", "organisations.sortBy.nameDesc": "", "organisations.sortBy.recordCountAsc": "", diff --git a/translations/pt.json b/translations/pt.json index 6156d65526..d68a5ef01a 100644 --- a/translations/pt.json +++ b/translations/pt.json @@ -180,6 +180,7 @@ "next": "", "organisation.sort.intro": "", "organisation.sort.sortBy": "", + "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", "organisations.sortBy.nameDesc": "", "organisations.sortBy.recordCountAsc": "", diff --git a/translations/sk.json b/translations/sk.json index 1128d73bba..c705739d23 100644 --- a/translations/sk.json +++ b/translations/sk.json @@ -180,6 +180,7 @@ "next": "Ďalej", "organisation.sort.intro": "Zoradenie poskytovateľov datasetov.", "organisation.sort.sortBy": "Zoradiť podľa:", + "organisations.hits.found": "", "organisations.sortBy.nameAsc": "Názov A → Z", "organisations.sortBy.nameDesc": "Názov Z → A", "organisations.sortBy.recordCountAsc": "Publikácie 0 → 9", From 6f54bc7a6edc407b646b619244bc8aed18f6da95 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Fri, 8 Dec 2023 16:02:36 +0100 Subject: [PATCH 04/15] feat(search-input): add search-input.component and use it for orgs --- .../organisations-sort.component.html | 9 ++-- .../search-input/search-input.component.html | 22 ++++++++ .../search-input.component.spec.ts | 54 +++++++++++++++++++ .../search-input/search-input.component.ts | 29 ++++++++++ libs/ui/inputs/src/lib/ui-inputs.module.ts | 3 ++ 5 files changed, 113 insertions(+), 4 deletions(-) create mode 100644 libs/ui/inputs/src/lib/search-input/search-input.component.html create mode 100644 libs/ui/inputs/src/lib/search-input/search-input.component.spec.ts create mode 100644 libs/ui/inputs/src/lib/search-input/search-input.component.ts diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html b/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html index 9f20e2fccb..9866a06c58 100644 --- a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html +++ b/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html @@ -1,10 +1,11 @@
- - + + [placeholder]="'organisation.filter.placeholder' | translate" + > + + + +
diff --git a/libs/ui/inputs/src/lib/search-input/search-input.component.spec.ts b/libs/ui/inputs/src/lib/search-input/search-input.component.spec.ts new file mode 100644 index 0000000000..09b77fe969 --- /dev/null +++ b/libs/ui/inputs/src/lib/search-input/search-input.component.spec.ts @@ -0,0 +1,54 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing' + +import { SearchInputComponent } from './search-input.component' + +describe('SearchInputComponent', () => { + let component: SearchInputComponent + let fixture: ComponentFixture + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [SearchInputComponent], + }) + fixture = TestBed.createComponent(SearchInputComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) + + it('should create', () => { + expect(component).toBeTruthy() + }) + + describe('text input', () => { + let inputEl + beforeEach(() => { + fixture.detectChanges() + inputEl = fixture.nativeElement.querySelector('input') + }) + it('emits the value on a change event', () => { + let emitted + component.valueChange.subscribe((v) => (emitted = v)) + inputEl.value = 'Aaabcd' + inputEl.dispatchEvent(new Event('change')) + expect(emitted).toBe('Aaabcd') + }) + it('emits the value on an input event', () => { + let emitted + component.valueChange.subscribe((v) => (emitted = v)) + inputEl.value = 'Aaabcd' + inputEl.dispatchEvent(new Event('input')) + expect(emitted).toBe('Aaabcd') + }) + it('emits only unique values', () => { + let emittedCount = 0 + component.valueChange.subscribe(() => emittedCount++) + inputEl.value = 'Aaabcd' + inputEl.dispatchEvent(new Event('input')) + inputEl.value = 'Aaabcd' + inputEl.dispatchEvent(new Event('input')) + inputEl.value = 'bbb' + inputEl.dispatchEvent(new Event('input')) + expect(emittedCount).toBe(2) + }) + }) +}) diff --git a/libs/ui/inputs/src/lib/search-input/search-input.component.ts b/libs/ui/inputs/src/lib/search-input/search-input.component.ts new file mode 100644 index 0000000000..622f74d53d --- /dev/null +++ b/libs/ui/inputs/src/lib/search-input/search-input.component.ts @@ -0,0 +1,29 @@ +import { + ChangeDetectionStrategy, + Component, + Input, + Output, +} from '@angular/core' +import { Subject, distinctUntilChanged } from 'rxjs' + +@Component({ + selector: 'gn-ui-search-input', + templateUrl: './search-input.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class SearchInputComponent { + @Input() value = '' + @Input() placeholder = '' + rawChange = new Subject() + @Output() valueChange = this.rawChange.pipe(distinctUntilChanged()) + + handleChange($event) { + const value = $event.target.value + this.rawChange.next(value) + } + + clear() { + this.value = null + this.rawChange.next(null) + } +} diff --git a/libs/ui/inputs/src/lib/ui-inputs.module.ts b/libs/ui/inputs/src/lib/ui-inputs.module.ts index a595dbf425..4e9fa30fe7 100644 --- a/libs/ui/inputs/src/lib/ui-inputs.module.ts +++ b/libs/ui/inputs/src/lib/ui-inputs.module.ts @@ -35,6 +35,7 @@ import { CopyTextButtonComponent } from './copy-text-button/copy-text-button.com import { MatTooltipModule } from '@angular/material/tooltip' import { CommonModule } from '@angular/common' import { CheckboxComponent } from './checkbox/checkbox.component' +import { SearchInputComponent } from './search-input/search-input.component' @NgModule({ declarations: [ @@ -60,6 +61,7 @@ import { CheckboxComponent } from './checkbox/checkbox.component' CheckToggleComponent, CopyTextButtonComponent, CheckboxComponent, + SearchInputComponent, ], imports: [ CommonModule, @@ -92,6 +94,7 @@ import { CheckboxComponent } from './checkbox/checkbox.component' CheckToggleComponent, CopyTextButtonComponent, CheckboxComponent, + SearchInputComponent, ], }) export class UiInputsModule {} From 5c9dd9883f99d958c292ef15908c931f480623a2 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Wed, 13 Dec 2023 11:07:53 +0100 Subject: [PATCH 05/15] refactor(organisations): rename organisations-sort.component to organisations-filter.component --- apps/datahub-e2e/src/e2e/organizations.cy.ts | 4 ++-- .../lib/organisations/organisations.component.html | 4 ++-- .../organisations/organisations.component.spec.ts | 8 ++++---- libs/ui/catalog/src/index.ts | 2 +- .../organisations-filter.component.html} | 0 .../organisations-filter.component.spec.ts} | 13 ++++++++----- .../organisations-filter.component.stories.ts} | 10 +++++----- .../organisations-filter.component.ts} | 7 +++---- .../organisations-sort.component.css | 0 libs/ui/catalog/src/lib/ui-catalog.module.ts | 6 +++--- 10 files changed, 28 insertions(+), 26 deletions(-) rename libs/ui/catalog/src/lib/{organisations-sort/organisations-sort.component.html => organisations-filter/organisations-filter.component.html} (100%) rename libs/ui/catalog/src/lib/{organisations-sort/organisations-sort.component.spec.ts => organisations-filter/organisations-filter.component.spec.ts} (69%) rename libs/ui/catalog/src/lib/{organisations-sort/organisations-sort.component.stories.ts => organisations-filter/organisations-filter.component.stories.ts} (69%) rename libs/ui/catalog/src/lib/{organisations-sort/organisations-sort.component.ts => organisations-filter/organisations-filter.component.ts} (84%) delete mode 100644 libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.css diff --git a/apps/datahub-e2e/src/e2e/organizations.cy.ts b/apps/datahub-e2e/src/e2e/organizations.cy.ts index 106610cfcc..3d0424a9ec 100644 --- a/apps/datahub-e2e/src/e2e/organizations.cy.ts +++ b/apps/datahub-e2e/src/e2e/organizations.cy.ts @@ -5,7 +5,7 @@ describe('organizations', () => { cy.visit('/home/organisations') // aliases - cy.get('gn-ui-organisations-sort') + cy.get('gn-ui-organisations-filter') .find('gn-ui-dropdown-selector') .as('sort') cy.get('gn-ui-pagination').children('div').as('pagination') @@ -32,7 +32,7 @@ describe('organizations', () => { .should('eq', 'decoration-primary') }) it('should display the welcome panel', () => { - cy.get('gn-ui-organisations-sort').should('be.visible') + cy.get('gn-ui-organisations-filter').should('be.visible') cy.get('@sort').openDropdown().children('button').should('have.length', 4) }) it('should display organizations with thumbnail, title and description', () => { diff --git a/libs/feature/catalog/src/lib/organisations/organisations.component.html b/libs/feature/catalog/src/lib/organisations/organisations.component.html index 017700b915..f832e2289e 100644 --- a/libs/feature/catalog/src/lib/organisations/organisations.component.html +++ b/libs/feature/catalog/src/lib/organisations/organisations.component.html @@ -1,7 +1,7 @@ - +>
', }) -class OrganisationsSortMockComponent { +class OrganisationsFilterMockComponent { @Output() sortBy = new EventEmitter() } @Component({ @@ -63,7 +63,7 @@ describe('OrganisationsComponent', () => { await TestBed.configureTestingModule({ declarations: [ OrganisationsComponent, - OrganisationsSortMockComponent, + OrganisationsFilterMockComponent, OrganisationPreviewMockComponent, PaginationMockComponent, ContentGhostComponent, @@ -156,7 +156,7 @@ describe('OrganisationsComponent', () => { beforeEach(() => { setSortBySpy = jest.spyOn(component, 'setSortBy') de.query( - By.directive(OrganisationsSortMockComponent) + By.directive(OrganisationsFilterMockComponent) ).triggerEventHandler('sortBy', ['desc', 'recordCount']) fixture.detectChanges() orgPreviewComponents = de diff --git a/libs/ui/catalog/src/index.ts b/libs/ui/catalog/src/index.ts index 97165c1c8f..3cebead339 100644 --- a/libs/ui/catalog/src/index.ts +++ b/libs/ui/catalog/src/index.ts @@ -2,4 +2,4 @@ export * from './lib/ui-catalog.module' export * from './lib/catalog-title/catalog-title.component' export * from './lib/language-switcher/language-switcher.component' export * from './lib/organisation-preview/organisation-preview.component' -export * from './lib/organisations-sort/organisations-sort.component' +export * from './lib/organisations-filter/organisations-filter.component' diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html similarity index 100% rename from libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.html rename to libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.spec.ts b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.spec.ts similarity index 69% rename from libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.spec.ts rename to libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.spec.ts index a2f2758e75..60ec309274 100644 --- a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.spec.ts +++ b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.spec.ts @@ -1,5 +1,5 @@ import { ComponentFixture, TestBed } from '@angular/core/testing' -import { OrganisationsSortComponent } from './organisations-sort.component' +import { OrganisationsFilterComponent } from './organisations-filter.component' import { Component, EventEmitter, Input, Output } from '@angular/core' import { TranslateModule } from '@ngx-translate/core' @@ -18,16 +18,19 @@ class DropdownSelectorMockComponent { } describe('OrganisationsOrderComponent', () => { - let component: OrganisationsSortComponent - let fixture: ComponentFixture + let component: OrganisationsFilterComponent + let fixture: ComponentFixture beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [OrganisationsSortComponent, DropdownSelectorMockComponent], + declarations: [ + OrganisationsFilterComponent, + DropdownSelectorMockComponent, + ], imports: [TranslateModule.forRoot()], }).compileComponents() - fixture = TestBed.createComponent(OrganisationsSortComponent) + fixture = TestBed.createComponent(OrganisationsFilterComponent) component = fixture.componentInstance fixture.detectChanges() }) diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.stories.ts b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.stories.ts similarity index 69% rename from libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.stories.ts rename to libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.stories.ts index de2da26bd9..62adb35991 100644 --- a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.stories.ts +++ b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.stories.ts @@ -9,12 +9,12 @@ import { TRANSLATE_DEFAULT_CONFIG, UtilI18nModule, } from '@geonetwork-ui/util/i18n' -import { OrganisationsSortComponent } from './organisations-sort.component' +import { OrganisationsFilterComponent } from './organisations-filter.component' import { DropdownSelectorComponent } from '@geonetwork-ui/ui/inputs' export default { - title: 'Catalog/OrganisationsSortComponent', - component: OrganisationsSortComponent, + title: 'Catalog/OrganisationsFilterComponent', + component: OrganisationsFilterComponent, decorators: [ moduleMetadata({ declarations: [DropdownSelectorComponent], @@ -27,6 +27,6 @@ export default { (story) => `
${story}
` ), ], -} as Meta +} as Meta -export const Primary: StoryObj = {} +export const Primary: StoryObj = {} diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.ts b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.ts similarity index 84% rename from libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.ts rename to libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.ts index 2eb6fd507d..3f68abc8fa 100644 --- a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.ts +++ b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.ts @@ -8,12 +8,11 @@ import { marker } from '@biesbjerg/ngx-translate-extract-marker' import { SortByField } from '@geonetwork-ui/common/domain/model/search' @Component({ - selector: 'gn-ui-organisations-sort', - templateUrl: './organisations-sort.component.html', - styleUrls: ['./organisations-sort.component.css'], + selector: 'gn-ui-organisations-filter', + templateUrl: './organisations-filter.component.html', changeDetection: ChangeDetectionStrategy.OnPush, }) -export class OrganisationsSortComponent { +export class OrganisationsFilterComponent { choices: { value: string; label: string }[] = [ { value: 'asc,name', diff --git a/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.css b/libs/ui/catalog/src/lib/organisations-sort/organisations-sort.component.css deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/libs/ui/catalog/src/lib/ui-catalog.module.ts b/libs/ui/catalog/src/lib/ui-catalog.module.ts index a54661aea7..990100a7f3 100644 --- a/libs/ui/catalog/src/lib/ui-catalog.module.ts +++ b/libs/ui/catalog/src/lib/ui-catalog.module.ts @@ -5,7 +5,7 @@ import { OrganisationPreviewComponent } from './organisation-preview/organisatio import { TranslateModule } from '@ngx-translate/core' import { MatIconModule } from '@angular/material/icon' import { UiElementsModule } from '@geonetwork-ui/ui/elements' -import { OrganisationsSortComponent } from './organisations-sort/organisations-sort.component' +import { OrganisationsFilterComponent } from './organisations-filter/organisations-filter.component' import { UiInputsModule } from '@geonetwork-ui/ui/inputs' import { LanguageSwitcherComponent } from './language-switcher/language-switcher.component' import { OrganisationsResultComponent } from './organisations-result/organisations-result.component' @@ -14,7 +14,7 @@ import { OrganisationsResultComponent } from './organisations-result/organisatio declarations: [ CatalogTitleComponent, OrganisationPreviewComponent, - OrganisationsSortComponent, + OrganisationsFilterComponent, LanguageSwitcherComponent, OrganisationsResultComponent, ], @@ -28,7 +28,7 @@ import { OrganisationsResultComponent } from './organisations-result/organisatio exports: [ CatalogTitleComponent, OrganisationPreviewComponent, - OrganisationsSortComponent, + OrganisationsFilterComponent, LanguageSwitcherComponent, OrganisationsResultComponent, ], From 613ad7631f0778261667cbdc3a8e5c937da7b13b Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Thu, 14 Dec 2023 09:28:06 +0100 Subject: [PATCH 06/15] feat(i18n): add placeholder translation --- translations/de.json | 2 +- translations/en.json | 2 +- translations/es.json | 2 +- translations/fr.json | 2 +- translations/it.json | 2 +- translations/nl.json | 2 +- translations/pt.json | 2 +- translations/sk.json | 2 +- 8 files changed, 8 insertions(+), 8 deletions(-) diff --git a/translations/de.json b/translations/de.json index 243147e9d1..6ecb5d6d4a 100644 --- a/translations/de.json +++ b/translations/de.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "Suche", "nav.back": "Zurück", "next": "weiter", - "organisation.sort.intro": "Datengeber sind hier aufgelistet.", + "organisation.filter.placeholder": "Ergebnisse filtern", "organisation.sort.sortBy": "Sortieren nach:", "organisations.hits.found": "{hits, plural, =0{Keine Organisation gefunden} other{{hits} von {total} Organisationen angezeigt}}", "organisations.sortBy.nameAsc": "Name A → Z", diff --git a/translations/en.json b/translations/en.json index d764418e5a..cce6353f66 100644 --- a/translations/en.json +++ b/translations/en.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "Search", "nav.back": "Back", "next": "next", - "organisation.sort.intro": "Dataset providers are listed here.", + "organisation.filter.placeholder": "Filter results", "organisation.sort.sortBy": "Sort by:", "organisations.hits.found": "{hits, plural, =0{No organizations found} other{{hits} out of {total} organizations shown}}", "organisations.sortBy.nameAsc": "Name A → Z", diff --git a/translations/es.json b/translations/es.json index 994a5158d8..9e4bd02a79 100644 --- a/translations/es.json +++ b/translations/es.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "", "nav.back": "", "next": "", - "organisation.sort.intro": "", + "organisation.filter.placeholder": "", "organisation.sort.sortBy": "", "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", diff --git a/translations/fr.json b/translations/fr.json index b002b73695..795fff860d 100644 --- a/translations/fr.json +++ b/translations/fr.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "Rechercher", "nav.back": "Retour", "next": "suivant", - "organisation.sort.intro": "Retrouvez sur cette page l'ensemble des fournisseurs de données de la plateforme.", + "organisation.filter.placeholder": "Filtrer les résultats", "organisation.sort.sortBy": "Trier par :", "organisations.hits.found": "{hits, plural, =0{Aucune organisation trouvé} one{1 organisation sur {total} affichée} other{{hits} organisations sur {total} affichées}}", "organisations.sortBy.nameAsc": "Nom A → Z", diff --git a/translations/it.json b/translations/it.json index cf8fcb513b..b5c7f49092 100644 --- a/translations/it.json +++ b/translations/it.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "", "nav.back": "", "next": "", - "organisation.sort.intro": "", + "organisation.filter.placeholder": "", "organisation.sort.sortBy": "", "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", diff --git a/translations/nl.json b/translations/nl.json index ee5f8b8e36..2176b77624 100644 --- a/translations/nl.json +++ b/translations/nl.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "", "nav.back": "", "next": "", - "organisation.sort.intro": "", + "organisation.filter.placeholder": "", "organisation.sort.sortBy": "", "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", diff --git a/translations/pt.json b/translations/pt.json index d68a5ef01a..4a2bdba25c 100644 --- a/translations/pt.json +++ b/translations/pt.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "", "nav.back": "", "next": "", - "organisation.sort.intro": "", + "organisation.filter.placeholder": "", "organisation.sort.sortBy": "", "organisations.hits.found": "", "organisations.sortBy.nameAsc": "", diff --git a/translations/sk.json b/translations/sk.json index c705739d23..c43cce6973 100644 --- a/translations/sk.json +++ b/translations/sk.json @@ -178,7 +178,7 @@ "multiselect.filter.placeholder": "Hľadať", "nav.back": "Späť", "next": "Ďalej", - "organisation.sort.intro": "Zoradenie poskytovateľov datasetov.", + "organisation.filter.placeholder": "", "organisation.sort.sortBy": "Zoradiť podľa:", "organisations.hits.found": "", "organisations.sortBy.nameAsc": "Názov A → Z", From a2f451d076ca8cdaf957eed9b7977f2c48056e52 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Thu, 14 Dec 2023 14:43:19 +0100 Subject: [PATCH 07/15] feat(org/search): refine organisations search filter UI --- .../organisations-filter.component.html | 2 +- .../lib/search-input/search-input.component.html | 15 +++++++++------ 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html index 9866a06c58..6fd793a552 100644 --- a/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html +++ b/libs/ui/catalog/src/lib/organisations-filter/organisations-filter.component.html @@ -1,5 +1,5 @@
- +
+
+ search +