[DURACOM-508] refactor, fix home/explore config issue, fix nested menus, fix comm/coll menu, improve tests

Author: FrancescoMolinaro

config/config.example.yml

@@ -404,7 +404,7 @@ homePage:
   # Enable or disable the Discover filters on the homepage
   showDiscoverFilters: false
   # Enable or disable the dynamic layout configuration on the homepage
-  enableDynamicLayout: true
+  enableDynamicLayout: false
 
 # Item Config
 item:
@@ -713,7 +713,7 @@ accessibility:
 layout:
   # Enable or disable the explore pages feature (/explore/:id routes and their navbar menu entries).
   # When false, explore routes redirect to 404 and the explore menu is hidden.
-  enableExplorePages: true
+  enableExplorePages: false
   # Configuration of icons and styles to be used for each authority controlled link
   authorityRef:
     - entityType: DEFAULT

src/app/app.menus.ts

@@ -9,6 +9,7 @@ import { buildMenuStructure } from './shared/menu/menu.structure';
 import { MenuID } from './shared/menu/menu-id.model';
 import { MenuRoute } from './shared/menu/menu-route.model';
 import { AccessControlMenuProvider } from './shared/menu/providers/access-control.menu';
+import { AdminCommunityListMenuProvider } from './shared/menu/providers/admin-community-list.menu';
 import { AdminSearchMenuProvider } from './shared/menu/providers/admin-search.menu';
 import { AuditLogsMenuProvider } from './shared/menu/providers/audit-item.menu';
 import { AuditOverviewMenuProvider } from './shared/menu/providers/audit-overview.menu';
