Fix issue with components that using a custom decorator are not loaded during CSR

2025-10-07 10:04:11 +00:00 · 2021-01-15 14:18:18 +01:00
parent d8df9c46a5
commit 9aea3f20ea
15 changed files with 301 additions and 107 deletions
--- a/src/app/+admin/admin-search-page/admin-search.module.ts
+++ b/src/app/+admin/admin-search-page/admin-search.module.ts
@@ -0,0 +1,43 @@
+import { NgModule } from '@angular/core';
+import { SharedModule } from '../../shared/shared.module';
+import { AdminSearchPageComponent } from './admin-search-page.component';
+import { ItemAdminSearchResultListElementComponent } from './admin-search-results/admin-search-result-list-element/item-search-result/item-admin-search-result-list-element.component';
+import { CommunityAdminSearchResultListElementComponent } from './admin-search-results/admin-search-result-list-element/community-search-result/community-admin-search-result-list-element.component';
+import { CollectionAdminSearchResultListElementComponent } from './admin-search-results/admin-search-result-list-element/collection-search-result/collection-admin-search-result-list-element.component';
+import { ItemAdminSearchResultGridElementComponent } from './admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component';
+import { CommunityAdminSearchResultGridElementComponent } from './admin-search-results/admin-search-result-grid-element/community-search-result/community-admin-search-result-grid-element.component';
+import { CollectionAdminSearchResultGridElementComponent } from './admin-search-results/admin-search-result-grid-element/collection-search-result/collection-admin-search-result-grid-element.component';
+import { ItemAdminSearchResultActionsComponent } from './admin-search-results/item-admin-search-result-actions.component';
+
+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
+  ItemAdminSearchResultListElementComponent,
+  CommunityAdminSearchResultListElementComponent,
+  CollectionAdminSearchResultListElementComponent,
+  ItemAdminSearchResultGridElementComponent,
+  CommunityAdminSearchResultGridElementComponent,
+  CollectionAdminSearchResultGridElementComponent,
+  ItemAdminSearchResultActionsComponent
+];
+
+@NgModule({
+  imports: [
+    SharedModule.withEntryComponents(),
+  ],
+  declarations: [
+    AdminSearchPageComponent,
+    ...ENTRY_COMPONENTS
+  ]
+})
+export class AdminSearchModule {
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: SharedModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
+}
--- a/src/app/+admin/admin-workflow-page/admin-workflow.module.ts
+++ b/src/app/+admin/admin-workflow-page/admin-workflow.module.ts
@@ -0,0 +1,39 @@
+import { NgModule } from '@angular/core';
+import { SharedModule } from '../../shared/shared.module';
+
+import { WorkflowItemSearchResultAdminWorkflowGridElementComponent } from './admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component';
+import { WorkflowItemAdminWorkflowActionsComponent } from './admin-workflow-search-results/workflow-item-admin-workflow-actions.component';
+import { WorkflowItemSearchResultAdminWorkflowListElementComponent } from './admin-workflow-search-results/admin-workflow-search-result-list-element/workflow-item/workflow-item-search-result-admin-workflow-list-element.component';
+import { AdminWorkflowPageComponent } from './admin-workflow-page.component';
+
+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
+  WorkflowItemSearchResultAdminWorkflowListElementComponent,
+  WorkflowItemSearchResultAdminWorkflowGridElementComponent,
+];
+
+@NgModule({
+  imports: [
+    SharedModule.withEntryComponents()
+  ],
+  declarations: [
+    AdminWorkflowPageComponent,
+    WorkflowItemAdminWorkflowActionsComponent,
+    ...ENTRY_COMPONENTS
+  ],
+  exports: [
+    AdminWorkflowPageComponent
+  ]
+})
+export class AdminWorkflowModuleModule {
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: SharedModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
+}
--- a/src/app/+admin/admin.module.ts
+++ b/src/app/+admin/admin.module.ts
@@ -4,61 +4,21 @@ import { AdminAccessControlModule } from './admin-access-control/admin-access-co
 import { MetadataImportPageComponent } from './admin-import-metadata-page/metadata-import-page.component';
 import { AdminRegistriesModule } from './admin-registries/admin-registries.module';
 import { AdminRoutingModule } from './admin-routing.module';
