diff --git a/Resources/public/scss/modules/universal-discovery/_bookmarks.scss b/Resources/public/scss/modules/universal-discovery/_bookmarks.scss index c0c358ef..58bf68ad 100644 --- a/Resources/public/scss/modules/universal-discovery/_bookmarks.scss +++ b/Resources/public/scss/modules/universal-discovery/_bookmarks.scss @@ -7,7 +7,7 @@ padding-top: calculateRem(15px); padding-left: calculateRem(20px); font-size: calculateRem(25px); - color: #a6a6a6; + color: $ez-color-base-light; } &__loading-spinner { diff --git a/Resources/public/scss/modules/universal-discovery/_finder.scss b/Resources/public/scss/modules/universal-discovery/_finder.scss index e796b4bf..01eb919b 100644 --- a/Resources/public/scss/modules/universal-discovery/_finder.scss +++ b/Resources/public/scss/modules/universal-discovery/_finder.scss @@ -8,4 +8,11 @@ margin-left: calculateRem(16px); } } + + &__no-content-info { + padding-top: calculateRem(39px); + padding-left: calculateRem(36px); + font-size: calculateRem(25px); + color: $ez-color-base-light; + } } diff --git a/Resources/translations/search.en.xliff b/Resources/translations/search.en.xliff new file mode 100644 index 00000000..ee371f0d --- /dev/null +++ b/Resources/translations/search.en.xliff @@ -0,0 +1,41 @@ + + + +
+ + The source node in most cases contains the sample message as written by the developer. If it looks like a dot-delimitted string such as "form.label.firstname", then the developer has not provided a default message. +
+ + + Sorry, no results were found for "%query%". + Sorry, no results were found for "%query%". + key: search.no_result + + + Check spelling of keywords. + Check spelling of keywords. + key: search.tips.check_spelling + + + Try different keywords. + Try different keywords. + key: search.tips.different_keywords + + + Try fewer keywords. Reducing keywords result in more matches. + Try fewer keywords. Reducing keywords result in more matches. + key: search.tips.fewer_keywords + + + Some helpful search tips: + Some helpful search tips: + key: search.tips.headline + + + Try more general keywords. + Try more general keywords. + key: search.tips.more_general_keywords + + + + diff --git a/Resources/translations/universal_discovery_widget.en.xliff b/Resources/translations/universal_discovery_widget.en.xliff index 55f2caa5..9c67f088 100644 --- a/Resources/translations/universal_discovery_widget.en.xliff +++ b/Resources/translations/universal_discovery_widget.en.xliff @@ -136,6 +136,11 @@ Load more key: finder.branch.load_more.label + + No content items. + No content items. + key: finder.no_content.message + First First diff --git a/src/modules/universal-discovery/components/finder/finder.component.js b/src/modules/universal-discovery/components/finder/finder.component.js index 9ddc3a23..f9260a98 100644 --- a/src/modules/universal-discovery/components/finder/finder.component.js +++ b/src/modules/universal-discovery/components/finder/finder.component.js @@ -24,6 +24,8 @@ export default class FinderComponent extends Component { this.loadBranchLeaves = this.loadBranchLeaves.bind(this); this.onLoadMore = this.onLoadMore.bind(this); this.renderBranch = this.renderBranch.bind(this); + this.renderActiveLocations = this.renderActiveLocations.bind(this); + this.renderBranches = this.renderBranches.bind(this); this.setBranchContainerRef = this.setBranchContainerRef.bind(this); this.setPreselectedState = this.getPreselectedState.bind(this); @@ -450,6 +452,53 @@ export default class FinderComponent extends Component { ); } + renderActiveLocations() { + const { activeLocations, locationsMap } = this.state; + + return activeLocations.map((location, index) => { + const locationId = location ? location.id : this.props.startingLocationId; + const branchActiveLocation = activeLocations[index + 1]; + const branchActiveLocationId = branchActiveLocation ? branchActiveLocation.id : null; + const isBranchActiveLocationLoading = branchActiveLocationId && !locationsMap[branchActiveLocationId]; + const locationData = locationsMap[locationId]; + + return this.renderBranch(locationData, branchActiveLocationId, isBranchActiveLocationLoading); + }); + } + + renderEmptyContent() { + const noContentMessage = Translator.trans( + /*@Desc("No content items.")*/ 'finder.no_content.message', + {}, + 'universal_discovery_widget' + ); + + return
{noContentMessage}
; + } + + renderBranches() { + const { activeLocations } = this.state; + const branches = [ + this.renderStartingLocationBranch(), + ...this.renderActiveLocations(), + ]; + const hasActiveLocations = activeLocations.some((location) => location); + const hasNonEmptyBranches = branches.every((branch) => !branch); + + if (hasActiveLocations && hasNonEmptyBranches) { + const noContentMessage = Translator.trans( + /*@Desc("No content items.")*/ 'finder.no_content.message', + {}, + 'universal_discovery_widget' + ); + + return
{noContentMessage}
; + } + + return branches; + + } + setBranchContainerRef(ref) { this._refBranchesContainer = ref; } @@ -461,21 +510,10 @@ export default class FinderComponent extends Component { return null; } - const { locationsMap } = this.state; - return (
- {this.renderStartingLocationBranch()} - {activeLocations.map((location, index) => { - const locationId = location ? location.id : this.props.startingLocationId; - const branchActiveLocation = activeLocations[index + 1]; - const branchActiveLocationId = branchActiveLocation ? branchActiveLocation.id : null; - const isBranchActiveLocationLoading = branchActiveLocationId && !locationsMap[branchActiveLocationId]; - const locationData = locationsMap[locationId]; - - return this.renderBranch(locationData, branchActiveLocationId, isBranchActiveLocationLoading); - })} + {this.renderBranches()}
);