Example on how to embed the search on the collection page

alexandrevryghem · Feb 6, 2024 · 683c279 · 683c279
1 parent 93b22cb
commit 683c279
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 18 deletions.
diff --git a/src/app/collection-page/collection-page.component.html b/src/app/collection-page/collection-page.component.html
@@ -45,24 +45,7 @@
                       [contentType]="collection.type">
               </ds-themed-comcol-page-browse-by>
 
-            <ng-container *ngVar="(itemRD$ | async) as itemRD">
-                <div class="mt-4" *ngIf="itemRD?.hasSucceeded" @fadeIn>
-                    <h3 class="sr-only">{{'collection.page.browse.recent.head' | translate}}</h3>
-                    <ds-viewable-collection
-                            [config]="paginationConfig"
-                            [sortConfig]="sortConfig"
-                            [objects]="itemRD"
-                            [hideGear]="true">
-                    </ds-viewable-collection>
-                </div>
-                <ds-error *ngIf="itemRD?.hasFailed"
-                          message="{{'error.recent-submissions' | translate}}"></ds-error>
-                <ds-themed-loading *ngIf="!itemRD || itemRD.isLoading"
-                            message="{{'loading.recent-submissions' | translate}}"></ds-themed-loading>
-                <div *ngIf="!itemRD?.isLoading && itemRD?.payload?.page.length === 0" class="alert alert-info w-100" role="alert">
-                        {{'collection.page.browse.recent.empty' | translate}}
-                </div>
-            </ng-container>
+            <ds-themed-search [showScopeSelector]="false" [scope]="collection.id"></ds-themed-search>
             </section>
             <footer *ngIf="collection.copyrightText" class="border-top my-5 pt-4">
           <!-- Copyright -->

diff --git a/src/app/collection-page/collection-page.component.ts b/src/app/collection-page/collection-page.component.ts
@@ -31,6 +31,8 @@ import { redirectOn4xx } from '../core/shared/authorized.operators';
 import { BROWSE_LINKS_TO_FOLLOW } from '../core/browse/browse.service';
 import { DSONameService } from '../core/breadcrumbs/dso-name.service';
 import { APP_CONFIG, AppConfig } from '../../../src/config/app-config.interface';
+import { SEARCH_CONFIG_SERVICE } from '../my-dspace-page/my-dspace-page.component';
+import { SearchConfigurationService } from '../core/shared/search/search-configuration.service';
 
 @Component({
   selector: 'ds-collection-page',
@@ -40,6 +42,12 @@ import { APP_CONFIG, AppConfig } from '../../../src/config/app-config.interface'
   animations: [
     fadeIn,
     fadeInOut
+  ],
+  providers: [
+    {
+      provide: SEARCH_CONFIG_SERVICE,
+      useClass: SearchConfigurationService
+    }
   ]
 })
 export class CollectionPageComponent implements OnInit {

diff --git a/src/app/collection-page/collection-page.module.ts b/src/app/collection-page/collection-page.module.ts
@@ -18,6 +18,7 @@ import { ThemedCollectionPageComponent } from './themed-collection-page.componen
 import { ComcolModule } from '../shared/comcol/comcol.module';
 import { DsoSharedModule } from '../dso-shared/dso-shared.module';
 import { DsoPageModule } from '../shared/dso-page/dso-page.module';
+import { SearchModule } from '../shared/search/search.module';
 
 @NgModule({
   imports: [
@@ -30,6 +31,7 @@ import { DsoPageModule } from '../shared/dso-page/dso-page.module';
     ComcolModule,
     DsoSharedModule,
     DsoPageModule,
+    SearchModule,
   ],
   declarations: [
     CollectionPageComponent,