Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Token balances not loading issue #402

Merged
merged 2 commits into from
Dec 17, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions src/modules/explorer/components/ConfigProposalForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import { Grid, Typography, TextField } from "@material-ui/core"
import React, { useCallback } from "react"
import { useDAO } from "services/indexer/dao/hooks/useDAO"
import { SendButton } from "./ProposalFormSendButton"
import { useDAOHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { Controller, FormProvider, useForm } from "react-hook-form"
import { useDAOID } from "../pages/DAO/router"
import { ProposalFormInput } from "./ProposalFormInput"
Expand Down Expand Up @@ -36,7 +35,6 @@ interface Props {
export const ConfigProposalForm: React.FC<Props> = ({ open, handleClose }) => {
const daoId = useDAOID()
const { data: dao } = useDAO(daoId)
const { data: daoHoldings } = useDAOHoldings(daoId)

const methods = useForm<Values>()

Expand Down Expand Up @@ -126,7 +124,7 @@ export const ConfigProposalForm: React.FC<Props> = ({ open, handleClose }) => {
</Typography>
</Grid>

<SendButton onClick={methods.handleSubmit(onSubmit as any)} disabled={!dao || !daoHoldings}>
<SendButton onClick={methods.handleSubmit(onSubmit as any)} disabled={!dao}>
Submit
</SendButton>
</Grid>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,6 @@ const Content = styled(Grid)({
export const DelegationChangeProposalForm: React.FC<Props> = ({ open, handleClose, defaultValues }) => {
const daoId = useDAOID()
const { data: dao } = useDAO(daoId)
const { data: daoHoldings } = useDAOHoldings(daoId)

const methods = useForm<Values>({
defaultValues: useMemo(
Expand Down Expand Up @@ -96,10 +95,7 @@ export const DelegationChangeProposalForm: React.FC<Props> = ({ open, handleClos
</Typography>
</Grid>

<SendButton
onClick={methods.handleSubmit(onSubmit as any)}
disabled={!dao || !daoHoldings || !newDelegationAddress}
>
<SendButton onClick={methods.handleSubmit(onSubmit as any)} disabled={!dao || !newDelegationAddress}>
Submit
</SendButton>
</Content>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import { Grid, styled, Typography, TextField } from "@material-ui/core"
import React, { useCallback, useEffect, useMemo } from "react"
import { useDAO } from "services/indexer/dao/hooks/useDAO"
import { SendButton } from "./ProposalFormSendButton"
import { useDAOHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { Controller, FormProvider, useForm } from "react-hook-form"
import { useDAOID } from "../pages/DAO/router"
import { ProposalFormInput } from "./ProposalFormInput"
Expand Down Expand Up @@ -32,7 +31,6 @@ const Content = styled(Grid)({})
export const GuardianChangeProposalForm: React.FC<Props> = ({ open, handleClose, defaultValues }) => {
const daoId = useDAOID()
const { data: dao } = useDAO(daoId)
const { data: daoHoldings } = useDAOHoldings(daoId)

const methods = useForm<Values>({
defaultValues: useMemo(
Expand Down Expand Up @@ -108,10 +106,7 @@ export const GuardianChangeProposalForm: React.FC<Props> = ({ open, handleClose,
</Typography>
</Grid>

<SendButton
onClick={methods.handleSubmit(onSubmit as any)}
disabled={!dao || !daoHoldings || !newGuardianAddress}
>
<SendButton onClick={methods.handleSubmit(onSubmit as any)} disabled={!dao || !newGuardianAddress}>
Submit
</SendButton>
</Content>
Expand Down
4 changes: 2 additions & 2 deletions src/modules/explorer/components/NFTTransfer.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { useState, useMemo } from "react"
import { Grid, styled, Paper, DialogContent, TextField } from "@material-ui/core"
import { useDAOHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { useDAONFTHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { ErrorText } from "modules/explorer/components/styled/ErrorText"
import * as Yup from "yup"
import { Autocomplete } from "@material-ui/lab"
Expand Down Expand Up @@ -93,7 +93,7 @@ export const NFTTransferForm: React.FC<{ open: boolean }> = ({ open }) => {
const [isBatch, setIsBatch] = useState(values.nftTransferForm.isBatch)
const [activeTransfer, setActiveTransfer] = React.useState(1)
const daoId = useDAOID()
const { nftHoldings } = useDAOHoldings(daoId)
const { nftHoldings } = useDAONFTHoldings(daoId)

const handleIsBatchChange = () => {
setIsBatch(!isBatch)
Expand Down
130 changes: 77 additions & 53 deletions src/modules/explorer/pages/NFTs/index.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,14 @@
import { Box, Button, Grid, styled, Tooltip, Typography, useMediaQuery, useTheme } from "@material-ui/core"
import {
Box,
Button,
CircularProgress,
Grid,
styled,
Tooltip,
Typography,
useMediaQuery,
useTheme
} from "@material-ui/core"
import { NFT as NFTModel } from "models/Token"
import { CopyAddress } from "modules/common/CopyAddress"
import { NFT } from "modules/explorer/components/NFT"
Expand All @@ -9,7 +19,7 @@ import { UserBadge } from "modules/explorer/components/UserBadge"
import React, { useState } from "react"
import { NFTDAOHolding } from "services/bakingBad/tokenBalances"
import { useTezos } from "services/beacon/hooks/useTezos"
import { useDAOHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { useDAONFTHoldings } from "services/contracts/baseDAO/hooks/useDAOHoldings"
import { useDAO } from "services/indexer/dao/hooks/useDAO"
import { ContentContainer } from "../../components/ContentContainer"
import { Hero } from "../../components/Hero"
Expand Down Expand Up @@ -49,7 +59,7 @@ export const NFTs: React.FC = () => {
const theme = useTheme()
const daoId = useDAOID()
const { data: dao } = useDAO(daoId)
const { nftHoldings } = useDAOHoldings(daoId)
const { nftHoldings } = useDAONFTHoldings(daoId)
const [openTransfer, setOpenTransfer] = useState(false)
const { account } = useTezos()
const [defaultValues, setDefaultValues] = useState<ProposalFormDefaultValues>()
Expand Down Expand Up @@ -125,61 +135,75 @@ export const NFTs: React.FC = () => {
</Hero>
<Grid item>
<Grid container justifyContent={isMobileSmall ? "center" : "flex-start"} style={{ gap: 12 }}>
{nftHoldings.map((nft, i) => (
<Card
key={`nft-${i}`}
item
container
xs={isMobileSmall ? 12 : undefined}
direction="column"
style={{ gap: 20 }}
onClick={() => onClickNFT(nft)}
>
<Grid item>
<Grid container direction="column" style={{ gap: 18 }} alignItems="center">
<FullWidthContainer item>
{nft.token.firstCreator ? (
<UserBadge size={35} address={nft.token.firstCreator} short={true} />
) : (
<Typography color={"textPrimary"} variant={"body1"}>
Unknown
</Typography>
)}
</FullWidthContainer>
<Grid item>
<ImgContainer>
<NFT qmHash={nft.token.artifact_hash} mediaType={nft.token.mediaType} name={nft.token.name} />
</ImgContainer>
</Grid>
<FullWidthContainer item>
<NFTId color="textPrimary">
{nft.token.symbol} #{nft.token.token_id}
</NFTId>
</FullWidthContainer>
</Grid>
{!nftHoldings ? (
<>
<Grid container direction="row" justifyContent="center">
<CircularProgress color="secondary" />
</Grid>
<Grid item>
<Grid container direction="column" style={{ gap: 20 }}>
</>
) : (
<>
{nftHoldings.map((nft, i) => (
<Card
key={`nft-${i}`}
item
container
xs={isMobileSmall ? 12 : undefined}
direction="column"
style={{ gap: 20 }}
onClick={() => onClickNFT(nft)}
>
<Grid item>
<NFTTitle color="textPrimary" variant="h4">
{nft.token.name}
</NFTTitle>
<Grid container direction="column" style={{ gap: 18 }} alignItems="center">
<FullWidthContainer item>
{nft.token.firstCreator ? (
<UserBadge size={35} address={nft.token.firstCreator} short={true} />
) : (
<Typography color={"textPrimary"} variant={"body1"}>
Unknown
</Typography>
)}
</FullWidthContainer>
<Grid item>
<ImgContainer>
<NFT
qmHash={nft.token.artifact_hash}
mediaType={nft.token.mediaType}
name={nft.token.name}
/>
</ImgContainer>
</Grid>
<FullWidthContainer item>
<NFTId color="textPrimary">
{nft.token.symbol} #{nft.token.token_id}
</NFTId>
</FullWidthContainer>
</Grid>
</Grid>
<Grid item>
<SmallButton
variant="contained"
color="secondary"
size="small"
onClick={e => onClick(e, nft.token)}
disabled={shouldDisable}
>
Propose Transfer
</SmallButton>
<Grid container direction="column" style={{ gap: 20 }}>
<Grid item>
<NFTTitle color="textPrimary" variant="h4">
{nft.token.name}
</NFTTitle>
</Grid>
<Grid item>
<SmallButton
variant="contained"
color="secondary"
size="small"
onClick={e => onClick(e, nft.token)}
disabled={shouldDisable}
>
Propose Transfer
</SmallButton>
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
</Card>
))}
</Card>
))}
</>
)}
</Grid>
</Grid>
</Grid>
Expand Down
Loading