feat(lang): add ability to choose language in search route

This commit is contained in:
zyachel 2023-01-07 23:40:29 +05:30
parent 8820f36af8
commit cca6f69ded

View file

@ -15,6 +15,10 @@ include ../mixins/_metadata
//-//////////////////////////////////////////////////////
block content
main#main(class=`main search ${data ? '' :'search--no-results'}`)
-
const typesArr = [{key: 'question', text: 'Questions'}, {key: 'answer', text: 'Answers'}, {key: 'post', text: 'Posts'}, {key: 'profile', text: 'Profiles'}, {key: 'topic', text: 'Topics'}, {key: 'tribe', text: 'Spaces'}]
const timesArr = [{key: 'hour', text: 'Hour'}, {key: 'day', text: 'Day'}, {key: 'week', text: 'Week'}, {key: 'month', text: 'Month'}, {key: 'year', text: 'Year'}]
const languagesArr = ['en','es','fr','de','it','ja','id','pt','hi','nl','da','fi','nb','sv','mr','bn','ta','ar','he','gu','kn','ml','te','po'];
form.search__form.search-form(action="/search", method='get', autocomplete='off', name='search')
.search-form__search-container
@ -23,48 +27,24 @@ block content
button.search-form__button.search-form__button--submit(type="submit", aria-label='search'): svg.icon: use(href='/misc/sprite.svg#icon-search')
.search-form__filters-container.search-form__filters-container--type
p.search-form__filters-heading Filter by Type
//- .search-form__filters-group
input#type--all.search-form__radio.visually-hidden(type="radio", name="type", value='', checked)
label.search-form__label(for="type--all") All
.search-form__filters-group
input#type--question.search-form__radio.visually-hidden(type="radio", name="type", value='question')
label.search-form__label(for="type--question") Questions
.search-form__filters-group
input#type--answer.search-form__radio.visually-hidden(type="radio", name="type", value='answer' )
label.search-form__label(for="type--answer") Answers
.search-form__filters-group
input#type--post.search-form__radio.visually-hidden(type="radio", name="type", value='post')
label.search-form__label(for="type--post") Posts
.search-form__filters-group
input#type--profile.search-form__radio.visually-hidden(type="radio", name="type", value='profile')
label.search-form__label(for="type--profile") Profiles
.search-form__filters-group
input#type--topic.search-form__radio.visually-hidden(type="radio", name="type", value='topic')
label.search-form__label(for="type--topic") Topics
.search-form__filters-group
input#type--space.search-form__radio.visually-hidden(type="radio", name="type", value='tribe')
label.search-form__label(for="type--space") Spaces
each item in typesArr
.search-form__filters-group
input.search-form__radio.visually-hidden(type="radio", name="type", value=item.key, id=`type--${item.key}`)
label.search-form__label(for=`type--${item.key}`)= item.text
.search-form__filters-container.search-form__filters-container--time
p.search-form__filters-heading Filter by Time
//- .search-form__filters-group
input#time--all.search-form__radio.visually-hidden(type="radio", name='time', value='', checked)
label.search-form__label(for="time--all") All
.search-form__filters-group
input#time--hour.search-form__radio.visually-hidden(type="radio", name='time', value='hour')
label.search-form__label(for="time--hour") Hour
.search-form__filters-group
input#time--day.search-form__radio.visually-hidden(type="radio", name='time', value='day' )
label.search-form__label(for="time--day") Day
.search-form__filters-group
input#time--week.search-form__radio.visually-hidden(type="radio", name='time', value='week')
label.search-form__label(for="time--week") Week
.search-form__filters-group
input#time--month.search-form__radio.visually-hidden(type="radio", name='time', value='month')
label.search-form__label(for="time--month") Month
.search-form__filters-group
input#time--year.search-form__radio.visually-hidden(type="radio", name='time', value='year')
label.search-form__label(for="time--year") Year
each item in timesArr
.search-form__filters-group
input.search-form__radio.visually-hidden(type="radio", name='time', value=item.key, id=`time--${item.key}`)
label.search-form__label(for=`time--${item.key}`)= item.text
.search-form__filters-container.search-form__filters-container--lang
p.search-form__filters-heading Filter by Language
each lang in languagesArr
.search-form__filters-group
input.search-form__radio.visually-hidden(type="radio", name='lang', value=lang, id=`lang--${lang}`)
label.search-form__label(for=`lang--${lang}`)= lang.toUpperCase()
//- TODO: refactor 'profile', 'topic', and 'space' into resusable mixins.
- if (data?.results)