-import { AdminSearchPageComponent } from './admin-search-page/admin-search-page.component';
-import { SearchPageModule } from '../+search-page/search-page.module';
-import { ItemAdminSearchResultListElementComponent } from './admin-search-page/admin-search-results/admin-search-result-list-element/item-search-result/item-admin-search-result-list-element.component';
-import { CommunityAdminSearchResultListElementComponent } from './admin-search-page/admin-search-results/admin-search-result-list-element/community-search-result/community-admin-search-result-list-element.component';
-import { CollectionAdminSearchResultListElementComponent } from './admin-search-page/admin-search-results/admin-search-result-list-element/collection-search-result/collection-admin-search-result-list-element.component';
-import { ItemAdminSearchResultGridElementComponent } from './admin-search-page/admin-search-results/admin-search-result-grid-element/item-search-result/item-admin-search-result-grid-element.component';
-import { CommunityAdminSearchResultGridElementComponent } from './admin-search-page/admin-search-results/admin-search-result-grid-element/community-search-result/community-admin-search-result-grid-element.component';
-import { CollectionAdminSearchResultGridElementComponent } from './admin-search-page/admin-search-results/admin-search-result-grid-element/collection-search-result/collection-admin-search-result-grid-element.component';
-import { ItemAdminSearchResultActionsComponent } from './admin-search-page/admin-search-results/item-admin-search-result-actions.component';
-import { WorkflowItemSearchResultAdminWorkflowGridElementComponent } from './admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-grid-element/workflow-item/workflow-item-search-result-admin-workflow-grid-element.component';
-import { WorkflowItemAdminWorkflowActionsComponent } from './admin-workflow-page/admin-workflow-search-results/workflow-item-admin-workflow-actions.component';
-import { WorkflowItemSearchResultAdminWorkflowListElementComponent } from './admin-workflow-page/admin-workflow-search-results/admin-workflow-search-result-list-element/workflow-item/workflow-item-search-result-admin-workflow-list-element.component';
-import { AdminWorkflowPageComponent } from './admin-workflow-page/admin-workflow-page.component';
 import { AdminCurationTasksComponent } from './admin-curation-tasks/admin-curation-tasks.component';
+import { AdminWorkflowModuleModule } from './admin-workflow-page/admin-workflow.module';
+import { AdminSearchModule } from './admin-search-page/admin-search.module';

@NgModule({
  imports: [
    AdminRoutingModule,
    AdminRegistriesModule,
    AdminAccessControlModule,
+    AdminSearchModule.withEntryComponents(),
+    AdminWorkflowModuleModule.withEntryComponents(),
    SharedModule,
-    SearchPageModule
  ],
  declarations: [
-    AdminSearchPageComponent,
-    AdminWorkflowPageComponent,
-    ItemAdminSearchResultListElementComponent,
-    CommunityAdminSearchResultListElementComponent,
-    CollectionAdminSearchResultListElementComponent,
-    ItemAdminSearchResultGridElementComponent,
-    CommunityAdminSearchResultGridElementComponent,
-    CollectionAdminSearchResultGridElementComponent,
-    ItemAdminSearchResultActionsComponent,
    AdminCurationTasksComponent,
-
-    WorkflowItemSearchResultAdminWorkflowListElementComponent,
-    WorkflowItemSearchResultAdminWorkflowGridElementComponent,
-    WorkflowItemAdminWorkflowActionsComponent,
-
-    MetadataImportPageComponent
-
-  ],
-  entryComponents: [
-    ItemAdminSearchResultListElementComponent,
-    CommunityAdminSearchResultListElementComponent,
-    CollectionAdminSearchResultListElementComponent,
-    ItemAdminSearchResultGridElementComponent,
-    CommunityAdminSearchResultGridElementComponent,
-    CollectionAdminSearchResultGridElementComponent,
-    ItemAdminSearchResultActionsComponent,
-
-    WorkflowItemSearchResultAdminWorkflowListElementComponent,
-    WorkflowItemSearchResultAdminWorkflowGridElementComponent,
-    WorkflowItemAdminWorkflowActionsComponent,
-
    MetadataImportPageComponent
  ]
 })
