From 3a72d670fdd8a9dd6c0c547d4b0dc62351e5bfde Mon Sep 17 00:00:00 2001 From: Matthias Kretschmann Date: Thu, 24 Sep 2020 12:23:40 +0200 Subject: [PATCH] remove unused methods/hooks/components --- .../molecules/SearchPriceFilter.module.css | 20 ------ .../molecules/SearchPriceFilter.tsx | 54 ---------------- src/components/templates/Search/index.tsx | 5 -- src/components/templates/Search/utils.ts | 30 ++------- src/hooks/useCategoriesQueryParams.tsx | 54 ---------------- src/hooks/usePriceQueryParams.tsx | 28 -------- src/utils/index.ts | 49 -------------- tests/unit/utils/index.test.ts | 64 +------------------ 8 files changed, 6 insertions(+), 298 deletions(-) delete mode 100644 src/components/molecules/SearchPriceFilter.module.css delete mode 100644 src/components/molecules/SearchPriceFilter.tsx delete mode 100644 src/hooks/useCategoriesQueryParams.tsx delete mode 100644 src/hooks/usePriceQueryParams.tsx diff --git a/src/components/molecules/SearchPriceFilter.module.css b/src/components/molecules/SearchPriceFilter.module.css deleted file mode 100644 index 1c1b94615..000000000 --- a/src/components/molecules/SearchPriceFilter.module.css +++ /dev/null @@ -1,20 +0,0 @@ -.layout { - display: flex; - flex-direction: column; - justify-content: space-between; -} - -.label { - margin-bottom: calc(var(--spacer) / 2); -} - -@media (max-width: 55rem) { - .layout { - flex-direction: row; - } - - .label { - flex-basis: auto; - width: calc(50% - var(--spacer) / 2); - } -} diff --git a/src/components/molecules/SearchPriceFilter.tsx b/src/components/molecules/SearchPriceFilter.tsx deleted file mode 100644 index 02d0b7069..000000000 --- a/src/components/molecules/SearchPriceFilter.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import React, { ChangeEvent, ReactElement } from 'react' -import SearchFilterSection from '../atoms/SearchFilterSection' -import usePriceQueryParams from '../../hooks/usePriceQueryParams' - -import styles from './SearchPriceFilter.module.css' -import Input from '../atoms/Input' - -export declare type PriceInputProps = { - label: string - value: string - onChange: (ev: ChangeEvent) => void - text: string -} - -export const PriceInput = ({ - label, - value, - onChange, - text -}: PriceInputProps): ReactElement => { - return ( - - ) -} - -export const SearchPriceFilter = () => { - const { min, setMin, max, setMax } = usePriceQueryParams() - - return ( - -
- setMin(ev.target.value)} - text="Min price" - /> - setMax(ev.target.value)} - text="Max price" - /> -
- - ) -} diff --git a/src/components/templates/Search/index.tsx b/src/components/templates/Search/index.tsx index e3c010686..e9cc39d51 100644 --- a/src/components/templates/Search/index.tsx +++ b/src/components/templates/Search/index.tsx @@ -2,7 +2,6 @@ import React, { ReactElement, useState, useEffect } from 'react' import { QueryResult } from '@oceanprotocol/lib/dist/node/metadatastore/MetadataStore' import SearchBar from '../../molecules/SearchBar' import AssetList from '../../organisms/AssetList' -import { SearchPriceFilter } from '../../molecules/SearchPriceFilter' import styles from './index.module.css' import queryString from 'query-string' import { getResults } from './utils' @@ -42,10 +41,6 @@ export default function SearchPage({ {text && } - {/* */} -
{loading ? : }
diff --git a/src/components/templates/Search/utils.ts b/src/components/templates/Search/utils.ts index b6b6f3721..28633b587 100644 --- a/src/components/templates/Search/utils.ts +++ b/src/components/templates/Search/utils.ts @@ -2,23 +2,20 @@ import { SearchQuery, QueryResult } from '@oceanprotocol/lib/dist/node/metadatastore/MetadataStore' -import { priceQueryParamToWei } from '../../../utils' import { MetadataStore, Logger } from '@oceanprotocol/lib' export function getSearchQuery( page?: string | string[], offset?: string | string[], text?: string | string[], - tag?: string | string[], - priceQuery?: [string | undefined, string | undefined] + tag?: string | string[] ): SearchQuery { return { page: Number(page) || 1, offset: Number(offset) || 20, query: { text, - tags: tag ? [tag] : undefined, - price: priceQuery + tags: tag ? [tag] : undefined }, sort: { created: -1 @@ -32,31 +29,14 @@ export function getSearchQuery( } export async function getResults( - params: any, + params: { text?: string; tag?: string; page?: string; offset?: string }, metadataStoreUri: string ): Promise { - const { text, tag, page, offset, minPrice, maxPrice } = params - - const minPriceParsed = priceQueryParamToWei( - minPrice as string, - 'Error parsing context.query.minPrice' - ) - const maxPriceParsed = priceQueryParamToWei( - maxPrice as string, - 'Error parsing context.query.maxPrice' - ) - const priceQuery = - minPriceParsed || maxPriceParsed - ? // sometimes TS gets a bit silly - ([minPriceParsed, maxPriceParsed] as [ - string | undefined, - string | undefined - ]) - : undefined + const { text, tag, page, offset } = params const metadataStore = new MetadataStore(metadataStoreUri, Logger) const queryResult = await metadataStore.queryMetadata( - getSearchQuery(page, offset, text, tag, priceQuery) + getSearchQuery(page, offset, text, tag) ) return queryResult diff --git a/src/hooks/useCategoriesQueryParams.tsx b/src/hooks/useCategoriesQueryParams.tsx deleted file mode 100644 index ffadd9225..000000000 --- a/src/hooks/useCategoriesQueryParams.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { useState, useEffect } from 'react' -import { setProperty, JSONparse } from '../utils' - -const CATEGORIES_QUERY_PARAM = 'categories' - -// Set selected categories if they are in the query param -const useGetCategoriesFromQueryParam = ( - allCategories: string[], - setSelectedCategories: (categories: string[]) => void -) => { - useEffect(() => { - if (router.query && router.query.categories) { - const parsedCategories = JSONparse( - router.query.categories as string, - 'Error parsing router.query.categories and setting parsedCategories' - ) - // Only set/accept elements that are actually in allCcategories - const categoriesFromUrl = (parsedCategories || []).filter((pc: string) => - allCategories.includes(pc) - ) - setSelectedCategories(categoriesFromUrl) - } - }, []) -} - -export default function useCategoriesQueryParam(allCategories: string[]) { - const [selectedCategories, setSelectedCategories] = useState([]) - useGetCategoriesFromQueryParam(allCategories, setSelectedCategories) - - // Update url and the state with the selected categories - const toggleCategory = (category: string) => { - const newSelectedCategories = selectedCategories.includes(category) - ? selectedCategories.filter((c) => c !== category) - : [...selectedCategories, category] - setSelectedCategories(newSelectedCategories) - - // If newSelectedCategories remove the search query param, else set it - const queryParamValue = - newSelectedCategories.length === 0 - ? undefined - : JSON.stringify(newSelectedCategories) - const query = Object.assign({}, router.query) - setProperty(query, CATEGORIES_QUERY_PARAM, queryParamValue) - router.push({ - pathname: router.pathname, - query: query - }) - } - - return { - selectedCategories, - toggleCategory - } -} diff --git a/src/hooks/usePriceQueryParams.tsx b/src/hooks/usePriceQueryParams.tsx deleted file mode 100644 index 27350a704..000000000 --- a/src/hooks/usePriceQueryParams.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { useEffect, useState } from 'react' -import { useLocation } from '@reach/router' -import queryString from 'query-string' - -export default function usePriceQueryParams() { - const location = useLocation() - - const [min, setMin] = useState( - (queryString.parse(location.search).minPrice as string) || '0' - ) - const [max, setMax] = useState( - (queryString.parse(location.search).maxPrice as string) || '0' - ) - - useEffect(() => { - if (parseFloat(max) < parseFloat(min)) { - setMax(min) - } - }, [min]) - - useEffect(() => { - if (parseFloat(min) > parseFloat(max)) { - setMin(max) - } - }, [max]) - - return { min, setMin, max, setMax } -} diff --git a/src/utils/index.ts b/src/utils/index.ts index 1b844823a..085776143 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,7 +1,6 @@ import axios, { AxiosResponse } from 'axios' import { toast } from 'react-toastify' import { File as FileMetadata } from '@oceanprotocol/lib' -import web3Utils from 'web3-utils' export function updateQueryStringParameter( uri: string, @@ -83,54 +82,6 @@ export function isDid(did: string | undefined): boolean { return !!didMatch } -export function JSONparse( - input: string | undefined, - errorMessage: string -): T | undefined { - if (input === undefined) { - return undefined - } - try { - return JSON.parse(input) as T - } catch (err) { - console.error(errorMessage) - } -} - -export function priceQueryParamToWei( - priceQueryParam: string | undefined, - errorMessage?: string -): string | undefined { - if (priceQueryParam === undefined) { - return undefined - } - try { - return web3Utils.toWei(priceQueryParam as string) - } catch (err) { - console.error( - errorMessage || 'Error in priceQueryParamToWei', - priceQueryParam - ) - } -} - -// The types of this function are deceivingly cryptic. This is just a helper -// that sets or removes a property on any object based on if the value passed is -// truthy or falsy -// e.g: setProperty({foo: 'bar'}, 'foo', false) -> {} -// setProperty({foo: 'bar'}, 'foo', 'baaz') -> { foo: 'baaz' } -export function setProperty>( - objectToBeUpdated: T, - propertyName: keyof T, - value?: T[keyof T] -): void { - if (value) { - objectToBeUpdated[propertyName] = value - } else { - delete objectToBeUpdated[propertyName] - } -} - export function formatBytes(a: number, b: number): string { if (a === 0) return '0 Bytes' const c = 1024 diff --git a/tests/unit/utils/index.test.ts b/tests/unit/utils/index.test.ts index 2651ec273..3c7eaccd9 100644 --- a/tests/unit/utils/index.test.ts +++ b/tests/unit/utils/index.test.ts @@ -4,10 +4,7 @@ import { toStringNoMS, updateQueryStringParameter, isDid, - getFileInfo, - JSONparse, - priceQueryParamToWei, - setProperty + getFileInfo } from '../../../src/utils' jest.mock('axios') @@ -58,62 +55,3 @@ describe('isDid()', () => { expect(isDid('hello')).toBe(false) }) }) - -describe('JSONparse()', () => { - it('parse valid JSON and returns it', () => { - expect( - JSONparse<{ [key: string]: boolean }>('{"valid":true}', 'should not fail') - ).toEqual({ - valid: true - }) - }) - - it('returns undefined when invalid JSON test is passed', () => { - expect( - JSONparse( - 'hello', - 'Console.error part of test: JSONparse should fail' - ) - ).toBe(undefined) - }) - - it('returns undefined when receives undefined', () => { - expect(JSONparse(undefined, 'Should not be logged')).toBe( - undefined - ) - }) -}) - -describe('priceQueryParamToWei()', () => { - it('converts a valid (eth) string amount and returns it', () => { - expect(priceQueryParamToWei('12')).toEqual('12000000000000000000') - }) - - it('returns undefined when (eth) string amount is passed', () => { - expect(priceQueryParamToWei('12.12.12')).toEqual(undefined) - }) - - it('returns undefined when (eth) string amount is undefined', () => { - expect(priceQueryParamToWei(undefined)).toEqual(undefined) - }) -}) - -describe('setProperty()', () => { - let testObject: { foo: string } - - beforeEach(() => { - testObject = { - foo: 'bar' - } - }) - - it('changes the value of a property in an object', () => { - setProperty(testObject, 'foo', 'wunderbar') - expect(testObject.foo).toEqual('wunderbar') - }) - - it('removes a property from an object if a falsy value is passed', () => { - setProperty(testObject, 'foo') - expect(testObject.foo).toBeUndefined() - }) -})