diff --git a/apps/datahub/src/app/home/home-header/home-header.component.html b/apps/datahub/src/app/home/home-header/home-header.component.html
index ad5c13e1e8..f54e1905b4 100644
--- a/apps/datahub/src/app/home/home-header/home-header.component.html
+++ b/apps/datahub/src/app/home/home-header/home-header.component.html
@@ -17,6 +17,7 @@
diff --git a/libs/feature/search/src/lib/fuzzy-search/fuzzy-search.component.ts b/libs/feature/search/src/lib/fuzzy-search/fuzzy-search.component.ts
index 2e80a32aec..5177aad279 100644
--- a/libs/feature/search/src/lib/fuzzy-search/fuzzy-search.component.ts
+++ b/libs/feature/search/src/lib/fuzzy-search/fuzzy-search.component.ts
@@ -2,6 +2,7 @@ import {
ChangeDetectionStrategy,
Component,
EventEmitter,
+ Input,
OnInit,
Output,
ViewChild,
@@ -25,6 +26,7 @@ import { RecordsRepositoryInterface } from '@geonetwork-ui/common/domain/records
})
export class FuzzySearchComponent implements OnInit {
@ViewChild(AutocompleteComponent) autocomplete: AutocompleteComponent
+ @Input() autoFocus = false
@Output() itemSelected = new EventEmitter()
@Output() inputSubmitted = new EventEmitter()
searchInputValue$: Observable<{ title: string }>
diff --git a/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts b/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts
index 2442fe4c83..43730f25db 100644
--- a/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts
+++ b/libs/ui/inputs/src/lib/autocomplete/autocomplete.component.ts
@@ -1,6 +1,7 @@
import {
AfterViewInit,
ChangeDetectionStrategy,
+ ChangeDetectorRef,
Component,
ElementRef,
EventEmitter,
@@ -47,6 +48,7 @@ export class AutocompleteComponent
@Input() action: (value: string) => Observable
@Input() value?: AutocompleteItem
@Input() clearOnSelection = false
+ @Input() autoFocus = false
@Output() itemSelected = new EventEmitter()
@Output() inputSubmitted = new EventEmitter()
@Output() inputCleared = new EventEmitter()
@@ -65,6 +67,7 @@ export class AutocompleteComponent
@Input() displayWithFn: (AutocompleteItem) => string = (item) => item
+ constructor(private cdRef: ChangeDetectorRef) {}
ngOnChanges(changes: SimpleChanges): void {
const { value } = changes
if (value) {
@@ -110,6 +113,10 @@ export class AutocompleteComponent
ngAfterViewInit(): void {
this.autocomplete.optionSelected.subscribe(this.selectionSubject)
+ if (this.autoFocus) {
+ this.inputRef.nativeElement.focus()
+ this.cdRef.detectChanges()
+ }
}
ngOnDestroy(): void {