Skip to content

Comments

Minimalistic Asset viewer#20

Open
tonimateos wants to merge 35 commits intomainfrom
assetViewer
Open

Minimalistic Asset viewer#20
tonimateos wants to merge 35 commits intomainfrom
assetViewer

Conversation

@tonimateos
Copy link
Contributor

Added a next.js example to render asset details using the LAOS API

const [errorMessage, setErrorMessage] = useState<string | null>(null);

useEffect(() => {
const fetchNFTDetails = async () => {
Copy link

Choose a reason for hiding this comment

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

can you refactor this and use a hook? -> useNFTDetails hook

import React from "react";
import Image from "next/image";

interface Attribute {
Copy link

Choose a reason for hiding this comment

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

please put the interfaces in a separate file types/...

);
};

function getImageUrl(ipfsUrl: string): string {
Copy link

Choose a reason for hiding this comment

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

move this to a utility file, e.g., utils/ipfs.ts

import client from "@/lib/apolloClient";
import Image from "next/image";

type Attribute = {
Copy link

Choose a reason for hiding this comment

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

please move the types to a separate file /types/...

alt: string;
}

function getImageUrl(ipfsUrl: string): string {
Copy link

Choose a reason for hiding this comment

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

move this to a utility file, e.g., utils/ipfs.ts

}) {
const [nftDetails, setNftDetails] = useState<NFTDetails | null>(null);

useEffect(() => {
Copy link

Choose a reason for hiding this comment

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

please refactor this to use a hook

@@ -0,0 +1,34 @@
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
Copy link

Choose a reason for hiding this comment

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

please avoid using google fonts

import getNFTDetailsQuery from "@/queries/getNFTDetails";
import NFTDetailsRenderer from "@/components/NFTDetailsRenderer";

const SUPPORTED_CHAINS: Record<string, string> = {
Copy link

Choose a reason for hiding this comment

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

move this code to the hook

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants