Merge pull request #805 from oceanprotocol/issue710-account-published-page

Account history published page

src/components/pages/Account/History/PublishedList.tsx

@@ -1,13 +1,13 @@
 import { Logger } from '@oceanprotocol/lib'
 import { QueryResult } from '@oceanprotocol/lib/dist/node/metadatacache/MetadataCache'
-import React, { ReactElement, useEffect, useState } from 'react'
+import React, { ReactElement, useEffect, useState, useReducer } from 'react'
 import AssetList from '../../../organisms/AssetList'
 import axios from 'axios'
 import {
   queryMetadata,
   transformChainIdsListToQuery
 } from '../../../../utils/aquarius'
-import { useWeb3 } from '../../../../providers/Web3'
+import ServiceFilter from '../../../templates/Search/filterService'
 import { useSiteMetadata } from '../../../../hooks/useSiteMetadata'
 import { useUserPreferences } from '../../../../providers/UserPreferences'
 
@@ -22,16 +22,19 @@ export default function PublishedList({
   const [queryResult, setQueryResult] = useState<QueryResult>()
   const [isLoading, setIsLoading] = useState(false)
   const [page, setPage] = useState<number>(1)
+  const [service, setServiceType] = useState<string>()
 
   useEffect(() => {
     async function getPublished() {
+      const serviceFiter =
+        service === undefined ? 'dataset OR algorithm' : `${service}`
       if (!accountId) return
       const queryPublishedAssets = {
         page: page,
         offset: 9,
         query: {
           query_string: {
-            query: `(publicKey.owner:${accountId}) AND (${transformChainIdsListToQuery(
+            query: `(publicKey.owner:${accountId}) AND (service.attributes.main.type:${serviceFiter}) AND (${transformChainIdsListToQuery(
               chainIds
             )})`
           }
@@ -41,7 +44,7 @@ export default function PublishedList({
       try {
         const source = axios.CancelToken.source()
 
-        queryResult || setIsLoading(true)
+        setIsLoading(true)
         const result = await queryMetadata(queryPublishedAssets, source.token)
         setQueryResult(result)
       } catch (error) {
@@ -51,9 +54,15 @@ export default function PublishedList({
       }
     }
     getPublished()
-  }, [accountId, page, appConfig.metadataCacheUri, chainIds])
+  }, [accountId, page, appConfig.metadataCacheUri, chainIds, service])
 
   return accountId ? (
+    <div>
+      <ServiceFilter
+        serviceType={service}
+        setServiceType={setServiceType}
+        isSearch={false}
+      />
       <AssetList
         assets={queryResult?.results}
         isLoading={isLoading}
@@ -64,6 +73,7 @@ export default function PublishedList({
           setPage(newPage)
         }}
       />
+    </div>
   ) : (
     <div>Please connect your Web3 wallet.</div>
   )

src/components/templates/Search/filterService.tsx

@@ -16,22 +16,26 @@ const serviceFilterItems = [
 
 export default function FilterPrice({
   serviceType,
-  setServiceType
+  setServiceType,
+  isSearch
 }: {
   serviceType: string
   setServiceType: React.Dispatch<React.SetStateAction<string>>
+  isSearch: boolean
 }): ReactElement {
   const navigate = useNavigate()
   const [serviceSelections, setServiceSelections] = useState<string[]>([])
 
   async function applyServiceFilter(filterBy: string) {
+    setServiceType(filterBy)
+    if (isSearch) {
       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) {
@@ -58,15 +62,15 @@ export default function FilterPrice({
     }
   }
 
-  async function applyClearFilter() {
-    let urlLocation = await addExistingParamsToUrl(location, ['serviceType'])
-
-    urlLocation = `${urlLocation}`
-
+  async function applyClearFilter(isSearch: boolean) {
     setServiceSelections([])
     setServiceType(undefined)
+    if (isSearch) {
+      let urlLocation = await addExistingParamsToUrl(location, ['serviceType'])
+      urlLocation = `${urlLocation}`
       navigate(urlLocation)
     }
+  }
 
   return (
     <div className={styles.filterList}>
@@ -100,7 +104,7 @@ export default function FilterPrice({
             key={index}
             className={showClear ? styles.showClear : styles.hideClear}
             onClick={async () => {
-              applyClearFilter()
+              applyClearFilter(isSearch)
             }}
           >
             {e.display}

src/components/templates/Search/index.tsx

@@ -75,6 +75,7 @@ export default function SearchPage({
             <ServiceFilter
               serviceType={service}
               setServiceType={setServiceType}
+              isSearch
             />
             <Sort
               sortType={sortType}