From 5eb5f9f0fdbb7cf557a3d755384934390d074570 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Tue, 24 Sep 2024 16:34:43 +0200 Subject: [PATCH 1/3] feat(search): separate search inputs for allRecords and myRecords hide search for drafts for now --- .../dashboard-menu.component.html | 1 - .../dashboard-menu.component.ts | 10 +- .../dashboard/dashboard-page.component.html | 10 +- .../search-header/search-header.component.ts | 8 +- .../all-records/all-records.component.html | 136 ++++++++++-------- .../all-records/all-records.component.ts | 4 + .../records/my-draft/my-draft.component.html | 41 +++--- .../records/my-draft/my-draft.component.ts | 2 + .../my-records/my-records.component.html | 120 +++++++++------- .../my-records/my-records.component.ts | 7 +- 10 files changed, 176 insertions(+), 163 deletions(-) diff --git a/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.html b/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.html index 547abf9c4c..7ded10a5ee 100644 --- a/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.html +++ b/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.html @@ -3,7 +3,6 @@
dashboard.labels.catalog
-
- -
-
-
- -
- -
+
diff --git a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts index 04a219aa90..9b547ab0a0 100644 --- a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts +++ b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts @@ -4,7 +4,6 @@ import { MatIconModule } from '@angular/material/icon' import { LetDirective } from '@ngrx/component' import { FeatureSearchModule, - FuzzySearchComponent, SearchService, } from '@geonetwork-ui/feature/search' import { UiElementsModule } from '@geonetwork-ui/ui/elements' @@ -32,18 +31,13 @@ import { RouterFacade } from '@geonetwork-ui/feature/router' export class SearchHeaderComponent { public placeholder$ = this.avatarService.getPlaceholder() activeBtn = false - @ViewChild('fuzzySearch') fuzzySearch: FuzzySearchComponent constructor( public platformService: PlatformServiceInterface, private avatarService: AvatarServiceInterface, private searchService: SearchService, private routerFacade: RouterFacade - ) { - this.routerFacade.currentRoute$.subscribe(() => { - this.fuzzySearch?.autocomplete?.clear() - }) - } + ) {} handleItemSelection(item: CatalogRecord) { this.searchService.updateFilters({ any: item.title }) diff --git a/apps/metadata-editor/src/app/records/all-records/all-records.component.html b/apps/metadata-editor/src/app/records/all-records/all-records.component.html index 29848acc54..03601657c8 100644 --- a/apps/metadata-editor/src/app/records/all-records/all-records.component.html +++ b/apps/metadata-editor/src/app/records/all-records/all-records.component.html @@ -1,69 +1,79 @@ -
-
- -

- dashboard.records.search -

-
- -
- - -

- dashboard.records.all -

-
- -
- +
+ +
+
+
+
-
-
- dashboard.results.listMetadata +
+
+ +

+ dashboard.records.search +

+
+ +
+ + +

+ dashboard.records.all +

+
+ +
+
-
- dashboard.results.listResources -
-
- - dashboard.importRecord - keyboard_arrow_down + dashboard.results.listMetadata +
+
+ dashboard.results.listResources +
+
+ - keyboard_arrow_updashboard.importRecord + keyboard_arrow_down + keyboard_arrow_up + + + + + - - - - - - edit_document - dashboard.createRecord - -
+ edit_document + dashboard.createRecord + +
- -
+ + + diff --git a/apps/metadata-editor/src/app/records/all-records/all-records.component.ts b/apps/metadata-editor/src/app/records/all-records/all-records.component.ts index beb5980686..8ff48433ad 100644 --- a/apps/metadata-editor/src/app/records/all-records/all-records.component.ts +++ b/apps/metadata-editor/src/app/records/all-records/all-records.component.ts @@ -29,6 +29,8 @@ import { TemplatePortal } from '@angular/cdk/portal' import { ImportRecordComponent } from '@geonetwork-ui/feature/editor' import { RecordsListComponent } from '../records-list.component' import { map } from 'rxjs/operators' +import { SearchHeaderComponent } from '../../dashboard/search-header/search-header.component' +import { NotificationsContainerComponent } from '@geonetwork-ui/feature/notifications' @Component({ selector: 'md-editor-all-records', @@ -47,6 +49,8 @@ import { map } from 'rxjs/operators' CdkOverlayOrigin, CdkConnectedOverlay, RecordsListComponent, + SearchHeaderComponent, + NotificationsContainerComponent, ], }) export class AllRecordsComponent { diff --git a/apps/metadata-editor/src/app/records/my-draft/my-draft.component.html b/apps/metadata-editor/src/app/records/my-draft/my-draft.component.html index 24ef15fa5a..21f0adc770 100644 --- a/apps/metadata-editor/src/app/records/my-draft/my-draft.component.html +++ b/apps/metadata-editor/src/app/records/my-draft/my-draft.component.html @@ -1,20 +1,25 @@ -
-
-

- dashboard.records.myDraft -

+
+
+
+
+
+

+ dashboard.records.myDraft +

+
-
- -
-
+
+ +
+
+ diff --git a/apps/metadata-editor/src/app/records/my-draft/my-draft.component.ts b/apps/metadata-editor/src/app/records/my-draft/my-draft.component.ts index 88dfa0005e..0c56c0f624 100644 --- a/apps/metadata-editor/src/app/records/my-draft/my-draft.component.ts +++ b/apps/metadata-editor/src/app/records/my-draft/my-draft.component.ts @@ -12,6 +12,7 @@ import { TranslateModule } from '@ngx-translate/core' import { startWith, switchMap } from 'rxjs' import { RecordsCountComponent } from '../records-count/records-count.component' import { RecordsListComponent } from '../records-list.component' +import { NotificationsContainerComponent } from '@geonetwork-ui/feature/notifications' @Component({ selector: 'md-editor-my-my-draft', templateUrl: './my-draft.component.html', @@ -27,6 +28,7 @@ import { RecordsListComponent } from '../records-list.component' ResultsTableContainerComponent, UiElementsModule, ResultsTableComponent, + NotificationsContainerComponent, ], }) export class MyDraftComponent { diff --git a/apps/metadata-editor/src/app/records/my-records/my-records.component.html b/apps/metadata-editor/src/app/records/my-records/my-records.component.html index a8456fafd4..74cb62ec02 100644 --- a/apps/metadata-editor/src/app/records/my-records/my-records.component.html +++ b/apps/metadata-editor/src/app/records/my-records/my-records.component.html @@ -1,61 +1,71 @@ -
-
- -

- dashboard.records.myRecords -

-
- -
- +
+ +
+
+
+
-
-
- dashboard.myRecords.publishedMetadatas +
+
+ +

+ dashboard.records.myRecords +

+
+ +
+
-
- dashboard.myRecords.currentlyEdited -
-
- - dashboard.importRecord - keyboard_arrow_down + dashboard.myRecords.publishedMetadatas +
+
+ dashboard.myRecords.currentlyEdited +
+
+ - keyboard_arrow_updashboard.importRecord + keyboard_arrow_down + keyboard_arrow_up + + + + + - - - - - - edit_document - dashboard.createRecord - -
+ edit_document + dashboard.createRecord + +
- -
+ + + diff --git a/apps/metadata-editor/src/app/records/my-records/my-records.component.ts b/apps/metadata-editor/src/app/records/my-records/my-records.component.ts index 50adce074b..8f6be35987 100644 --- a/apps/metadata-editor/src/app/records/my-records/my-records.component.ts +++ b/apps/metadata-editor/src/app/records/my-records/my-records.component.ts @@ -18,7 +18,6 @@ import { } from '@geonetwork-ui/feature/search' import { PlatformServiceInterface } from '@geonetwork-ui/common/domain/platform.service.interface' import { UiElementsModule } from '@geonetwork-ui/ui/elements' -import { CatalogRecord } from '@geonetwork-ui/common/domain/model/record' import { Router } from '@angular/router' import { Overlay, OverlayRef } from '@angular/cdk/overlay' import { TemplatePortal } from '@angular/cdk/portal' @@ -26,6 +25,8 @@ import { RecordsCountComponent } from '../records-count/records-count.component' import { ButtonComponent } from '@geonetwork-ui/ui/inputs' import { MatIconModule } from '@angular/material/icon' import { ImportRecordComponent } from '@geonetwork-ui/feature/editor' +import { SearchHeaderComponent } from '../../dashboard/search-header/search-header.component' +import { NotificationsContainerComponent } from '@geonetwork-ui/feature/notifications' @Component({ selector: 'md-editor-my-records', @@ -43,6 +44,8 @@ import { ImportRecordComponent } from '@geonetwork-ui/feature/editor' MatIconModule, ImportRecordComponent, FeatureSearchModule, + SearchHeaderComponent, + NotificationsContainerComponent, ], }) export class MyRecordsComponent implements OnInit { @@ -64,6 +67,8 @@ export class MyRecordsComponent implements OnInit { ) {} ngOnInit() { + this.searchFacade.resetSearch() + this.platformService.getMe().subscribe((user) => { this.fieldsService .buildFiltersFromFieldValues({ owner: user.id }) From 197304cb05f92fdaf96a3fe565915ca6ac1860f8 Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Tue, 24 Sep 2024 16:47:49 +0200 Subject: [PATCH 2/3] feat(search): navigate to record on autocomplete select --- .../search-header/search-header.component.ts | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts index 9b547ab0a0..1025a8590c 100644 --- a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts +++ b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.ts @@ -2,16 +2,12 @@ import { CommonModule } from '@angular/common' import { ChangeDetectionStrategy, Component, ViewChild } from '@angular/core' import { MatIconModule } from '@angular/material/icon' import { LetDirective } from '@ngrx/component' -import { - FeatureSearchModule, - SearchService, -} from '@geonetwork-ui/feature/search' +import { FeatureSearchModule } from '@geonetwork-ui/feature/search' import { UiElementsModule } from '@geonetwork-ui/ui/elements' import { AvatarServiceInterface } from '@geonetwork-ui/api/repository' -import { PlatformServiceInterface } from '@geonetwork-ui/common/domain/platform.service.interface' import { TranslateModule } from '@ngx-translate/core' import { CatalogRecord } from '@geonetwork-ui/common/domain/model/record' -import { RouterFacade } from '@geonetwork-ui/feature/router' +import { Router } from '@angular/router' @Component({ selector: 'md-editor-search-header', @@ -33,13 +29,11 @@ export class SearchHeaderComponent { activeBtn = false constructor( - public platformService: PlatformServiceInterface, private avatarService: AvatarServiceInterface, - private searchService: SearchService, - private routerFacade: RouterFacade + private router: Router ) {} handleItemSelection(item: CatalogRecord) { - this.searchService.updateFilters({ any: item.title }) + this.router.navigate(['edit', item.uniqueIdentifier]) } } From 54cc28795d40de317486150dc6dc924be928200f Mon Sep 17 00:00:00 2001 From: Tobias Kohr Date: Wed, 25 Sep 2024 10:33:29 +0200 Subject: [PATCH 3/3] test(search): add and adapt tests --- .../src/e2e/dashboard.cy.ts | 82 +++++++++++++------ .../dashboard-menu.component.spec.ts | 13 +-- .../search-header.component.html | 2 - 3 files changed, 59 insertions(+), 38 deletions(-) diff --git a/apps/metadata-editor-e2e/src/e2e/dashboard.cy.ts b/apps/metadata-editor-e2e/src/e2e/dashboard.cy.ts index f6f6c161c5..ad270663d4 100644 --- a/apps/metadata-editor-e2e/src/e2e/dashboard.cy.ts +++ b/apps/metadata-editor-e2e/src/e2e/dashboard.cy.ts @@ -213,35 +213,17 @@ describe('dashboard', () => { cy.clearRecordDrafts() }) }) + describe('navigation', () => { - function checkDashboardFiltered() { - cy.get('gn-ui-autocomplete').type('Mat') - cy.get('mat-option').first().click() - cy.get('gn-ui-interactive-table') - .find('[data-cy="table-row"]') - .should('have.length', '1') - } beforeEach(() => { cy.login('admin', 'admin', false) cy.visit('/catalog/search') }) - describe('search input', () => { - it('should filter the dashboard based on the search input', () => { - checkDashboardFiltered() - }) - it('should navigate to list of all records and filter the dashboard based on the search input when on different page', () => { - cy.visit('/my-space/my-records') - checkDashboardFiltered() - }) - it('should clear the search input when navigating to my records', () => { - cy.get('gn-ui-autocomplete').type('Mat') - cy.get('md-editor-dashboard-menu').find('a').eq(5).click() - cy.get('gn-ui-autocomplete').should('have.value', '') - }) - it('should clear the search input when navigating to my drafts', () => { - cy.get('gn-ui-autocomplete').type('Mat') - cy.get('md-editor-dashboard-menu').find('a').eq(6).click() - cy.get('gn-ui-autocomplete').should('have.value', '') + describe('all records', () => { + it('should display the correct amount of records', () => { + cy.get('gn-ui-results-table') + .find('[data-cy="table-row"]') + .should('have.length', '15') }) }) describe('my records', () => { @@ -280,4 +262,56 @@ describe('dashboard', () => { }) }) }) + + describe('search', () => { + function checkDashboardFiltered() { + cy.get('gn-ui-autocomplete').type('velo{enter}') + cy.get('gn-ui-interactive-table') + .find('[data-cy="table-row"]') + .should('have.length', '1') + } + function checkAutocompleteSelected() { + cy.get('gn-ui-autocomplete').type('velo') + cy.get('mat-option').first().click() + cy.url().should('include', '/edit/accroche_velos') + } + describe('allRecords search input', () => { + beforeEach(() => { + cy.login('admin', 'admin', false) + cy.visit('/catalog/search') + }) + it('should filter the dashboard based on the search input', () => { + checkDashboardFiltered() + }) + it('should navigate to the record selected in the autocomplete', () => { + checkAutocompleteSelected() + }) + it('should clear the search input when navigating to my records', () => { + cy.get('gn-ui-autocomplete').type('velo') + cy.get('md-editor-dashboard-menu').find('a').eq(5).click() + cy.get('gn-ui-autocomplete').should('have.value', '') + }) + it('should hide the search input when navigating to my drafts', () => { + cy.get('md-editor-dashboard-menu').find('a').eq(6).click() + cy.get('gn-ui-autocomplete').should('not.exist') + }) + }) + describe('myRecords search input', () => { + beforeEach(() => { + cy.login('admin', 'admin', false) + cy.visit('/my-space/my-records') + }) + it('should filter the dashboard based on the search input', () => { + checkDashboardFiltered() + }) + it('should navigate to the record selected in the autocomplete', () => { + checkAutocompleteSelected() + }) + it('should clear the search input when navigating to all records', () => { + cy.get('gn-ui-autocomplete').type('velo') + cy.get('md-editor-dashboard-menu').find('a').first().click() + cy.get('gn-ui-autocomplete').should('have.value', '') + }) + }) + }) }) diff --git a/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.spec.ts b/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.spec.ts index 78f4e757ec..f6160ffb1a 100644 --- a/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.spec.ts +++ b/apps/metadata-editor/src/app/dashboard/dashboard-menu/dashboard-menu.component.spec.ts @@ -5,13 +5,11 @@ import { TranslateModule } from '@ngx-translate/core' import { cold, hot } from 'jasmine-marbles' import { MockBuilder, MockProviders } from 'ng-mocks' import { DashboardMenuComponent } from './dashboard-menu.component' -import { SearchFacade } from '@geonetwork-ui/feature/search' describe('DashboardMenuComponent', () => { let component: DashboardMenuComponent let fixture: ComponentFixture let recordsRepository: RecordsRepositoryInterface - let searchFacade: SearchFacade beforeEach(() => { return MockBuilder(DashboardMenuComponent) @@ -20,12 +18,9 @@ describe('DashboardMenuComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ imports: [DashboardMenuComponent, TranslateModule.forRoot()], - providers: [ - MockProviders(ActivatedRoute, RecordsRepositoryInterface, SearchFacade), - ], + providers: [MockProviders(ActivatedRoute, RecordsRepositoryInterface)], }).compileComponents() recordsRepository = TestBed.inject(RecordsRepositoryInterface) - searchFacade = TestBed.inject(SearchFacade) fixture = TestBed.createComponent(DashboardMenuComponent) component = fixture.componentInstance fixture.detectChanges() @@ -50,10 +45,4 @@ describe('DashboardMenuComponent', () => { // Assert that draftsCount$ behaves as expected expect(component.draftsCount$).toBeObservable(expected) }) - - it('should reset filters in main search', () => { - searchFacade.setFilters = jest.fn() - component.resetMainSearch() - expect(searchFacade.setFilters).toHaveBeenCalledWith({}) - }) }) diff --git a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.html b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.html index 451767f83c..e4627b2381 100644 --- a/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.html +++ b/apps/metadata-editor/src/app/dashboard/search-header/search-header.component.html @@ -1,7 +1,5 @@
-