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: mainnet fixes (#176) #177

Merged
merged 1 commit into from
Apr 4, 2024
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
2 changes: 1 addition & 1 deletion apps/web/src/app/(routes)/bridge/[address]/TokenList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -159,9 +159,9 @@ export default function TokenList({ nftContractAddress }: TokenListProps) {
cardType="nft"
chain={sourceChain}
disabled={isAllSelected && !isSelected}
image={ownedNft.image}
isSelected={isSelected}
key={ownedNft.tokenId}
media={ownedNft.media}
title={ownedNft.name}
/>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,8 +62,8 @@ export default function CollectionGrid({
cardType="collection"
chain={sourceChain}
disabled={!nftCollection.isBridgeable}
image={nftCollection.image}
isBridgeable={nftCollection.isBridgeable}
media={nftCollection.media}
numberOfNfts={nftCollection.totalBalance}
onClick={() => {}}
title={nftCollection.name}
Expand Down
33 changes: 7 additions & 26 deletions apps/web/src/app/(routes)/bridge/_components/TransferNftsList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,32 +50,13 @@ export default function TransferNftsList() {
return (
<div className="flex justify-between" key={selectedNft.tokenId}>
<div className="flex items-center gap-4">
{selectedNft?.image ? (
<Media
alt={selectedNft.tokenName}
className="rounded"
height={52}
src={selectedNft.image}
width={52}
/>
) : (
<>
<Media
alt="empty Nft image"
className="hidden rounded dark:block"
height={52}
src={`/medias/dark/empty_nft.png`}
width={52}
/>
<Media
alt="empty Nft image"
className="rounded dark:hidden"
height={52}
src={`/medias/empty_nft.png`}
width={52}
/>
</>
)}
<Media
alt={selectedNft.tokenName}
className="rounded"
height={52}
media={selectedNft.media}
width={52}
/>
<div className="flex flex-col">
<Typography ellipsable variant="body_text_14">
{selectedNft.collectionName}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ export default function useTransferStarknetNfts() {
setIsSigning(false);
}
} catch (error) {
console.log(error);
console.error(error);
setIsSigning(false);
}
}
Expand Down
33 changes: 7 additions & 26 deletions apps/web/src/app/(routes)/lounge/_components/NftTransferItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -86,32 +86,13 @@ export default function NftTransferItem({
)}
>
<div className="flex items-center gap-4">
{collectionImage ? (
<Media
alt="nft"
className="rounded-lg"
height={62}
src={collectionImage}
width={62}
/>
) : (
<>
<Image
alt="empty Nft image"
className="hidden aspect-square rounded-lg object-cover dark:block"
height={62}
src={`/medias/dark/empty_nft.png`}
width={62}
/>
<Image
alt="empty Nft image"
className="aspect-square rounded-lg object-cover dark:hidden"
height={62}
src={`/medias/empty_nft.png`}
width={62}
/>
</>
)}
<Media
alt="nft"
className="rounded-lg"
height={62}
media={{ format: "image", src: collectionImage }}
width={62}
/>
<div className="text-left">
<Typography component="p" variant="body_text_bold_14">
{collectionName} Collection
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -97,32 +97,13 @@ export default function NftTransferItemContent({
<div key={nft.tokenName}>
<div className="grid grid-cols-[1fr_1fr_1fr_1fr_2.25rem] place-items-start items-center">
<div className="flex items-center gap-4">
{nft.image !== undefined ? (
<Media
alt="nft"
className="flex-shrink-0 rounded-md"
height={52}
src={nft.image}
width={52}
/>
) : (
<>
<Media
alt="empty Nft image"
className="hidden aspect-square rounded-lg object-cover dark:block"
height={52}
src={`/medias/dark/empty_nft.png`}
width={52}
/>
<Media
alt="empty Nft image"
className="aspect-square rounded-lg object-cover dark:hidden"
height={52}
src={`/medias/empty_nft.png`}
width={52}
/>
</>
)}
<Media
alt="nft"
className="flex-shrink-0 rounded-md"
height={52}
media={nft.media}
width={52}
/>
<div className="text-left">
<Typography component="p" variant="body_text_14">
{nft.collectionName}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,9 +62,9 @@ function AllNftsTabsContent() {
<NftCard
cardType="nft"
chain="Ethereum"
image={nft.image}
isSelected={false}
key={`${nft.contractAddress}-${nft.tokenId}`}
media={nft.media}
title={nft.name}
/>
);
Expand All @@ -78,9 +78,9 @@ function AllNftsTabsContent() {
<NftCard
cardType="nft"
chain="Starknet"
image={nft.image}
isSelected={false}
key={`${nft.contractAddress}-${nft.tokenId}`}
media={nft.media}
title={nft.name}
/>
);
Expand Down Expand Up @@ -147,9 +147,9 @@ function CollectionsTabsContent() {
<NftCard
cardType="collection"
chain="Ethereum"
image={collection.image}
isSelected={false}
key={collection.contractAddress}
media={collection.media}
numberOfNfts={collection.totalBalance}
title={collection.name}
/>
Expand All @@ -163,9 +163,9 @@ function CollectionsTabsContent() {
<NftCard
cardType="collection"
chain="Starknet"
image={collection.image}
isSelected={false}
key={collection.contractAddress}
media={collection.media}
numberOfNfts={collection.totalBalance}
title={collection.name}
/>
Expand Down Expand Up @@ -222,9 +222,9 @@ function EthereumNTabsContent() {
<NftCard
cardType="nft"
chain="Ethereum"
image={nft.image}
isSelected={false}
key={`${nft.contractAddress}-${nft.tokenId}`}
media={nft.media}
title={nft.name}
/>
);
Expand Down Expand Up @@ -282,9 +282,9 @@ function StarknetTabsContent() {
<NftCard
cardType="nft"
chain="Starknet"
image={nft.image}
isSelected={false}
key={`${nft.contractAddress}-${nft.tokenId}`}
media={nft.media}
title={nft.name}
/>
);
Expand Down
4 changes: 2 additions & 2 deletions apps/web/src/app/(routes)/portfolio/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@ export default function Page() {

<NftsTabs />

<BridgingQuestBanner className="mt-16" />
<BridgingQuestBanner className="my-16" />

<NftTransferList className="mt-16" variant="lounge" />
<NftTransferList variant="lounge" />
</MainPageContainer>
</div>
<Footer />
Expand Down
21 changes: 11 additions & 10 deletions apps/web/src/app/(routes)/providers.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
"use client";

import {
type Chain,
// type Chain,
// goerli as starknetGoerli,
mainnet as starknetMainnet,
} from "@starknet-react/chains";
import {
StarknetConfig,
jsonRpcProvider,
// jsonRpcProvider,
publicProvider,
// publicProvider,
} from "@starknet-react/core";
import { ThemeProvider } from "next-themes";
Expand All @@ -32,14 +33,14 @@ const wagmiConfig = createConfig({
},
});

function starknetRpc(chain: Chain) {
if (chain.network === "goerli")
return { nodeUrl: `https://juno.testnet.arkproject.dev/` };
// function starknetRpc(chain: Chain) {
// if (chain.network === "goerli")
// return { nodeUrl: `https://juno.testnet.arkproject.dev/` };

return { nodeUrl: `https://juno.mainnet.arkproject.dev/` };
}
// return { nodeUrl: `https://juno.mainnet.arkproject.dev/` };
// }

// const starknetProvider = publicProvider();
const starknetProvider = publicProvider();

interface ProvidersProps {
children: React.ReactNode;
Expand All @@ -52,8 +53,8 @@ export default function Providers({ children }: ProvidersProps) {
// chains={[starknetGoerli]}
chains={[starknetMainnet]}
connectors={starknetConnectors}
provider={jsonRpcProvider({ rpc: starknetRpc })}
// provider={starknetProvider}
// provider={jsonRpcProvider({ rpc: starknetRpc })}
provider={starknetProvider}
>
<WagmiProvider config={wagmiConfig}>
<WalletModalsProvider>
Expand Down
34 changes: 34 additions & 0 deletions apps/web/src/app/_abis/bridge_l1_abi.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
[
{
"type": "function",
"name": "getWhiteListedCollections",
"inputs": [],
"outputs": [
{
"name": "",
"type": "address[]",
"internalType": "address[]"
}
],
"stateMutability": "view"
},
{
"type": "function",
"name": "isWhiteListed",
"inputs": [
{
"name": "collection",
"type": "address",
"internalType": "address"
}
],
"outputs": [
{
"name": "",
"type": "bool",
"internalType": "bool"
}
],
"stateMutability": "view"
}
]
30 changes: 23 additions & 7 deletions apps/web/src/app/_components/Media.tsx
Original file line number Diff line number Diff line change
@@ -1,23 +1,39 @@
import Image from "next/image";
import { useTheme } from "next-themes";

import { type NftMedia } from "~/server/api/types";
/* eslint-disable @next/next/no-img-element */

interface MediaProps {
alt: string;
className?: string;
height: number;
src: string;
media: NftMedia;
width: number;
}

export default function Media({
alt,
className,
height,
src,
media,
width,
}: MediaProps) {
const extension = src.split(".").pop();
const { resolvedTheme } = useTheme();

if (media.src === undefined || media.src.length === 0) {
return (
<Image
alt={alt}
className={className}
height={height}
src={`/medias/${resolvedTheme === "dark" ? "dark/" : ""}empty_nft.png`}
width={width}
/>
);
}

if (extension === "mp4") {
if (media.format === "video") {
return (
<video
autoPlay
Expand All @@ -27,17 +43,17 @@ export default function Media({
muted
width={width}
>
<source src={src} type="video/mp4" />
<source src={media.src} type="video/mp4" />
Your browser does not support the video tag.
</video>
);
} else {
return (
<Image
<img
alt={alt}
className={className}
height={height}
src={src}
src={media.src}
width={width}
/>
);
Expand Down
Loading
Loading