Skip to content

Commit

Permalink
Merge pull request #548 from Magickbase/develop
Browse files Browse the repository at this point in the history
  • Loading branch information
Keith-CY authored Sep 16, 2022
2 parents 51962b2 + fbf0f06 commit 70d214d
Show file tree
Hide file tree
Showing 66 changed files with 29,065 additions and 13,311 deletions.
5 changes: 4 additions & 1 deletion components/AccountOverview/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ export interface PolyjuiceContract extends AccountBase {
| 'abi'
| 'constructor_arguments'
> | null
udt: Pick<GraphQLSchema.Udt, 'id' | 'name' | 'official_site' | 'description' | 'icon'> | null
udt: Pick<GraphQLSchema.Udt, 'id' | 'name' | 'official_site' | 'description' | 'icon' | 'eth_type'> | null
}
export interface PolyjuiceCreator extends AccountBase {
type: GraphQLSchema.AccountType.PolyjuiceCreator
Expand Down Expand Up @@ -113,6 +113,9 @@ const accountOverviewQuery = gql`
constructor_arguments
abi
}
udt {
eth_type
}
}
}
`
Expand Down
4 changes: 2 additions & 2 deletions components/CopyBtn/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import CopyIcon from 'assets/icons/copy.svg'
import { handleCopy } from 'utils'
import styles from './styles.module.scss'

const CopyBtn: React.FC<{ content: string }> = ({ content }) => {
const CopyBtn: React.FC<Record<'content' | 'field', string>> = ({ content, field }) => {
const [t] = useTranslation('common')
const [isCopied, setIsCopied] = useState(false)

Expand All @@ -18,7 +18,7 @@ const CopyBtn: React.FC<{ content: string }> = ({ content }) => {
<button className={styles.copyBtn} aria-label="copy" onClick={handleHashCopy}>
<CopyIcon fontSize="inherit" />
</button>
<Alert open={isCopied} onClose={() => setIsCopied(false)} content={t(`blockHashCopied`)} type="success" />
<Alert open={isCopied} onClose={() => setIsCopied(false)} content={t(`field-copied`, { field })} type="success" />
</>
)
}
Expand Down
5 changes: 3 additions & 2 deletions components/HashLink/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,15 @@ interface HashLinkProps {
href: string
external?: boolean
style?: React.CSSProperties
monoFont?: boolean
}

const HashLink: React.FC<HashLinkProps> = ({ label, href, external = false, style }) => (
const HashLink: React.FC<HashLinkProps> = ({ label, href, external = false, style, monoFont = true }) => (
<NextLink href={href}>
<a
href={href}
title={label}
className={`${styles.container} mono-font`}
className={`${styles.container} ${monoFont ? 'mono-font' : ''}`}
style={style}
target={external ? '_blank' : '_self'}
rel="noopener noreferrer"
Expand Down
28 changes: 28 additions & 0 deletions components/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -173,6 +173,34 @@ const Header = () => {
</NextLink>
</MenuItem>
))}

<MenuItem onClick={handleMenuListClose} sx={{ p: 0 }}>
<NextLink href={`/nft-collections`} passHref>
<Link
href={`/nft-collections`}
title={t(`nft-collections`)}
underline="none"
sx={{ width: '100%', padding: '6px 16px' }}
color="secondary"
>
{t(`nft-collections`)}
</Link>
</NextLink>
</MenuItem>

{/* <MenuItem onClick={handleMenuListClose} sx={{ p: 0 }}> */}
{/* <NextLink href={`/multi-token-collections`} passHref> */}
{/* <Link */}
{/* href={`/multi-token-collections`} */}
{/* title={t(`multi-token-collections`)} */}
{/* underline="none" */}
{/* sx={{ width: '100%', padding: '6px 16px' }} */}
{/* color="secondary" */}
{/* > */}
{/* {t(`multi-token-collections`)} */}
{/* </Link> */}
{/* </NextLink> */}
{/* </MenuItem> */}
</MenuList>
)

Expand Down
15 changes: 15 additions & 0 deletions components/Metadata/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import styles from './styles.module.scss'

type Metadata = Record<'name' | 'description' | 'image', string>

const Metadata: React.FC<Metadata> = metadata => {
return (
<div className={styles.container}>
{metadata ? <textarea defaultValue={JSON.stringify(metadata, null, 2)} readOnly /> : `No Metadata`}
</div>
)
}

Metadata.displayName = 'Metadata'

export default Metadata
19 changes: 19 additions & 0 deletions components/Metadata/styles.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
@import '../../styles/mixin.scss';

.container {
padding: 1.5rem;
textarea {
@include mono-font;
width: 100%;
margin: 0;
padding: 1rem;
resize: vertical;
height: 80ch;
overflow: auto;
background: #fafafa;
border-radius: 4px;
border-color: var(--border-color);
font-size: 0.875rem;
color: var(--primary-text-color);
}
}
193 changes: 193 additions & 0 deletions components/MultiTokenActivityList/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,193 @@
import { useTranslation } from 'next-i18next'
import NextLink from 'next/link'
import { gql } from 'graphql-request'
import Table from 'components/Table'
import Tooltip from 'components/Tooltip'
import Address from 'components/TruncatedAddress'
import Pagination from 'components/SimplePagination'
import TxStatusIcon from 'components/TxStatusIcon'
import TransferDirection from 'components/TransferDirection'
import NoDataIcon from 'assets/icons/no-data.svg'
import { client, timeDistance, getBlockStatus, GraphQLSchema } from 'utils'
import styles from './styles.module.scss'

type ActivityListProps = {
transfers: {
entries: Array<{
transaction: Pick<GraphQLSchema.Transaction, 'eth_hash' | 'method_id' | 'method_name'>
block: Pick<GraphQLSchema.Block, 'number' | 'status' | 'timestamp'>
from_address: string
from_account?: Pick<GraphQLSchema.Account, 'type'>
to_address: string
to_account?: Pick<GraphQLSchema.Account, 'type'>
log_index: number
polyjuice: Pick<GraphQLSchema.Polyjuice, 'status'>
token_id: number
token_contract_address_hash: string
amount: string | null
}>
metadata: GraphQLSchema.PageMetadata
}
}

interface Cursor {
limit?: number
before: string
after: string
}

export interface CollectionTransferListVariables extends Nullable<Cursor> {
address: string
token_id?: string
}

const activityListQuery = gql`
query ($address: HashAddress, $before: String, $after: String, $limit: Int, $token_id: Int) {
transfers: erc1155_token_transfers(
input: {
token_contract_address_hash: $address
before: $before
after: $after
limit: $limit
token_id: $token_id
}
) {
entries {
transaction {
method_id
method_name
eth_hash
}
from_address
from_account {
type
}
to_address
to_account {
type
}
log_index
block {
number
timestamp
status
}
polyjuice {
status
}
token_id
token_contract_address_hash
amount
}
metadata {
total_count
before
after
}
}
}
`

export const fetchActivityList = (variables: CollectionTransferListVariables) =>
client.request<ActivityListProps>(activityListQuery, variables).then(data => data.transfers)

const ActivityList: React.FC<
ActivityListProps & {
viewer?: string
token_id?: string
}
> = ({ transfers, viewer, token_id }) => {
const [t, { language }] = useTranslation('list')

return (
<div className={styles.container}>
<Table>
<thead>
<tr>
<th>{t('txHash')}</th>
<th>{t('method')} </th>
<th>{t('age')} </th>
<th>{t('from')}</th>
<th>{t('to')}</th>
{viewer ? <th></th> : null}
{token_id ? null : <th>{`${t('token_id')}`}</th>}
<th>{t('token_amount')}</th>
</tr>
</thead>
<tbody>
{transfers?.metadata.total_count ? (
transfers.entries.map(item => {
const method = item.transaction.method_name || item.transaction.method_id

return (
<tr key={item.transaction.eth_hash + item.log_index}>
<td>
<div className={styles.hash}>
<Tooltip title={item.transaction.eth_hash} placement="top">
<span>
<NextLink href={`/tx/${item.transaction.eth_hash}`}>
<a className="mono-font">{`${item.transaction.eth_hash.slice(
0,
8,
)}...${item.transaction.eth_hash.slice(-8)}`}</a>
</NextLink>
</span>
</Tooltip>
<TxStatusIcon
status={getBlockStatus(item.block.status)}
isSuccess={item.polyjuice.status === GraphQLSchema.PolyjuiceStatus.Succeed}
/>
</div>
</td>
<td>
{method ? (
<Tooltip title={item.transaction.method_id} placement="top">
<div className={styles.method} title={method}>
{method}
</div>
</Tooltip>
) : (
'-'
)}
</td>
<td>
<time dateTime={item.block.timestamp}>
{timeDistance(new Date(item.block.timestamp).getTime(), language)}
</time>
</td>
<td>{<Address address={item.from_address} type={item.from_account?.type} />}</td>
<td>{<Address address={item.to_address} type={item.to_account?.type} />}</td>
{viewer ? (
<td>
<TransferDirection from={item.from_address} to={item.to_address} viewer={viewer ?? ''} />
</td>
) : null}
{token_id ? null : (
<td>
<NextLink href={`/multi-token-item/${item.token_contract_address_hash}/${item.token_id}`}>
<a>{(+item.token_id).toLocaleString('en')}</a>
</NextLink>
</td>
)}
<td>{+(item.amount ?? 0).toLocaleString('en')}</td>
</tr>
)
})
) : (
<tr>
<td colSpan={7 - +!!viewer - +!!token_id}>
<div className={styles.noRecords}>
<NoDataIcon />
<span>{t(`no_records`)}</span>
</div>
</td>
</tr>
)}
</tbody>
</Table>
{transfers ? <Pagination {...transfers.metadata} note={t(`last-n-records`, { n: '10k' })} /> : null}
</div>
)
}
export default ActivityList
20 changes: 20 additions & 0 deletions components/MultiTokenActivityList/styles.module.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
@import '../../styles/mixin.scss';

.container {
.hash {
display: flex;
align-items: center;
font-weight: 500;
a {
padding-right: 4px;
}
}
}

.method {
@include tx-method;
}

.noRecords {
@include empty-list;
}
Loading

1 comment on commit 70d214d

@vercel
Copy link

@vercel vercel bot commented on 70d214d Sep 16, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.