diff --git a/packages/website/lib/api.js b/packages/website/lib/api.js
index 1ebe99e397..110dea1d45 100644
--- a/packages/website/lib/api.js
+++ b/packages/website/lib/api.js
@@ -117,7 +117,7 @@ export async function getNfts({ limit, before }) {
* @param {{cid: string }} query
*/
export async function getNft({ cid }) {
- const res = await fetch(`${API}/cid/${cid}}`, {
+ const res = await fetch(`${API}/cid/${cid}`, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
diff --git a/packages/website/pages/files.js b/packages/website/pages/files.js
index 0e9496a47f..660b3c49e3 100644
--- a/packages/website/pages/files.js
+++ b/packages/website/pages/files.js
@@ -1,7 +1,7 @@
-import { API, getNfts, getToken } from '../lib/api.js'
+import { API, getNft, getNfts, getToken } from '../lib/api.js'
import { useQuery, useQueryClient } from 'react-query'
import { CID } from 'multiformats/cid'
-import { VscQuestion } from 'react-icons/vsc'
+import { VscLoading, VscQuestion } from 'react-icons/vsc'
import Button from '../components/button.js'
import Tooltip from '../components/tooltip.js'
import Loading from '../components/loading'
@@ -110,7 +110,19 @@ export default function Files({ user }) {
*/
const TableItem = ({ nft }) => {
const [showAllDeals, setShowAllDeals] = useState(false)
- const deals = nft.deals
+ const [loadW3upDeals, setLoadW3upDeals] = useState(false)
+ const { status: w3upDealsStatus, data: w3upDeals } = useQuery(
+ ['w3updeals', nft.cid],
+ async () => {
+ const fetchedNft = await getNft(nft)
+ return fetchedNft.deals
+ },
+ {
+ enabled: loadW3upDeals,
+ refetchOnWindowFocus: false,
+ }
+ )
+ const deals = [...nft.deals, ...(w3upDeals || [])]
.filter((/** @type {any} */ d) => d.status !== 'queued')
.map(
(
@@ -165,33 +177,65 @@ export default function Files({ user }) {
const dealsHidden = deals.splice(3)
- const [w3upDeals, setW3upDeals] = useState([])
- async function loadW3upDeals() {}
-
- if (!nft.deals.length) {
- deals.push(
-
- Queuing
-
- The content from this upload is being aggregated for redundant
- storage on Filecoin. Filecoin deals will be active within 48
- hours of upload. While Queuing, data is still available on the
- IPFS network.
-
- }
- overlayClassName="ns-tooltip"
- id="all-deals-queued-tooltip"
+ if (!deals.length) {
+ if (w3upDealsStatus === 'success' || w3upDealsStatus === 'error') {
+ deals.push(
+
-
-
-
- )
+ Queuing
+
+ The content from this upload is being aggregated for redundant
+ storage on Filecoin. Filecoin deals will be active within 48
+ hours of upload. While Queuing, data is still available on the
+ IPFS network.
+
+ }
+ overlayClassName="ns-tooltip"
+ id="all-deals-queued-tooltip"
+ >
+
+
+
+ )
+ } else {
+ deals.push(
+
+ {w3upDealsStatus === 'loading' ? (
+
+
+
+ ) : (
+ Check for Filecoin deals for this upload.}
+ overlayClassName="ns-tooltip"
+ id="load-w3up-deals-tooltip"
+ >
+
+
+ )}
+
+ )
+ }
}
return (