1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-12-02 05:57:29 +01:00

Remove price from queries (#600)

* subgraph query added

* return ddo list

* price queries removed from sorting and filtering

* subgraph query added


return ddo list


price queries removed from sorting and filtering

* subgraph query removed

* removed unused subgraph query

* undo subgraph fetchData change

* linting errors fixed

* files renamed, priceType removed

* removed unused imports and vars

* removed all price filter variables

Co-authored-by: claudia.holhos <claudia.holhos@hpm.ro>
This commit is contained in:
claudiaHash 2021-05-17 16:14:40 +03:00 committed by GitHub
parent 48cb9b1840
commit 82acbba5ce
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 119 additions and 264 deletions

View File

@ -1,188 +0,0 @@
import React, { ReactElement, useEffect, useState } from 'react'
import { useNavigate } from '@reach/router'
import styles from './filterPrice.module.css'
import classNames from 'classnames/bind'
import {
addExistingParamsToUrl,
FilterByPriceOptions,
FilterByTypeOptions
} from './utils'
import Button from '../../atoms/Button'
const cx = classNames.bind(styles)
const clearFilters = [{ display: 'Clear', value: '' }]
const priceFilterItems = [
{ display: 'fixed price', value: FilterByPriceOptions.Fixed },
{ display: 'dynamic price', value: FilterByPriceOptions.Dynamic }
]
const serviceFilterItems = [
{ display: 'data sets', value: FilterByTypeOptions.Data },
{ display: 'algorithms', value: FilterByTypeOptions.Algorithm }
]
export default function FilterPrice({
priceType,
serviceType,
setPriceType,
setServiceType
}: {
priceType: string
setPriceType: React.Dispatch<React.SetStateAction<string>>
serviceType: string
setServiceType: React.Dispatch<React.SetStateAction<string>>
}): ReactElement {
const navigate = useNavigate()
const [priceSelections, setPriceSelections] = useState<string[]>([])
const [serviceSelections, setServiceSelections] = useState<string[]>([])
async function applyPriceFilter(filterBy: string) {
let urlLocation = await addExistingParamsToUrl(location, 'priceType')
if (filterBy) {
urlLocation = `${urlLocation}&priceType=${filterBy}`
}
setPriceType(filterBy)
navigate(urlLocation)
}
async function applyServiceFilter(filterBy: string) {
let urlLocation = await addExistingParamsToUrl(location, 'serviceType')
if (filterBy && location.search.indexOf('&serviceType') === -1) {
urlLocation = `${urlLocation}&serviceType=${filterBy}`
}
setServiceType(filterBy)
navigate(urlLocation)
}
async function handleSelectedFilter(isSelected: boolean, value: string) {
if (
value === FilterByPriceOptions.Fixed ||
value === FilterByPriceOptions.Dynamic
) {
if (isSelected) {
if (priceSelections.length > 1) {
// both selected -> select the other one
const otherValue = priceFilterItems.find((p) => p.value !== value)
.value
await applyPriceFilter(otherValue)
} else {
// only the current one selected -> deselect it
await applyPriceFilter(undefined)
}
} else {
if (priceSelections.length > 0) {
// one already selected -> both selected
await applyPriceFilter(FilterByPriceOptions.All)
setPriceSelections(priceFilterItems.map((p) => p.value))
} else {
// none selected -> select
await applyPriceFilter(value)
setPriceSelections([value])
}
}
} else {
if (isSelected) {
if (serviceSelections.length > 1) {
const otherValue = serviceFilterItems.find((p) => p.value !== value)
.value
await applyServiceFilter(otherValue)
setServiceSelections([otherValue])
} else {
await applyServiceFilter(undefined)
}
} else {
if (serviceSelections.length) {
await applyServiceFilter(undefined)
setServiceSelections(serviceFilterItems.map((p) => p.value))
} else {
await applyServiceFilter(value)
setServiceSelections([value])
}
}
}
}
async function applyClearFilter() {
let urlLocation = await addExistingParamsToUrl(
location,
'priceType',
'serviceType'
)
urlLocation = `${urlLocation}`
setServiceSelections([])
setPriceSelections([])
setPriceType(undefined)
setServiceType(undefined)
navigate(urlLocation)
}
return (
<div className={styles.filterList}>
{priceFilterItems.map((e, index) => {
const isPriceSelected =
e.value === priceType || priceSelections.includes(e.value)
const selectFilter = cx({
[styles.selected]: isPriceSelected,
[styles.filter]: true
})
return (
<Button
size="small"
style="text"
key={index}
className={selectFilter}
onClick={async () => {
handleSelectedFilter(isPriceSelected, e.value)
}}
>
{e.display}
</Button>
)
})}
{serviceFilterItems.map((e, index) => {
const isServiceSelected =
e.value === serviceType || serviceSelections.includes(e.value)
const selectFilter = cx({
[styles.selected]: isServiceSelected,
[styles.filter]: true
})
return (
<Button
size="small"
style="text"
key={index}
className={selectFilter}
onClick={async () => {
handleSelectedFilter(isServiceSelected, e.value)
}}
>
{e.display}
</Button>
)
})}
{clearFilters.map((e, index) => {
const showClear =
priceSelections.length > 0 || serviceSelections.length > 0
return (
<Button
size="small"
style="text"
key={index}
className={showClear ? styles.showClear : styles.hideClear}
onClick={async () => {
applyClearFilter()
}}
>
{e.display}
</Button>
)
})}
</div>
)
}

View File

@ -0,0 +1,108 @@
import React, { ReactElement, useState } from 'react'
import { useNavigate } from '@reach/router'
import styles from './filterService.module.css'
import classNames from 'classnames/bind'
import { addExistingParamsToUrl, FilterByTypeOptions } from './utils'
import Button from '../../atoms/Button'
const cx = classNames.bind(styles)
const clearFilters = [{ display: 'Clear', value: '' }]
const serviceFilterItems = [
{ display: 'data sets', value: FilterByTypeOptions.Data },
{ display: 'algorithms', value: FilterByTypeOptions.Algorithm }
]
export default function FilterPrice({
serviceType,
setServiceType
}: {
serviceType: string
setServiceType: React.Dispatch<React.SetStateAction<string>>
}): ReactElement {
const navigate = useNavigate()
const [serviceSelections, setServiceSelections] = useState<string[]>([])
async function applyServiceFilter(filterBy: string) {
let urlLocation = await addExistingParamsToUrl(location, 'serviceType')
if (filterBy && location.search.indexOf('&serviceType') === -1) {
urlLocation = `${urlLocation}&serviceType=${filterBy}`
}
setServiceType(filterBy)
navigate(urlLocation)
}
async function handleSelectedFilter(isSelected: boolean, value: string) {
if (isSelected) {
if (serviceSelections.length > 1) {
const otherValue = serviceFilterItems.find((p) => p.value !== value)
.value
await applyServiceFilter(otherValue)
setServiceSelections([otherValue])
} else {
await applyServiceFilter(undefined)
}
} else {
if (serviceSelections.length) {
await applyServiceFilter(undefined)
setServiceSelections(serviceFilterItems.map((p) => p.value))
} else {
await applyServiceFilter(value)
setServiceSelections([value])
}
}
}
async function applyClearFilter() {
let urlLocation = await addExistingParamsToUrl(location, 'serviceType')
urlLocation = `${urlLocation}`
setServiceSelections([])
setServiceType(undefined)
navigate(urlLocation)
}
return (
<div className={styles.filterList}>
{serviceFilterItems.map((e, index) => {
const isServiceSelected =
e.value === serviceType || serviceSelections.includes(e.value)
const selectFilter = cx({
[styles.selected]: isServiceSelected,
[styles.filter]: true
})
return (
<Button
size="small"
style="text"
key={index}
className={selectFilter}
onClick={async () => {
handleSelectedFilter(isServiceSelected, e.value)
}}
>
{e.display}
</Button>
)
})}
{clearFilters.map((e, index) => {
const showClear = serviceSelections.length > 0
return (
<Button
size="small"
style="text"
key={index}
className={showClear ? styles.showClear : styles.hideClear}
onClick={async () => {
applyClearFilter()
}}
>
{e.display}
</Button>
)
})}
</div>
)
}

View File

@ -4,7 +4,7 @@ import SearchBar from '../../molecules/SearchBar'
import AssetList from '../../organisms/AssetList'
import styles from './index.module.css'
import queryString from 'query-string'
import PriceFilter from './filterPrice'
import ServiceFilter from './filterService'
import Sort from './sort'
import { getResults } from './utils'
import { navigate } from 'gatsby'
@ -21,19 +21,9 @@ export default function SearchPage({
}): ReactElement {
const { config } = useOcean()
const parsed = queryString.parse(location.search)
const {
text,
owner,
tags,
page,
sort,
sortOrder,
priceType,
serviceType
} = parsed
const { text, owner, tags, page, sort, sortOrder, serviceType } = parsed
const [queryResult, setQueryResult] = useState<QueryResult>()
const [loading, setLoading] = useState<boolean>()
const [price, setPriceType] = useState<string>(priceType as string)
const [service, setServiceType] = useState<string>(serviceType as string)
const [sortType, setSortType] = useState<string>(sort as string)
const [sortDirection, setSortDirection] = useState<string>(
@ -58,7 +48,6 @@ export default function SearchPage({
tags,
sort,
page,
priceType,
serviceType,
sortOrder,
config.metadataCacheUri
@ -80,10 +69,8 @@ export default function SearchPage({
<SearchBar initialValue={(text || owner) as string} />
)}
<div className={styles.row}>
<PriceFilter
priceType={price}
<ServiceFilter
serviceType={service}
setPriceType={setPriceType}
setServiceType={setServiceType}
/>
<Sort
@ -91,8 +78,6 @@ export default function SearchPage({
sortDirection={sortDirection}
setSortType={setSortType}
setSortDirection={setSortDirection}
setPriceType={setPriceType}
setServiceType={setServiceType}
/>
</div>
</div>

View File

@ -3,9 +3,7 @@ import { useNavigate } from '@reach/router'
import {
addExistingParamsToUrl,
SortTermOptions,
SortValueOptions,
FilterByPriceOptions,
FilterByTypeOptions
SortValueOptions
} from './utils'
import Button from '../../atoms/Button'
import styles from './sort.module.css'
@ -13,26 +11,18 @@ import classNames from 'classnames/bind'
const cx = classNames.bind(styles)
const sortItems = [
{ display: 'Published', value: SortTermOptions.Created },
{ display: 'Liquidity', value: SortTermOptions.Liquidity },
{ display: 'Price', value: SortTermOptions.Price }
]
const sortItems = [{ display: 'Published', value: SortTermOptions.Created }]
export default function Sort({
sortType,
setSortType,
sortDirection,
setSortDirection,
setPriceType,
setServiceType
setSortDirection
}: {
sortType: string
setSortType: React.Dispatch<React.SetStateAction<string>>
sortDirection: string
setSortDirection: React.Dispatch<React.SetStateAction<string>>
setPriceType: React.Dispatch<React.SetStateAction<string>>
setServiceType: React.Dispatch<React.SetStateAction<string>>
}): ReactElement {
const navigate = useNavigate()
const directionArrow = String.fromCharCode(
@ -41,12 +31,7 @@ export default function Sort({
async function sortResults(sortBy?: string, direction?: string) {
let urlLocation: string
if (sortBy) {
urlLocation = await addExistingParamsToUrl(location, 'sort', 'priceType')
urlLocation = `${urlLocation}&sort=${sortBy}`
if (sortBy === SortTermOptions.Liquidity) {
urlLocation = `${urlLocation}&priceType=${FilterByPriceOptions.Dynamic}`
setPriceType(FilterByPriceOptions.Dynamic)
}
setSortType(sortBy)
} else if (direction) {
urlLocation = await addExistingParamsToUrl(location, 'sortOrder')

View File

@ -6,8 +6,6 @@ import { MetadataCache, Logger } from '@oceanprotocol/lib'
import queryString from 'query-string'
export const SortTermOptions = {
Liquidity: 'liquidity',
Price: 'price',
Created: 'created'
} as const
type SortTermOptions = typeof SortTermOptions[keyof typeof SortTermOptions]
@ -25,36 +23,12 @@ export const SortValueOptions = {
} as const
type SortValueOptions = typeof SortValueOptions[keyof typeof SortValueOptions]
export const FilterByPriceOptions = {
Fixed: 'exchange',
Dynamic: 'pool',
All: 'all'
} as const
type FilterByPriceOptions = typeof FilterByPriceOptions[keyof typeof FilterByPriceOptions]
export const FilterByTypeOptions = {
Data: 'dataset',
Algorithm: 'algorithm'
} as const
type FilterByTypeOptions = typeof FilterByTypeOptions[keyof typeof FilterByTypeOptions]
function addPriceFilterToQuery(sortTerm: string, priceFilter: string): string {
if (priceFilter === FilterByPriceOptions.All) {
sortTerm = priceFilter
? sortTerm === ''
? `(price.type:${FilterByPriceOptions.Fixed} OR price.type:${FilterByPriceOptions.Dynamic})`
: `${sortTerm} AND (price.type:${FilterByPriceOptions.Dynamic} OR price.type:${FilterByPriceOptions.Fixed})`
: sortTerm
} else {
sortTerm = priceFilter
? sortTerm === ''
? `price.type:${priceFilter}`
: `${sortTerm} AND price.type:${priceFilter}`
: sortTerm
}
return sortTerm
}
function addTypeFilterToQuery(sortTerm: string, typeFilter: string): string {
sortTerm = typeFilter
? sortTerm === ''
@ -64,13 +38,8 @@ function addTypeFilterToQuery(sortTerm: string, typeFilter: string): string {
return sortTerm
}
function getSortType(sortParam: string): string {
const sortTerm =
sortParam === SortTermOptions.Liquidity
? SortElasticTerm.Liquidity
: sortParam === SortTermOptions.Price
? SortElasticTerm.Price
: SortTermOptions.Created
function getSortType(): string {
const sortTerm = SortTermOptions.Created
return sortTerm
}
@ -83,10 +52,9 @@ export function getSearchQuery(
offset?: string,
sort?: string,
sortOrder?: string,
priceType?: string,
serviceType?: string
): SearchQuery {
const sortTerm = getSortType(sort)
const sortTerm = getSortType()
const sortValue = sortOrder === SortValueOptions.Ascending ? 1 : -1
let searchTerm = owner
? `(publicKey.owner:${owner})`
@ -98,7 +66,6 @@ export function getSearchQuery(
`(service.attributes.additionalInformation.categories:\"${categories}\")`
: text || ''
searchTerm = addTypeFilterToQuery(searchTerm, serviceType)
searchTerm = addPriceFilterToQuery(searchTerm, priceType)
return {
page: Number(page) || 1,
@ -136,7 +103,6 @@ export async function getResults(
offset?: string
sort?: string
sortOrder?: string
priceType?: string
serviceType?: string
},
metadataCacheUri: string
@ -150,10 +116,10 @@ export async function getResults(
categories,
sort,
sortOrder,
priceType,
serviceType
} = params
const metadataCache = new MetadataCache(metadataCacheUri, Logger)
const searchQuery = getSearchQuery(
text,
owner,
@ -163,11 +129,10 @@ export async function getResults(
offset,
sort,
sortOrder,
priceType,
serviceType
)
const queryResult = await metadataCache.queryMetadata(searchQuery)
const queryResult = await metadataCache.queryMetadata(searchQuery)
return queryResult
}