search-modal-fix
Some checks failed
deploy / test (push) Failing after 57s
deploy / deploy (push) Has been skipped

This commit is contained in:
Untone 2023-12-25 02:05:25 +03:00
parent bdb4f7a370
commit e402ff05be

View File

@ -1,41 +1,24 @@
import { clsx } from 'clsx' import { clsx } from 'clsx'
import { createEffect, createSignal } from 'solid-js'
import { useLocalize } from '../../../context/localize' import { useLocalize } from '../../../context/localize'
import { apiClient } from '../../../graphql/client/core'
import { SearchResult } from '../../../graphql/schema/core.gen'
import { Icon } from '../../_shared/Icon' import { Icon } from '../../_shared/Icon'
import styles from './SearchModal.module.scss' import styles from './SearchModal.module.scss'
export const SearchModal = () => { export const SearchModal = () => {
const { t } = useLocalize() const { t } = useLocalize()
const [searchResults, setSearchResults] = createSignal<Array<SearchResult>>([]) let qElement: HTMLInputElement | undefined
let msgElement: HTMLTextAreaElement | undefined const submitQuery = async (ev) => {
let contactElement: HTMLInputElement | undefined ev.preventDefault()
window.history.pushState({}, '', '/search?q=' + qElement.value)
const submit = async () => {
const results = await apiClient.getShoutsSearch({ text: msgElement.value })
if (results) setSearchResults(results)
} }
createEffect(() => {
if (searchResults()) {
// TODO: some showing logics
}
})
// TODO: useLocalize()
return ( return (
<form onSubmit={submit} class={styles.searchForm}> <form onSubmit={submitQuery} class={styles.searchForm}>
<input <input
type="text" type="text"
name="contact" name="q"
placeholder={t('Site search')} placeholder={t('Site search')}
ref={contactElement} ref={qElement}
class={styles.searchField} class={styles.searchField}
/> />
<button type="submit" class={styles.submitControl}> <button type="submit" class={styles.submitControl}>
@ -48,13 +31,13 @@ export const SearchModal = () => {
<ul class={clsx('view-switcher', styles.filterSwitcher)}> <ul class={clsx('view-switcher', styles.filterSwitcher)}>
<li class="view-switcher__item view-switcher__item--selected"> <li class="view-switcher__item view-switcher__item--selected">
<button type="button">Все</button> <button type="button">{t('All')}</button>
</li> </li>
<li class="view-switcher__item"> <li class="view-switcher__item">
<button type="button">Публикации</button> <button type="button">{t('Publications')}</button>
</li> </li>
<li class="view-switcher__item"> <li class="view-switcher__item">
<button type="button">Темы</button> <button type="button">{t('Topics')}</button>
</li> </li>
</ul> </ul>