Merge pull request #1016 from geonetwork/fix-orgs-page

Datahub: fix untranslated text and wrong search filters in organizations page

apps/datahub/src/app/organization/organization-details/organization-details.component.html

@@ -1,4 +1,6 @@
-<ng-container *ngIf="organization; else orgNotFound">
+<ng-container
+  *ngIf="currentOrganization$ | async as organization; else orgNotFound"
+>
   <ng-container *ngrxLet="lastPublishedDatasets$ as lastPublishedDatasets">
     <div id="organization-details-container" class="flex flex-col gap-[72px]">
       <div class="h-full container-lg mx-auto px-[25px] w-full">
@@ -21,7 +23,7 @@
           >
             <div
               data-test="organizationLogo"
-              class="bg-white border border-[#d8d8d8] w-full h-[185px] rounded-lg p-[30px] -mt-28"
+              class="border-solid border border-gray-300 rounded-md bg-white h-[185px] overflow-hidden -mt-28"
             >
               <gn-ui-thumbnail
                 class="relative"
@@ -94,12 +96,7 @@
             </div>
 
             <div id="lastPublishedDatasets" data-test="lastPubliDatasets">
-              <ng-container
-                *ngIf="
-                  !isSearchFacadeLoading && lastPublishedDatasets.length > 0;
-                  else orgHasNoDataset
-                "
-              >
+              <ng-container *ngIf="!isSearchFacadeLoading">
                 <div
                   class="mb-4 flex flex-wrap gap-9 justify-center sm:justify-start px-[25px]"
                   data-test="orgPageLasPubDat"
@@ -134,16 +131,6 @@
                   <gn-ui-spinning-loader></gn-ui-spinning-loader>
                 </div>
               </ng-container>
-
-              <ng-template
-                #orgHasNoDataset
-                *ngIf="!isSearchFacadeLoading"
-                data-test="orgHasNoDataset"
-              >
-                <gn-ui-error
-                  [type]="ErrorType.ORGANIZATION_HAS_NO_DATASET"
-                ></gn-ui-error>
-              </ng-template>
             </div>
           </div>
         </div>

apps/datahub/src/app/organization/organization-details/organization-details.component.spec.ts

@@ -280,16 +280,21 @@ describe('OrganizationDetailsComponent', () => {
 
         expect(orgPageLasPubDat?.children.length).toEqual(1)
       })
+    })
+  })
 