@@ -64,6 +65,7 @@ export const MENUS = buildMenuStructure({
     ExploreMenuProvider,
   ],
   [MenuID.ADMIN]: [
+    AdminCommunityListMenuProvider,
     NewMenuProvider,
     EditMenuProvider,
     ImportMenuProvider,

src/app/core/data/section-data.service.ts

@@ -6,12 +6,9 @@ import { DSONameService } from '../breadcrumbs/dso-name.service';
 import { RemoteDataBuildService } from '../cache/builders/remote-data-build.service';
 import { ObjectCacheService } from '../cache/object-cache.service';
 import { Section } from '../layout/models/section.model';
-import { FollowLinkConfig } from '../shared/follow-link-config.model';
 import { HALEndpointService } from '../shared/hal-endpoint.service';
-import { FindAllData } from './base/find-all-data';
 import { IdentifiableDataService } from './base/identifiable-data.service';
 import { SearchDataImpl } from './base/search-data';
-import { FindListOptions } from './find-list-options.model';
 import { PaginatedList } from './paginated-list.model';
 import { RemoteData } from './remote-data';
 import { RequestService } from './request.service';
@@ -23,7 +20,6 @@ import { RequestService } from './request.service';
 export class SectionDataService extends IdentifiableDataService<Section> {
 
   protected linkPath = 'sections';
-  private findAllData: FindAllData<Section>;
   private searchData: SearchDataImpl<Section>;
 
   constructor(
@@ -39,12 +35,6 @@ export class SectionDataService extends IdentifiableDataService<Section> {
     this.searchData = new SearchDataImpl(this.linkPath, requestService, rdbService, objectCache, halService, this.responseMsToLive);
   }
 
-  /**
-   * Find all the configured sections.
-   */
-  findAll(options?: FindListOptions, useCachedVersionIfAvailable?: boolean, reRequestOnStale?: boolean, ...linksToFollow: FollowLinkConfig<Section>[]): Observable<RemoteData<PaginatedList<Section>>> {
-    return this.findAllData.findAll(options, useCachedVersionIfAvailable, reRequestOnStale, ...linksToFollow);
-  }
 
   /**
    * Finds all sections configured to be visible in the top navigation bar.

src/app/explore-page/explore-page.component.html

@@ -10,6 +10,11 @@
                 [sectionId]="sectionId"
                 [topSection]="$any(sectionComponent)"></ds-top-section>
             }
+            @case ('multi-column-top') {
+              <ds-multi-column-top-section
+                [sectionId]="sectionId"
+                [topSection]="$any(sectionComponent)"></ds-multi-column-top-section>
+            }
             @case ('browse') {
               <ds-browse-section
                 [sectionId]="sectionId"

src/app/explore-page/explore-page.component.spec.ts

@@ -33,6 +33,7 @@ import { RemoteData } from '../core/data/remote-data';
 import {
   BrowseSection,
   FacetSection,
+  MultiColumnTopSection,
   SearchSection,
   Section,
   TopSection,
@@ -41,6 +42,7 @@ import {
 import { ThemedBrowseSectionComponent } from '../shared/explore/section-component/browse-section/themed-browse-section.component';
 import { ThemedCountersSectionComponent } from '../shared/explore/section-component/counters-section/themed-counters-section.component';
 import { ThemedFacetSectionComponent } from '../shared/explore/section-component/facet-section/themed-facet-section.component';
+import { ThemedMultiColumnTopSectionComponent } from '../shared/explore/section-component/multi-column-top-section/themed-multi-column-top-section.component';
 import { ThemedSearchSectionComponent } from '../shared/explore/section-component/search-section/themed-search-section.component';
 import { ThemedTextSectionComponent } from '../shared/explore/section-component/text-section/themed-text-section.component';
 import { ThemedTopSectionComponent } from '../shared/explore/section-component/top-section/themed-top-section.component';
@@ -87,14 +89,24 @@ describe('ExploreComponent', () => {
     facetsPerRow: 4,
   };
 
+  const multiColumnTopComponent: MultiColumnTopSection = {
+    discoveryConfigurationName: 'publication',
+    componentType: 'multi-column-top',
+    style: 'col-md-12',
+    order: 'desc',
+    sortField: 'dc.date.accessioned',
+    titleKey: 'lastPublications',
+    columnList: [],
+  };
+
   beforeEach(waitForAsync(() => {
 
     sectionDataServiceStub = {
       findById(id: string): Observable<RemoteData<Section>> {
         if (id === 'publications') {
           const section = new Section();
           section.id = 'publications';
-          section.componentRows = [[browseComponent, searchComponent], [topComponent], [facetComponent]];
+          section.componentRows = [[browseComponent, searchComponent], [topComponent], [facetComponent], [multiColumnTopComponent]];
           return createSuccessfulRemoteDataObject$(section);
         } else {
           return of(null);
@@ -119,7 +131,7 @@ describe('ExploreComponent', () => {
         { provide: SectionDataService, useValue: sectionDataServiceStub },
         { provide: ActivatedRoute, useValue: route }],
       schemas: [NO_ERRORS_SCHEMA],
-    }).overrideComponent(ExplorePageComponent, { remove: { imports: [ThemedTopSectionComponent, ThemedBrowseSectionComponent, ThemedSearchSectionComponent, ThemedFacetSectionComponent, ThemedTextSectionComponent, ThemedCountersSectionComponent] } }).compileComponents();
+    }).overrideComponent(ExplorePageComponent, { remove: { imports: [ThemedTopSectionComponent, ThemedMultiColumnTopSectionComponent, ThemedBrowseSectionComponent, ThemedSearchSectionComponent, ThemedFacetSectionComponent, ThemedTextSectionComponent, ThemedCountersSectionComponent] } }).compileComponents();
 
   }));
 
@@ -133,9 +145,9 @@ describe('ExploreComponent', () => {
     expect(comp).toBeDefined();
   }));
 
-  it('should place the sections on three rows', () => {
+  it('should place the sections on four rows', () => {
     const container = fixture.debugElement.query(By.css('.container'));
-    expect(container.children.length).toEqual(3);
+    expect(container.children.length).toEqual(4);
 
     const firstRow = container.children[0];
     expect(firstRow.children.length).toEqual(2);
@@ -150,6 +162,10 @@ describe('ExploreComponent', () => {
     expect(thirdRow.children.length).toEqual(1);
     expect(thirdRow.children[0].children[0].name).toEqual('ds-facet-section');
 
+    const fourthRow = container.children[3];
+    expect(fourthRow.children.length).toEqual(1);
+    expect(fourthRow.children[0].children[0].name).toEqual('ds-multi-column-top-section');
+
     expect(component.sectionId).toEqual('publications');
   });
 

src/app/explore-page/explore-page.component.ts

@@ -19,6 +19,7 @@ import { getFirstSucceededRemoteDataPayload } from '../core/shared/operators';
 import { ThemedBrowseSectionComponent } from '../shared/explore/section-component/browse-section/themed-browse-section.component';
 import { ThemedCountersSectionComponent } from '../shared/explore/section-component/counters-section/themed-counters-section.component';
 import { ThemedFacetSectionComponent } from '../shared/explore/section-component/facet-section/themed-facet-section.component';
+import { ThemedMultiColumnTopSectionComponent } from '../shared/explore/section-component/multi-column-top-section/themed-multi-column-top-section.component';
 import { ThemedSearchSectionComponent } from '../shared/explore/section-component/search-section/themed-search-section.component';
 import { ThemedTextSectionComponent } from '../shared/explore/section-component/text-section/themed-text-section.component';
 import { ThemedTopSectionComponent } from '../shared/explore/section-component/top-section/themed-top-section.component';
@@ -28,7 +29,7 @@ import { ThemedTopSectionComponent } from '../shared/explore/section-component/t
  *
  * Fetches section configuration from the backend based on the current route parameter
  * and renders the configured sections as a responsive grid of section components.
- * Supported section types include: top, browse, search, facet, text-row, and counters.
+ * Supported section types include: top, multi-column-top, browse, search, facet, text-row, and counters.
  */
 @Component({
   selector: 'ds-explore',
@@ -39,6 +40,7 @@ import { ThemedTopSectionComponent } from '../shared/explore/section-component/t
     ThemedBrowseSectionComponent,
     ThemedCountersSectionComponent,
     ThemedFacetSectionComponent,
+    ThemedMultiColumnTopSectionComponent,
     ThemedSearchSectionComponent,
     ThemedTextSectionComponent,
     ThemedTopSectionComponent,

src/app/home-page/home-page.component.html

@@ -1,40 +1,6 @@
 @if (!isDynamicHomePageEnabled) {
-  @if (homeHeaderMetadataValue$ | async; as homeHeaderMetadataValue) {
-    <div class="container home-header">
-      <ds-markdown-viewer [value]="homeHeaderMetadataValue"></ds-markdown-viewer>
-    </div>
-  }
-
-  <ds-home-coar></ds-home-coar>
-  <ds-home-news></ds-home-news>
-
-  @if (showDiscoverFilters) {
-    <ds-configuration-search-page
-      [sideBarWidth]="3"
-      [showViewModes]="false"
-      [searchEnabled]="false"
-      [inPlaceSearch]="false"
-      [showScopeSelector]="false">
-      <ng-container searchContentTop *ngTemplateOutlet="homeContent"></ng-container>
-    </ds-configuration-search-page>
-  }
-  @if (!showDiscoverFilters) {
-    <div class="container">
-      <ng-container *ngTemplateOutlet="homeContent"></ng-container>
-    </div>
-  }
-  <ds-suggestions-popup></ds-suggestions-popup>
-
-  <ng-template #homeContent>
-    <ds-search-form [inPlaceSearch]="false"
-                    [searchPlaceholder]="'home.search-form.placeholder' | translate">
-    </ds-search-form>
-    <ds-top-level-community-list></ds-top-level-community-list>
-    @if (recentSubmissionspageSize>0) {
-      <ds-recent-item-list></ds-recent-item-list>
-    }
-  </ng-template>
-} @else {
+  <ng-container *ngTemplateOutlet="staticHomePage"></ng-container>
+} @else if (hasConfiguredSections$ | async) {
   @if ((site$.value && hasHomeHeaderMetadata)) {
     <div id="home-header-wrapper">
       <ds-text-section [sectionId]="'site'"
@@ -61,6 +27,11 @@
                       [sectionId]="sectionId"
                       [topSection]="$any(sectionComponent)"></ds-top-section>
                   }
+                  @case ('multi-column-top') {
+                    <ds-multi-column-top-section
+                      [sectionId]="sectionId"
+                      [topSection]="$any(sectionComponent)"></ds-multi-column-top-section>
+                  }
                   @case ('browse') {
                     <ds-browse-section
                       [sectionId]="sectionId"
@@ -98,6 +69,45 @@
 
   <ds-suggestions-popup></ds-suggestions-popup>
 
+} @else {
+  <ng-container *ngTemplateOutlet="staticHomePage"></ng-container>
 }
 
 
+<ng-template #staticHomePage>
+  @if (homeHeaderMetadataValue$ | async; as homeHeaderMetadataValue) {
+    <div class="container home-header">
+      <ds-markdown-viewer [value]="homeHeaderMetadataValue"></ds-markdown-viewer>
+    </div>
+  }
+
+  <ds-home-coar></ds-home-coar>
+  <ds-home-news></ds-home-news>
+
+  @if (showDiscoverFilters) {
+    <ds-configuration-search-page
+      [sideBarWidth]="3"
+      [showViewModes]="false"
+      [searchEnabled]="false"
+      [inPlaceSearch]="false"
+      [showScopeSelector]="false">
+      <ng-container searchContentTop *ngTemplateOutlet="homeContent"></ng-container>
+    </ds-configuration-search-page>
+  }
+  @if (!showDiscoverFilters) {
+    <div class="container">
+      <ng-container *ngTemplateOutlet="homeContent"></ng-container>
+    </div>
+  }
+  <ds-suggestions-popup></ds-suggestions-popup>
+
+  <ng-template #homeContent>
+    <ds-search-form [inPlaceSearch]="false"
+                    [searchPlaceholder]="'home.search-form.placeholder' | translate">
+    </ds-search-form>
+    <ds-top-level-community-list></ds-top-level-community-list>
+    @if (recentSubmissionspageSize>0) {
+      <ds-recent-item-list></ds-recent-item-list>
+    }
+  </ng-template>
+</ng-template>