--- a/src/app/+browse-by/browse-by-page.module.ts
+++ b/src/app/+browse-by/browse-by-page.module.ts
@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { BrowseByRoutingModule } from './browse-by-routing.module';
+import { BrowseByModule } from './browse-by.module';
+import { ItemDataService } from '../core/data/item-data.service';
+import { BrowseService } from '../core/browse/browse.service';
+import { BrowseByGuard } from './browse-by-guard';
+
+@NgModule({
+  imports: [
+    BrowseByRoutingModule,
+    BrowseByModule.withEntryComponents()
+  ],
+  providers: [
+    ItemDataService,
+    BrowseService,
+    BrowseByGuard
+  ]
+})
+export class BrowseByPageModule {
+
+}
--- a/src/app/+browse-by/browse-by.module.ts
+++ b/src/app/+browse-by/browse-by.module.ts
@@ -1,33 +1,40 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { BrowseByTitlePageComponent } from './+browse-by-title-page/browse-by-title-page.component';
-import { ItemDataService } from '../core/data/item-data.service';
 import { SharedModule } from '../shared/shared.module';
-import { BrowseByRoutingModule } from './browse-by-routing.module';
-import { BrowseService } from '../core/browse/browse.service';
 import { BrowseByMetadataPageComponent } from './+browse-by-metadata-page/browse-by-metadata-page.component';
 import { BrowseByDatePageComponent } from './+browse-by-date-page/browse-by-date-page.component';
-import { BrowseByGuard } from './browse-by-guard';
 import { BrowseBySwitcherComponent } from './+browse-by-switcher/browse-by-switcher.component';

