\n \n \n \n \n \n \n \n \n
\n )\n}\n","import React from 'react'\n\nexport const MainWrapper: React.FC = (props) => {\n const { children, ...restProps } = props\n\n return (\n \n {children}\n
\n )\n}\n","import { FILECOIN_CID_CHECKER_API, PAGE_SIZE } from '../config/constants';\nimport { DealDetails, DealStatus, DealValue, DealValueNotAvailable } from './types';\n\nexport const truncateStringInTheMiddle = (\n str: string,\n strPositionStart: number,\n strPositionEnd: number,\n) => {\n const minTruncatedLength = strPositionStart + strPositionEnd\n try {\n if (minTruncatedLength < str.length) {\n return `${str.substr(0, strPositionStart)}...${str.substr(\n str.length - strPositionEnd,\n str.length,\n )}`\n }\n return str\n } catch (e) {\n /* eslint-disable no-console*/\n console.error('truncateStringInTheMiddle', e)\n /* eslint-enable no-console*/\n }\n}\n\nexport const fetchDeals = async (\n search: string,\n page: number,\n query: string,\n activeFilter: boolean,\n verifiedFilter: boolean,\n): Promise e.stopPropagation()}>\n e.stopPropagation()} text={text}>\n \n \n \n
\n )\n}\n","import React from 'react'\n\ninterface Props {\n className?: string\n}\n\nexport const Copy = (props: Props) => {\n return (\n ![\"icon\"](\"https://icongr.am/clarity/copy.svg?size=16&color=ffffff&\")
\n )\n}\n","import React, { HTMLAttributes } from 'react'\nimport styled from 'styled-components'\nimport { useHistory } from 'react-router-dom'\n\nimport { DealValue } from '../utils/types'\nimport { DealStatusIcon } from './dealStatusIcon.component'\nimport { CopyText } from './copyText.component'\nimport { useSearchContext } from '../state/search.context'\n\ninterface Props extends HTMLAttributes\n
\n \n {DealTitles.PieceCID} \n \n {truncateStringInTheMiddle(deal.PieceCID, 6, 4)}\n \n
\n \n {DealTitles.PayloadCID} \n {truncateStringInTheMiddle(deal.Label, 6, 4)} \n
\n\n \n {DealTitles.DealID} \n {deal.DealID} \n
\n \n {DealTitles.MinerID} \n {deal.MinerID} \n
\n \n {DealTitles.Client} \n {deal.Client} \n
\n \n {DealTitles.ClientAddress} \n \n {truncateStringInTheMiddle(clientAddress, 6, 4)}\n \n
\n \n {DealTitles.PieceSize} \n {deal.PieceSize} \n
\n \n {DealTitles.VerifiedDeal} \n {deal.VerifiedDeal ? 'True' : 'False'} \n
\n \n {DealTitles.StartEpoch} \n {deal.StartEpoch} \n
\n \n {DealTitles.StartEpochAsDate} \n {formatDate(deal.StartEpochAsDate)} \n
\n \n {DealTitles.EndEpoch} \n {deal.EndEpoch} \n
\n \n {DealTitles.EndEpochAsDate} \n {formatDate(deal.EndEpochAsDate)} \n
\n \n {DealTitles.StoragePricePerEpoch} \n {deal.StoragePricePerEpoch} \n
\n \n {DealTitles.ProviderCollateral} \n {deal.ProviderCollateral} \n
\n \n {DealTitles.ClientCollateral} \n {deal.ClientCollateral} \n
\n \n {DealTitles.State} \n \n {' '}\n \n
\n\n \n | TOTAL UNIQUE CIDS | \nTOTAL UNIQUE PROVIDERS | \nTOTAL UNIQUE CLIENTS | \nTOTAL STORAGE DEALS | \nTOTAL DATA STORED | \nLATEST HEIGHT | \n
|---|---|---|---|---|---|
\n \n {RemoteData.is.reloading(deals) ? 'Loading...' : 'Show more'}\n \n
\n ) : null\n\n return (\n <>\n \n \n {RemoteData.hasData(deals) && deals.data.length > 0 && (\n <>\n
\n\n \n
\n {showMoreButton}\n \n )}\n {RemoteData.is.success(deals) && deals.data.length === 0 && (\n \n \n )}\n {RemoteData.is.failure(deals) && (\n \n \n )}\n {RemoteData.is.loading(deals) && (\n \n \n )}\n {RemoteData.is.success(deals) && moreDeals &&
\n \n )\n}\n","import { useEffect, useState } from 'react'\nimport { fetchDeals } from '../utils/deals'\nimport { RemoteData } from '../utils/remoteData'\nimport { DealValue } from '../utils/types'\nimport { PAGE_SIZE } from '../config/constants'\n\n// TODO remove me later\nexport const useDeals = (\n search: string,\n page: number,\n query: string,\n activeFilter: boolean,\n verifiedFilter: boolean,\n): { deals: RemoteData\n
![\"icon\"](\"https://icongr.am/clarity/arrow.svg?size=48&color=ffffff&\"){kind=icon}
\n}\n","import React, { useState } from 'react'\nimport styled from 'styled-components'\nimport useEventListener from 'use-typed-event-listener'\n\nimport { Top } from './common/images/top.component'\nimport { Button } from './button.component'\n\nconst ScrollToTopWrapper = styled(Button)`\n padding: 5px;\n position: fixed;\n bottom: 20px;\n z-index: 1000;\n cursor: pointer;\n animation: fadeIn 0.3s;\n transition: opacity 0.4s;\n opacity: 0.5;\n right: 10px;\n border-radius: 50%;\n width: 60px;\n height: 60px;\n &:hover {\n opacity: 1;\n }\n`\n\nexport const BackToTop = () => {\n const [showScroll, setShowScroll] = useState(false)\n\n const checkScrollTop = () => {\n if (!showScroll && window.pageYOffset > 400) {\n setShowScroll(true)\n } else if (showScroll && window.pageYOffset <= 400) {\n setShowScroll(false)\n }\n }\n\n const scrollTop = () => {\n window.scrollTo({ top: 0, behavior: 'smooth' })\n }\n\n useEventListener(window, 'scroll', checkScrollTop)\n\n return (\n