-      it('should display the orgHasNodataset error component if the org has no dataset', () => {
-        results.next([])
-        fixture.detectChanges()
-
-        const orgHasNoDataset = getHTMLElement('lastPubliDatasets')
-
-        console.log(orgHasNoDataset?.outerHTML)
-
-        expect(orgHasNoDataset).toBeTruthy()
+  describe('when organization changes', () => {
+    const anotherOrg = someOrganizationsFixture()[1]
+    beforeEach(() => {
+      jest.clearAllMocks()
+      component.organization = anotherOrg
+      fixture.detectChanges()
+    })
+    it('updates the search filters', () => {
+      expect(searchFacade.setFilters).toHaveBeenCalledWith({
+        orgs: {
+          [anotherOrg.name]: true,
+        },
       })
     })
   })

apps/datahub/src/app/organization/organization-details/organization-details.component.ts

@@ -1,13 +1,9 @@
 import {
-  AfterViewInit,
   ChangeDetectionStrategy,
-  ChangeDetectorRef,
   Component,
   Input,
-  OnChanges,
   OnDestroy,
   OnInit,
-  SimpleChanges,
   ViewChild,
 } from '@angular/core'
 import { AsyncPipe, NgClass, NgForOf, NgIf } from '@angular/common'
@@ -39,7 +35,6 @@ import {
   combineLatest,
   distinctUntilChanged,
   Observable,
-  of,
   Subscription,
   switchMap,
 } from 'rxjs'
@@ -48,6 +43,7 @@ import { RouterLink } from '@angular/router'
 import { ROUTER_ROUTE_SEARCH } from '@geonetwork-ui/feature/router'
 import { OrganizationsServiceInterface } from '@geonetwork-ui/common/domain/organizations.service.interface'
 import { UiWidgetsModule } from '@geonetwork-ui/ui/widgets'
+import { startWith } from 'rxjs/operators'
 
 @Component({
   selector: 'datahub-organization-details',
@@ -76,19 +72,14 @@ import { UiWidgetsModule } from '@geonetwork-ui/ui/widgets'
     NgClass,
   ],
 })
-export class OrganizationDetailsComponent
-  implements OnInit, AfterViewInit, OnDestroy, OnChanges
-{
-  protected readonly Error = Error
+export class OrganizationDetailsComponent implements OnInit, OnDestroy {
   protected readonly ErrorType = ErrorType
   protected readonly ROUTER_ROUTE_SEARCH = ROUTER_ROUTE_SEARCH
 
   protected get pages() {
     return new Array(this.totalPages).fill(0).map((_, i) => i + 1)
   }
 
-  lastPublishedDatasets$: Observable<CatalogRecord[]> = of([])
-
   subscriptions$: Subscription = new Subscription()
 
   isSearchFacadeLoading = true
@@ -98,51 +89,38 @@ export class OrganizationDetailsComponent
   isFirstPage = this.currentPage === 1
   isLastPage = false
 
-  organizationHasChanged$ = new BehaviorSubject<void>(undefined)
-
-  @Input() organization?: Organization
+  currentOrganization$ = new BehaviorSubject<Organization>(null)
+  @Input() set organization(value: Organization) {
+    this.currentOrganization$.next(value)
+  }
   @Input() paginationContainerClass = 'w-full bottom-0 top-auto'
 
   @ViewChild(BlockListComponent) list: BlockListComponent
 
+  lastPublishedDatasets$: Observable<CatalogRecord[]> =
+    this.currentOrganization$.pipe(
+      switchMap((organization) =>
+        this.organizationsService.getFiltersForOrgs([organization])
+      ),
+      switchMap(
+        (filters) =>
+          this.searchFacade
+            .setFilters(filters)
+            .setSortBy(['desc', 'changeDate']).results$
+      ),
+      startWith([])
+    )
+
   constructor(
-    private changeDetector: ChangeDetectorRef,
     private searchFacade: SearchFacade,
     private organizationsService: OrganizationsServiceInterface
   ) {}
 
   ngOnInit(): void {
     this.searchFacade.setPageSize(3)
-
-    this.lastPublishedDatasets$ = this.organizationHasChanged$.pipe(
-      distinctUntilChanged(),
-      switchMap(() => {
-        return this.organizationsService
-          .getFiltersForOrgs([this.organization])
-          .pipe(
-            switchMap((filters) => {
-              return this.searchFacade
-                .setFilters(filters)
-                .setSortBy(['desc', 'changeDate']).results$
-            })
-          )
-      })
-    )
-
     this.manageSubscriptions()
   }
 
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['organization']) {
-      this.organizationHasChanged$.next()
-    }
-  }
-
-  ngAfterViewInit() {
-    // this is required to show the pagination correctly
-    this.changeDetector.detectChanges()
-  }
-
   ngOnDestroy(): void {
     this.subscriptions$.unsubscribe()
   }

libs/ui/elements/src/lib/error/error.component.stories.ts

@@ -49,6 +49,8 @@ export const Primary: StoryObj<ErrorComponent> = {
         ErrorType.COULD_NOT_REACH_API,
         ErrorType.RECORD_NOT_FOUND,
         ErrorType.DATASET_HAS_NO_LINK,
+        ErrorType.ORGANIZATION_HAS_NO_DATASET,
+        ErrorType.ORGANIZATION_NOT_FOUND,
       ],
     },
   },

translations/en.json

@@ -370,8 +370,8 @@
   "organisations.sortBy.nameDesc": "Name Z → A",
   "organisations.sortBy.recordCountAsc": "Publications 0 → 9",
   "organisations.sortBy.recordCountDesc": "Publications 9 → 0",
-  "organization.details.lastPublishedDatasets": "",
-  "organization.details.lastPublishedDatasets.searchAllButton": "",
+  "organization.details.lastPublishedDatasets": "Last published datasets",
+  "organization.details.lastPublishedDatasets.searchAllButton": "Search all",
   "organization.details.mailContact": "Contact by email",
   "organization.header.recordCount": "{count, plural, =0{data} one{data} other{datas}}",
   "pagination.nextPage": "Next page",

translations/fr.json

@@ -370,8 +370,8 @@
   "organisations.sortBy.nameDesc": "Nom Z → A",
   "organisations.sortBy.recordCountAsc": "Données 0 → 9",
   "organisations.sortBy.recordCountDesc": "Données 9 → 0",
-  "organization.details.lastPublishedDatasets": "",
-  "organization.details.lastPublishedDatasets.searchAllButton": "",
+  "organization.details.lastPublishedDatasets": "Dernières données publiées",
+  "organization.details.lastPublishedDatasets.searchAllButton": "Rechercher tout",
   "organization.details.mailContact": "Contacter par mail",
   "organization.header.recordCount": "{count, plural, =0{donnée} one{donnée} other{données}}",
   "pagination.nextPage": "Page suivante",