oceanprotocol/commons
1
0
Fork 0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00
Code Releases Activity

search partially working

Browse Source
This commit is contained in:
Jernej Pregelj 2019-08-05 16:47:41 +02:00 committed by Matthias Kretschmann
parent bd27ed37b1
commit 6fb5c922c1
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 23 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/routes/Search/Filters.tsx
View File

@ -34,7 +34,7 @@ const filters = [
{ label: labelLicense, items: optionsLicense } { label: labelLicense, items: optionsLicense }
] ]
export default class Sidebar extends PureComponent<{ export default class Filters extends PureComponent<{
category: string category: string
license: string license: string
setCategory(category: string): void setCategory(category: string): void
@ -81,9 +81,9 @@ export default class Sidebar extends PureComponent<{
className={styles.cancel} className={styles.cancel}
title="Clear" title="Clear"
onClick={() => onClick={() =>
alert( filter.label === 'Category'
'TODO: Implement clearing' ? setCategory('')
) : setLicense('')
} }
> >
&times; &times;

7
client/src/routes/Search/Sidebar.tsx
View File

@ -4,7 +4,7 @@ import Filters from './Filters'
import styles from './Sidebar.module.scss' import styles from './Sidebar.module.scss'
export default function Sidebar({ export default function Sidebar({
searchInput, search,
inputChange, inputChange,
category, category,
license, license,
@ -12,7 +12,6 @@ export default function Sidebar({
setLicense setLicense
}: { }: {
search: string search: string
searchInput: string
inputChange: any inputChange: any
category: string category: string
license: string license: string
@ -23,10 +22,10 @@ export default function Sidebar({
<aside className={styles.sidebar}> <aside className={styles.sidebar}>
<Input <Input
type="search" type="search"
name="searchInput" name="search"
label="Search" label="Search"
placeholder="e.g. shapes of plants" placeholder="e.g. shapes of plants"
value={searchInput} value={search}
onChange={inputChange} onChange={inputChange}
// group={ // group={
// <Button primary onClick={search}> // <Button primary onClick={search}>

32
client/src/routes/Search/index.tsx
View File

@ -26,7 +26,6 @@ interface SearchState {
currentPage: number currentPage: number
isLoading: boolean isLoading: boolean
search: string search: string
searchInput: string
category: string category: string
license: string license: string
} }
@ -42,7 +41,6 @@ class Search extends PureComponent<SearchProps, SearchState> {
currentPage: 1, currentPage: 1,
isLoading: true, isLoading: true,
search: '', search: '',
searchInput: '',
category: '', category: '',
license: '' license: ''
} }
@ -68,27 +66,33 @@ class Search extends PureComponent<SearchProps, SearchState> {
this.setState(update, () => this.searchAssets()) this.setState(update, () => this.searchAssets())
} }
// public componentDidUpdate(prevProps: any, prevState: any) {
// if (prevState.category !== this.state.category) {
// this.searchAssets()
// }
// }
private searchAssets = async () => { private searchAssets = async () => {
const { ocean } = this.context const { ocean } = this.context
const { offset, currentPage, search, category, license } = this.state const { offset, currentPage, search, category, license } = this.state
let urlString = '?'
const queryValues: any = {} const queryValues: any = {}
if (search) { if (search) {
queryValues.text = [search] queryValues.text = [search]
urlString += `text=${search}&`
} }
if (category) { if (category) {
queryValues.categories = [category] queryValues.categories = [category]
urlString += `categories=${category}&`
} }
if (license) { if (license) {
queryValues.license = [license] queryValues.license = [license]
urlString += `license=${license}&`
} }
if (currentPage !== 1) {
urlString += `page=${currentPage}&`
}
// update url
this.props.history.push({
pathname: this.props.location.pathname,
search: urlString
})
const searchQuery = { const searchQuery = {
offset, offset,
@ -119,11 +123,6 @@ class Search extends PureComponent<SearchProps, SearchState> {
// react-pagination starts counting at 0, we start at 1 // react-pagination starts counting at 0, we start at 1
const toPage = data.selected + 1 const toPage = data.selected + 1
this.props.history.push({
pathname: this.props.location.pathname,
search: `?text=${this.state.search}&page=${toPage}`
})
this.setState({ currentPage: toPage, isLoading: true }, () => this.setState({ currentPage: toPage, isLoading: true }, () =>
this.searchAssets() this.searchAssets()
) )
@ -134,7 +133,9 @@ class Search extends PureComponent<SearchProps, SearchState> {
) => { ) => {
this.setState({ this.setState({
[event.currentTarget.name]: event.currentTarget.value [event.currentTarget.name]: event.currentTarget.value
} as any) } as any, () => {
this.searchAssets()
})
} }
public setCategory = (category: string) => { public setCategory = (category: string) => {
@ -170,7 +171,6 @@ class Search extends PureComponent<SearchProps, SearchState> {
<div className={styles.content}> <div className={styles.content}>
<Sidebar <Sidebar
search={this.state.search} search={this.state.search}
searchInput={this.state.searchInput}
inputChange={this.inputChange} inputChange={this.inputChange}
category={this.state.category} category={this.state.category}
license={this.state.license} license={this.state.license}