commons/client/src/components/molecules/SearchResults.tsx

41 lines
1.0 KiB
TypeScript

import React from 'react'
import { Link } from 'react-router-dom'
import { DDO } from '@oceanprotocol/squid'
import Spinner from '../atoms/Spinner'
import AssetTeaser from './AssetTeaser'
import styles from './SearchResults.module.scss'
export interface SearchResultsState {
results: DDO[]
totalResults: number
offset: number
totalPages: number
currentPage: number
isLoading: boolean
}
export default function SearchResults({
isLoading,
results,
simpleGrid
}: {
isLoading: boolean
results: DDO[]
simpleGrid?: boolean
}) {
return isLoading ? (
<Spinner message="Searching..." />
) : results && results.length ? (
<div className={simpleGrid ? styles.simple : styles.results}>
{results.map((asset: any) => (
<AssetTeaser key={asset.id} asset={asset} />
))}
</div>
) : (
<div className={styles.empty}>
<p>No Data Sets Found.</p>
<Link to="/publish">+ Publish A Data Set</Link>
</div>
)
}