Jorge Hernandez
GitHub
commit
cb25b03870
@ -29,7 +29,14 @@ import { useEffect, useRef, useState } from 'react'
|
||||
import { toast } from 'react-hot-toast'
|
||||
import { upload } from 'services/upload'
|
||||
import { compareFileArrays } from 'utils/compareFileArrays'
|
||||
import { MINTER_CODE_ID, SG721_CODE_ID, STARGAZE_URL, WHITELIST_CODE_ID } from 'utils/constants'
|
||||
import {
|
||||
BLOCK_EXPLORER_URL,
|
||||
MINTER_CODE_ID,
|
||||
NETWORK,
|
||||
SG721_CODE_ID,
|
||||
STARGAZE_URL,
|
||||
WHITELIST_CODE_ID,
|
||||
} from 'utils/constants'
|
||||
import { withMetadata } from 'utils/layout'
|
||||
import { links } from 'utils/links'
|
||||
|
||||
@ -472,13 +479,24 @@ const CollectionCreationPage: NextPage = () => {
|
||||
<br />
|
||||
</Conditional>
|
||||
Transaction Hash: {' '}
|
||||
<Anchor
|
||||
className="text-stargaze hover:underline"
|
||||
external
|
||||
href={`https://testnet-explorer.publicawesome.dev/stargaze/tx/${transactionHash as string}`}
|
||||
>
|
||||
{transactionHash}
|
||||
</Anchor>
|
||||
<Conditional test={NETWORK === 'testnet'}>
|
||||
<Anchor
|
||||
className="text-stargaze hover:underline"
|
||||
external
|
||||
href={`${BLOCK_EXPLORER_URL}/tx/${transactionHash as string}`}
|
||||
>
|
||||
{transactionHash}
|
||||
</Anchor>
|
||||
</Conditional>
|
||||
<Conditional test={NETWORK === 'mainnet'}>
|
||||
<Anchor
|
||||
className="text-stargaze hover:underline"
|
||||
external
|
||||
href={`${BLOCK_EXPLORER_URL}/txs/${transactionHash as string}`}
|
||||
>
|
||||
{transactionHash}
|
||||
</Anchor>
|
||||
</Conditional>
|
||||
<Button className="mt-2">
|
||||
<Anchor
|
||||
className="text-white"
|
||||
|
||||
@ -1,74 +1,81 @@
|
||||
/* eslint-disable eslint-comments/disable-enable-pair */
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
/* eslint-disable @typescript-eslint/restrict-template-expressions */
|
||||
import axios from 'axios'
|
||||
import { Alert } from 'components/Alert'
|
||||
import { Anchor } from 'components/Anchor'
|
||||
import { Button } from 'components/Button'
|
||||
import { Conditional } from 'components/Conditional'
|
||||
import { ContractPageHeader } from 'components/ContractPageHeader'
|
||||
import { useWallet } from 'contexts/wallet'
|
||||
import type { NextPage } from 'next'
|
||||
import { NextSeo } from 'next-seo'
|
||||
import { useCallback, useState } from 'react'
|
||||
import { useCallback, useEffect, useState } from 'react'
|
||||
import { FaRocket, FaSlidersH } from 'react-icons/fa'
|
||||
import { STARGAZE_URL } from 'utils/constants'
|
||||
import { API_URL, STARGAZE_URL } from 'utils/constants'
|
||||
import { withMetadata } from 'utils/layout'
|
||||
import { links } from 'utils/links'
|
||||
|
||||
import type { CollectionData } from './create'
|
||||
|
||||
const CollectionList: NextPage = () => {
|
||||
const wallet = useWallet()
|
||||
const [clearFlag, setClearFlag] = useState(false)
|
||||
let allCollections: Record<string, CollectionData[]>[] = []
|
||||
let myCollections: Record<string, CollectionData[]> | undefined
|
||||
let myCollectionList: CollectionData[] = []
|
||||
const [myCollections, setMyCollections] = useState<any[]>([])
|
||||
|
||||
if (typeof localStorage !== 'undefined') {
|
||||
allCollections = localStorage['collections'] ? JSON.parse(localStorage['collections']) : []
|
||||
myCollections = allCollections.find((c) => Object.keys(c)[0] === wallet.address)
|
||||
myCollectionList = myCollections ? Object.values(myCollections)[0] : []
|
||||
console.log(localStorage['collections'])
|
||||
}
|
||||
useEffect(() => {
|
||||
const fetchCollections = async () => {
|
||||
await axios
|
||||
.get(`${API_URL}/api/v1beta/collections/${wallet.address}`)
|
||||
.then((response) => {
|
||||
const collectionData = response.data
|
||||
setMyCollections(collectionData)
|
||||
})
|
||||
.catch(console.error)
|
||||
}
|
||||
fetchCollections().catch(console.error)
|
||||
}, [wallet.address])
|
||||
|
||||
const renderTable = useCallback(() => {
|
||||
return (
|
||||
<div className="overflow-x-auto w-full">
|
||||
{myCollectionList.length > 0 && (
|
||||
{myCollections.length > 0 && (
|
||||
<table className="table w-full">
|
||||
<thead>
|
||||
<tr>
|
||||
<th className="pl-20 text-lg font-bold text-left bg-black">Collection Name</th>
|
||||
<th className="pl-36 text-lg font-bold text-left bg-black">Collection Name</th>
|
||||
<th className="text-lg font-bold bg-black">Contract Address</th>
|
||||
<th className="text-lg font-bold bg-black">Creation Time</th>
|
||||
<th className="bg-black" />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{myCollectionList.map((collection, index) => {
|
||||
{myCollections.map((collection: any, index: any) => {
|
||||
return (
|
||||
<tr key={index}>
|
||||
<td className="bg-black">
|
||||
<td className="w-[55%] bg-black">
|
||||
<div className="flex items-center space-x-3">
|
||||
<div className="avatar">
|
||||
<div className="w-12 h-12 mask mask-squircle">
|
||||
<img alt="Cover" src={collection.imageURL} />
|
||||
<div className="w-28 h-28 mask mask-squircle">
|
||||
<img
|
||||
alt="Cover"
|
||||
src={`https://ipfs.stargaze.zone/ipfs/${(collection.image as string).substring(7)}`}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="ml-2 font-bold">{collection.name}</div>
|
||||
<div className="text-sm opacity-50" />
|
||||
<div className="pl-2">
|
||||
<p className="overflow-auto max-w-xs font-bold no-scrollbar ">{collection.name}</p>
|
||||
<p className="max-w-xs text-sm truncate opacity-50">{collection.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="bg-black">
|
||||
{collection.address}
|
||||
<td className="w-[35%] bg-black">
|
||||
{collection.contractAddress}
|
||||
{/* <br /> */}
|
||||
{/* <span className="badge badge-ghost badge-sm"></span> */}
|
||||
</td>
|
||||
<td className="bg-black">{new Date(collection.time).toDateString()}</td>
|
||||
<th className="bg-black">
|
||||
<div className="flex items-center space-x-8">
|
||||
<Anchor
|
||||
className="text-xl text-plumbus"
|
||||
href={`/collections/actions?sg721ContractAddress=${collection.address}&minterContractAddress=${collection.minter}`}
|
||||
href={`/collections/actions?sg721ContractAddress=${collection.contractAddress}&minterContractAddress=${collection.minter}`}
|
||||
>
|
||||
<FaSlidersH />
|
||||
</Anchor>
|
||||
@ -90,16 +97,7 @@ const CollectionList: NextPage = () => {
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}, [clearFlag, wallet.address])
|
||||
|
||||
const clearMyCollections = () => {
|
||||
console.log('Cleared!')
|
||||
if (typeof localStorage !== 'undefined') {
|
||||
localStorage['collections'] = JSON.stringify(allCollections.filter((c) => Object.keys(c)[0] !== wallet.address))
|
||||
myCollectionList = []
|
||||
setClearFlag(!clearFlag)
|
||||
}
|
||||
}
|
||||
}, [myCollections, wallet.address])
|
||||
|
||||
return (
|
||||
<section className="py-6 px-12 space-y-4">
|
||||
@ -108,8 +106,8 @@ const CollectionList: NextPage = () => {
|
||||
<hr />
|
||||
<div>{renderTable()}</div>
|
||||
<br />
|
||||
{myCollectionList.length > 0 && <Button onClick={clearMyCollections}>Clear Collection List</Button>}
|
||||
<Conditional test={myCollectionList.length === 0}>
|
||||
|
||||
<Conditional test={myCollections.length === 0}>
|
||||
<Alert type="info">You haven't created any collections so far.</Alert>
|
||||
</Conditional>
|
||||
</section>
|
||||
|
||||
@ -4,6 +4,7 @@ export const WHITELIST_CODE_ID = parseInt(process.env.NEXT_PUBLIC_WHITELIST_CODE
|
||||
|
||||
export const PINATA_ENDPOINT_URL = process.env.NEXT_PUBLIC_PINATA_ENDPOINT_URL
|
||||
export const NETWORK = process.env.NEXT_PUBLIC_NETWORK
|
||||
export const API_URL = process.env.NEXT_PUBLIC_API_URL
|
||||
export const STARGAZE_URL = process.env.NEXT_PUBLIC_STARGAZE_WEBSITE_URL
|
||||
|
||||
export const BLOCK_EXPLORER_URL = process.env.NEXT_PUBLIC_BLOCK_EXPLORER_URL
|
||||
|
||||
Loading…
Reference in New Issue
Block a user