Only return books in searches; Add CTA if no search results

This commit is contained in:
Robbie Antenesse 2019-09-16 13:09:40 -06:00
parent 8a4d68b026
commit 4a5dbd4091
2 changed files with 11 additions and 52 deletions

View File

@ -33,6 +33,8 @@
"header": "Search", "header": "Search",
"loading": "Loading...", "loading": "Loading...",
"results_header": "Results for:", "results_header": "Results for:",
"no_results": "None Found",
"no_results_suggestion": "If you're expecting book data, go and help fill out the Inventaire database!",
"people_header": "People", "people_header": "People",
"series_header": "Series", "series_header": "Series",
"books_header": "Books", "books_header": "Books",

View File

@ -19,7 +19,6 @@ export const searchView = (state, emit, i18n) => {
return [ return [
html`<section> html`<section>
<h1 class="title">${__('search.header')}</h1> <h1 class="title">${__('search.header')}</h1>
<article> <article>
<h2> <h2>
@ -30,10 +29,13 @@ export const searchView = (state, emit, i18n) => {
</h2> </h2>
${!controller.doneSearching || controller.results.works < 1 ${!controller.doneSearching || controller.results.works < 1
? null ? [
: [ html`<h3>${__('search.no_results')}</h3>`,
html`<h2>${__('search.books_header')}</h2>`, html`<a class="button" href="https://wiki.inventaire.io/wiki/How-to-contribute" target="_blank">
controller.results.works.map(result => { ${__('search.no_results_suggestion')}
</a>`
]
: controller.results.works.map(result => {
return html`<div class="flex search-result"> return html`<div class="flex search-result">
<div class="two-third-800 half-500"> <div class="two-third-800 half-500">
<h3 class="title">${result.name}</h3> <h3 class="title">${result.name}</h3>
@ -43,53 +45,8 @@ export const searchView = (state, emit, i18n) => {
${resultDetails(controller, result, emit)} ${resultDetails(controller, result, emit)}
</div> </div>
</div>`; </div>`;
}), })
]} }
${controller.results.series.length < 1
? null
: [
html`<h2>${__('search.series_header')}</h2>`,
controller.results.series.map(result => {
return html`<div class="flex search-result">
<div class="two-third-800 half-500">
<h3 class="title">${result.name}</h3>
${result.description ? html`<h4 class="subtitle">${result.description}</h4>` : null}
</div>
<div class="third-800 half-500">
<span class="tooltip-left" data-tooltip=${__('search.see_details_tooltip')}>
<a class="small pseudo button" href=${result.link} target="_blank">
${__('search.see_inventaire_details')}
</a>
</span>
</div>
</div>`;
}),
]}
${controller.results.humans.length < 1
? null
: [
html`<h2>${__('search.people_header')}</h2>`,
controller.results.humans.map(result => {
return html`<div class="flex search-result">
<div class="sixth">
${result.image ? html`<img src=${result.image.url} class="search-image">` : null}
</div>
<div class="half-800 two-third">
<h3 class="title">${result.name}</h3>
${result.description ? html`<h4 class="subtitle">${result.description}</h4>` : null}
</div>
<div class="third-800">
<span class="tooltip-left" data-tooltip=${__('search.see_details_tooltip')}>
<a class="small pseudo button" href=${result.link} target="_blank">
${__('search.see_inventaire_details')}
</a>
</span>
</div>
</div>`;
}),
]}
</article> </article>
</section>`, </section>`,
]; ];