+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
+  BrowseByTitlePageComponent,
+  BrowseByMetadataPageComponent,
+  BrowseByDatePageComponent
+];
+
@NgModule({
  imports: [
-    BrowseByRoutingModule,
    CommonModule,
    SharedModule
  ],
  declarations: [
-    BrowseByTitlePageComponent,
-    BrowseByMetadataPageComponent,
-    BrowseByDatePageComponent,
-    BrowseBySwitcherComponent
+    BrowseBySwitcherComponent,
+    ...ENTRY_COMPONENTS
  ],
-  providers: [
-    ItemDataService,
-    BrowseService,
-    BrowseByGuard
+  exports: [
+    BrowseBySwitcherComponent
  ]
 })
 export class BrowseByModule {
-
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: SharedModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
 }
--- a/src/app/+item-page/item-page.module.ts
+++ b/src/app/+item-page/item-page.module.ts
@@ -23,14 +23,18 @@ import { UploadBitstreamComponent } from './bitstreams/upload/upload-bitstream.c
 import { StatisticsModule } from '../statistics/statistics.module';
 import { AbstractIncrementalListComponent } from './simple/abstract-incremental-list/abstract-incremental-list.component';
 import { UntypedItemComponent } from './simple/item-types/untyped-item/untyped-item.component';
+import { JournalEntitiesModule } from '../entity-groups/journal-entities/journal-entities.module';
+import { ResearchEntitiesModule } from '../entity-groups/research-entities/research-entities.module';

@NgModule({
  imports: [
    CommonModule,
-    SharedModule,
+    SharedModule.withEntryComponents(),
    ItemPageRoutingModule,
    EditItemPageModule,
-    StatisticsModule.forRoot()
+    StatisticsModule.forRoot(),
+    JournalEntitiesModule.withEntryComponents(),
+    ResearchEntitiesModule.withEntryComponents()
  ],
  declarations: [
    ItemPageComponent,
--- a/src/app/+my-dspace-page/my-dspace-page.module.ts
+++ b/src/app/+my-dspace-page/my-dspace-page.module.ts
@@ -6,41 +6,23 @@ import { SharedModule } from '../shared/shared.module';
 import { MyDspacePageRoutingModule } from './my-dspace-page-routing.module';
 import { MyDSpacePageComponent } from './my-dspace-page.component';
 import { MyDSpaceResultsComponent } from './my-dspace-results/my-dspace-results.component';
-import { WorkspaceItemSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/workspace-item-search-result/workspace-item-search-result-list-element.component';
-import { ClaimedSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/claimed-search-result/claimed-search-result-list-element.component';
-import { PoolSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/pool-search-result/pool-search-result-list-element.component';
 import { MyDSpaceNewSubmissionComponent } from './my-dspace-new-submission/my-dspace-new-submission.component';
-import { ItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/item-search-result/item-search-result-detail-element.component';
-import { WorkspaceItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/workspace-item-search-result/workspace-item-search-result-detail-element.component';
-import { WorkflowItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/workflow-item-search-result/workflow-item-search-result-detail-element.component';
-import { ClaimedTaskSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/claimed-task-search-result/claimed-task-search-result-detail-element.component';
 import { MyDSpaceGuard } from './my-dspace.guard';
 import { MyDSpaceConfigurationService } from './my-dspace-configuration.service';
-import { ItemSearchResultListElementSubmissionComponent } from '../shared/object-list/my-dspace-result-list-element/item-search-result/item-search-result-list-element-submission.component';
-import { WorkflowItemSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/workflow-item-search-result/workflow-item-search-result-list-element.component';
-import { PoolSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/pool-search-result/pool-search-result-detail-element.component';
 import { CollectionSelectorComponent } from './collection-selector/collection-selector.component';
+import { MyDspaceSearchModule } from './my-dspace-search.module';

@NgModule({
  imports: [
    CommonModule,
    SharedModule,
    MyDspacePageRoutingModule,
+    MyDspaceSearchModule.withEntryComponents()
  ],
  declarations: [
    MyDSpacePageComponent,
    MyDSpaceResultsComponent,
-    WorkspaceItemSearchResultListElementComponent,
-    WorkflowItemSearchResultListElementComponent,
-    ClaimedSearchResultListElementComponent,
-    PoolSearchResultListElementComponent,
-    ItemSearchResultDetailElementComponent,
-    WorkspaceItemSearchResultDetailElementComponent,
-    WorkflowItemSearchResultDetailElementComponent,
-    ClaimedTaskSearchResultDetailElementComponent,
-    PoolSearchResultDetailElementComponent,
    MyDSpaceNewSubmissionComponent,
-    ItemSearchResultListElementSubmissionComponent,
    CollectionSelectorComponent
  ],
  providers: [
--- a/src/app/+my-dspace-page/my-dspace-search.module.ts
+++ b/src/app/+my-dspace-page/my-dspace-search.module.ts
@@ -0,0 +1,57 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from '../shared/shared.module';
+
+import { MyDspacePageRoutingModule } from './my-dspace-page-routing.module';
+import { WorkspaceItemSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/workspace-item-search-result/workspace-item-search-result-list-element.component';
+import { ClaimedSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/claimed-search-result/claimed-search-result-list-element.component';
+import { PoolSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/pool-search-result/pool-search-result-list-element.component';
+import { ItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/item-search-result/item-search-result-detail-element.component';
+import { WorkspaceItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/workspace-item-search-result/workspace-item-search-result-detail-element.component';
+import { WorkflowItemSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/workflow-item-search-result/workflow-item-search-result-detail-element.component';
+import { ClaimedTaskSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/claimed-task-search-result/claimed-task-search-result-detail-element.component';
+import { ItemSearchResultListElementSubmissionComponent } from '../shared/object-list/my-dspace-result-list-element/item-search-result/item-search-result-list-element-submission.component';
+import { WorkflowItemSearchResultListElementComponent } from '../shared/object-list/my-dspace-result-list-element/workflow-item-search-result/workflow-item-search-result-list-element.component';
+import { PoolSearchResultDetailElementComponent } from '../shared/object-detail/my-dspace-result-detail-element/pool-search-result/pool-search-result-detail-element.component';
+
+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
+  WorkspaceItemSearchResultListElementComponent,
+  WorkflowItemSearchResultListElementComponent,
+  ClaimedSearchResultListElementComponent,
+  PoolSearchResultListElementComponent,
+  ItemSearchResultDetailElementComponent,
+  WorkspaceItemSearchResultDetailElementComponent,
+  WorkflowItemSearchResultDetailElementComponent,
+  ClaimedTaskSearchResultDetailElementComponent,
+  PoolSearchResultDetailElementComponent,
+  ItemSearchResultListElementSubmissionComponent
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    SharedModule,
+    MyDspacePageRoutingModule,
+  ],
+  declarations: [
+    ...ENTRY_COMPONENTS
+  ]
+})
+
+/**
+ * This module handles all components that are necessary for the mydspace page
+ */
+export class MyDspaceSearchModule {
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: MyDspaceSearchModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
+}
--- a/src/app/+search-page/search-page.module.ts
+++ b/src/app/+search-page/search-page.module.ts
@@ -11,6 +11,8 @@ import { SearchPageComponent } from './search-page.component';
 import { SidebarFilterService } from '../shared/sidebar/filter/sidebar-filter.service';
 import { SearchFilterService } from '../core/shared/search/search-filter.service';
 import { SearchConfigurationService } from '../core/shared/search/search-configuration.service';
+import { JournalEntitiesModule } from '../entity-groups/journal-entities/journal-entities.module';
+import { ResearchEntitiesModule } from '../entity-groups/research-entities/research-entities.module';

 const components = [
  SearchPageComponent,
@@ -21,9 +23,11 @@ const components = [
@NgModule({
  imports: [
    CommonModule,
-    SharedModule,
+    SharedModule.withEntryComponents(),
    CoreModule.forRoot(),
-    StatisticsModule.forRoot()
+    StatisticsModule.forRoot(),
+    JournalEntitiesModule.withEntryComponents(),
+    ResearchEntitiesModule.withEntryComponents()
  ],
  declarations: components,
  providers: [
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -106,8 +106,8 @@ import { ForbiddenComponent } from './forbidden/forbidden.component';
          },
          {
            path: 'browse',
-            loadChildren: () => import('./+browse-by/browse-by.module')
-              .then((m) => m.BrowseByModule),
+            loadChildren: () => import('./+browse-by/browse-by-page.module')
+              .then((m) => m.BrowseByPageModule),
            canActivate: [EndUserAgreementCurrentUserGuard]
          },
          {
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -25,8 +25,6 @@ import { CheckAuthenticationTokenAction } from './core/auth/auth.actions';

 import { CoreModule } from './core/core.module';
 import { ClientCookieService } from './core/services/client-cookie.service';
-import { JournalEntitiesModule } from './entity-groups/journal-entities/journal-entities.module';
-import { ResearchEntitiesModule } from './entity-groups/research-entities/research-entities.module';
 import { FooterComponent } from './footer/footer.component';
 import { HeaderNavbarWrapperComponent } from './header-nav-wrapper/header-navbar-wrapper.component';
 import { HeaderComponent } from './header/header.component';
@@ -66,11 +64,6 @@ const IMPORTS = [
  StoreRouterConnectingModule.forRoot(),
 ];

-const ENTITY_IMPORTS = [
-  JournalEntitiesModule,
-  ResearchEntitiesModule
-];
-
 IMPORTS.push(
  StoreDevtoolsModule.instrument({
    maxAge: 1000,
@@ -127,8 +120,7 @@ const EXPORTS = [
@NgModule({
  imports: [
    BrowserModule.withServerTransition({ appId: 'serverApp' }),
-    ...IMPORTS,
-    ...ENTITY_IMPORTS
+    ...IMPORTS
  ],
  providers: [
    ...PROVIDERS
--- a/src/app/entity-groups/journal-entities/journal-entities.module.ts
+++ b/src/app/entity-groups/journal-entities/journal-entities.module.ts
@@ -20,7 +20,8 @@ import { JournalVolumeSidebarSearchListElementComponent } from './item-list-elem
 import { JournalIssueSidebarSearchListElementComponent } from './item-list-elements/sidebar-search-list-elements/journal-issue/journal-issue-sidebar-search-list-element.component';
 import { JournalSidebarSearchListElementComponent } from './item-list-elements/sidebar-search-list-elements/journal/journal-sidebar-search-list-element.component';

-const COMPONENTS = [
+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
  JournalComponent,
  JournalIssueComponent,
  JournalVolumeComponent,
@@ -47,9 +48,19 @@ const COMPONENTS = [
    SharedModule
  ],
  declarations: [
-    ...COMPONENTS
+    ...ENTRY_COMPONENTS
  ]
 })
 export class JournalEntitiesModule {
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: JournalEntitiesModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }

 }
--- a/src/app/entity-groups/research-entities/research-entities.module.ts
+++ b/src/app/entity-groups/research-entities/research-entities.module.ts
@@ -28,7 +28,8 @@ import { OrgUnitSidebarSearchListElementComponent } from './item-list-elements/s
 import { PersonSidebarSearchListElementComponent } from './item-list-elements/sidebar-search-list-elements/person/person-sidebar-search-list-element.component';
 import { ProjectSidebarSearchListElementComponent } from './item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component';

-const COMPONENTS = [
+const ENTRY_COMPONENTS = [
+// put only entry components that use custom decorator
  OrgUnitComponent,
  PersonComponent,
  ProjectComponent,
@@ -47,8 +48,6 @@ const COMPONENTS = [
  OrgUnitSearchResultGridElementComponent,
  ProjectSearchResultGridElementComponent,
  PersonSearchResultListSubmissionElementComponent,
-  PersonInputSuggestionsComponent,
-  NameVariantModalComponent,
  OrgUnitSearchResultListSubmissionElementComponent,
  OrgUnitInputSuggestionsComponent,
  ExternalSourceEntryListSubmissionElementComponent,
@@ -57,6 +56,12 @@ const COMPONENTS = [
  ProjectSidebarSearchListElementComponent,
 ];

+const COMPONENTS = [
+  NameVariantModalComponent,
+  PersonInputSuggestionsComponent,
+  ...ENTRY_COMPONENTS
+];
+
@NgModule({
  imports: [
    CommonModule,
@@ -67,5 +72,14 @@ const COMPONENTS = [
  ]
 })
 export class ResearchEntitiesModule {
-
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: ResearchEntitiesModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
 }
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -437,11 +437,9 @@ const COMPONENTS = [
  SearchResultGridElementComponent,
  ItemListElementComponent,
  ItemGridElementComponent,
-  ItemSearchResultListElementComponent,
  ItemSearchResultGridElementComponent,
  BrowseEntryListElementComponent,
  SearchResultDetailElementComponent,
-  BrowseEntryListElementComponent,
  PlainTextMetadataListElementComponent,
  ItemMetadataListElementComponent,
  MetadataRepresentationListElementComponent,
@@ -458,6 +456,59 @@ const COMPONENTS = [
  CommunitySidebarSearchListElementComponent,
 ];

+const ENTRY_COMPONENTS = [
+  // put only entry components that use custom decorator
+  CollectionListElementComponent,
+  CommunityListElementComponent,
+  SearchResultListElementComponent,
+  CommunitySearchResultListElementComponent,
+  CollectionSearchResultListElementComponent,
+  CollectionGridElementComponent,
+  CommunityGridElementComponent,
+  CommunitySearchResultGridElementComponent,
+  CollectionSearchResultGridElementComponent,
+  SearchResultGridElementComponent,
+  ItemListElementComponent,
+  ItemGridElementComponent,
+  ItemSearchResultListElementComponent,
+  ItemSearchResultGridElementComponent,
+  BrowseEntryListElementComponent,
+  SearchResultDetailElementComponent,
+  StartsWithDateComponent,
+  StartsWithTextComponent,
+  CreateCommunityParentSelectorComponent,
+  CreateCollectionParentSelectorComponent,
+  CreateItemParentSelectorComponent,
+  EditCommunitySelectorComponent,
+  EditCollectionSelectorComponent,
+  EditItemSelectorComponent,
+  PlainTextMetadataListElementComponent,
+  ItemMetadataListElementComponent,
+  MetadataRepresentationListElementComponent,
+  CustomSwitchComponent,
+  ItemMetadataRepresentationListElementComponent,
+  SearchResultsComponent,
+  SearchFacetFilterComponent,
+  SearchRangeFilterComponent,
+  SearchTextFilterComponent,
+  SearchHierarchyFilterComponent,
+  SearchBooleanFilterComponent,
+  SearchFacetOptionComponent,
+  SearchFacetSelectedOptionComponent,
+  SearchFacetRangeOptionComponent,
+  SearchAuthorityFilterComponent,
+  LogInPasswordComponent,
+  LogInShibbolethComponent,
+  BundleListElementComponent,
+  ClaimedTaskActionsApproveComponent,
+  ClaimedTaskActionsRejectComponent,
+  ClaimedTaskActionsReturnToPoolComponent,
+  ClaimedTaskActionsEditMetadataComponent,
+  PublicationSidebarSearchListElementComponent,
+  CollectionSidebarSearchListElementComponent,
+  CommunitySidebarSearchListElementComponent
+];
+
 const SHARED_SEARCH_PAGE_COMPONENTS = [
  ConfigurationSearchPageComponent
 ];
@@ -536,5 +587,14 @@ const DIRECTIVES = [
 * This module handles all components and pipes that need to be shared among multiple other modules
 */
 export class SharedModule {
-
+  /**
+   * NOTE: this method allows to resolve issue with components that using a custom decorator
+   * which are not loaded during CSR otherwise
+   */
+  static withEntryComponents() {
+    return {
+      ngModule: SharedModule,
+      providers: ENTRY_COMPONENTS.map((component) => ({provide: component}))
+    };
+  }
 }
--- a/src/modules/app/browser-app.module.ts
+++ b/src/modules/app/browser-app.module.ts
@@ -2,13 +2,13 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { NgModule } from '@angular/core';
 import { BrowserModule, makeStateKey, TransferState } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { RouterModule } from '@angular/router';
+import { NoPreloading, RouterModule } from '@angular/router';
 import { REQUEST } from '@nguniversal/express-engine/tokens';

 import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { TranslateJson5HttpLoader } from '../../ngx-translate-loaders/translate-json5-http.loader';

-import { IdlePreload, IdlePreloadModule } from 'angular-idle-preload';
+import { IdlePreloadModule } from 'angular-idle-preload';

 import { AppComponent } from '../../app/app.component';

@@ -26,7 +26,8 @@ import { KlaroService } from '../../app/shared/cookies/klaro.service';
 import { HardRedirectService } from '../../app/core/services/hard-redirect.service';
 import {
  BrowserHardRedirectService,
-  LocationToken, locationProvider
+  locationProvider,
+  LocationToken
 } from '../../app/core/services/browser-hard-redirect.service';

 export const REQ_KEY = makeStateKey<string>('req');
@@ -52,8 +53,7 @@ export function getRequest(transferState: TransferState): any {
      // enableTracing: true,
      useHash: false,
      scrollPositionRestoration: 'enabled',
-      preloadingStrategy:
-      IdlePreload
+      preloadingStrategy: NoPreloading
    }),
    StatisticsModule.forRoot(),
    Angulartics2RouterlessModule.forRoot(),