Skip to content

Commit

Permalink
lint
Browse files Browse the repository at this point in the history
  • Loading branch information
nguyenlejoe committed Dec 13, 2023
1 parent dfebbf1 commit 97094ad
Show file tree
Hide file tree
Showing 3 changed files with 61 additions and 53 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ export const NFTFloorPriceView: React.FC<NFTFloorPriceViewProps> = ({
});

return (
<div className="rounded border p-4 min-h-[25rem] w-full">
<div className="min-h-[25rem] w-full rounded border p-4">
<div className="pb-4">
<TypographyH4>Floor Price</TypographyH4>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ export const NFTSalesCountView: React.FC<NFTSalesCountViewProps> = ({
});

return (
<div className="rounded border p-4 min-h-[20rem] w-full">
<div className="min-h-[20rem] w-full rounded border p-4">
<div className="pb-4">
<TypographyH4>Sales History</TypographyH4>
</div>
Expand Down
110 changes: 59 additions & 51 deletions src/components/Organisms/NFTs/NFTDetailView/NFTDetailView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,72 +30,80 @@ export const NFTDetailView: React.FC<NFTDetailViewProps> = ({
})();
}, [chain_name, collection_address, token_id]);


return (
<div className="w-full">

<div className="w-full">
{maybeResult.match({
None: () => <div className="flex gap-2">
<Skeleton size={GRK_SIZES.LARGE}/> <Skeleton size={GRK_SIZES.LARGE}/>
</div>,
None: () => (
<div className="flex gap-2">
<Skeleton size={GRK_SIZES.LARGE} />{" "}
<Skeleton size={GRK_SIZES.LARGE} />
</div>
),
Some: (result) => {
return <TypographyH1>
{result.contract_name} #
{result.nft_data.token_id?.toString()}{" "}
</TypographyH1>
return (
<TypographyH1>
{result.contract_name} #
{result.nft_data.token_id?.toString()}{" "}
</TypographyH1>
);
},
})}


<div className="mt-4 flex gap-4">
{maybeResult.match({
None: () => <div className="max-w-[30rem] rounded border ">
<div className="animate-pulse rounded bg-accent-foreground w-[30rem] h-[30rem]"/>
None: () => (
<div className="max-w-[30rem] rounded border ">
<div className="h-[30rem] w-[30rem] animate-pulse rounded bg-accent-foreground" />

<div className="mt-2 p-4">
<TypographyH4>Attributes</TypographyH4>
<div className="mt-2 p-4">
<TypographyH4>Attributes</TypographyH4>

<div className="mt-2 flex flex-wrap gap-4">
{[1, 2, 3, 4, 5, 6, 7, 8].map((o, i) => {
return (
<Skeleton
key={i}
size={GRK_SIZES.LARGE}
/>
);
})}
</div>
</div>
</div>,
Some: (result) => {
return <div className="max-w-[30rem] rounded border ">
<img
className="rounded-t"
src={result.nft_data.external_data.image_512}
/>

<div className="mt-2 p-4">
<TypographyH4>Attributes</TypographyH4>

<div className="mt-2 flex flex-wrap gap-4">
{result.nft_data.external_data?.attributes.map(
(attrs, i) => {
<div className="mt-2 flex flex-wrap gap-4">
{[1, 2, 3, 4, 5, 6, 7, 8].map((o, i) => {
return (
<div
<Skeleton
key={i}
className="rounded border bg-accent-foreground/30 p-2"
>
<p className="text-muted-foreground">
{attrs.trait_type}
</p>
<p>{attrs.value}</p>
</div>
size={GRK_SIZES.LARGE}
/>
);
}
)}
})}
</div>
</div>
</div>
</div>
),
Some: (result) => {
return (
<div className="max-w-[30rem] rounded border ">
<img
className="rounded-t"
src={
result.nft_data.external_data.image_512
}
/>

<div className="mt-2 p-4">
<TypographyH4>Attributes</TypographyH4>

<div className="mt-2 flex flex-wrap gap-4">
{result.nft_data.external_data?.attributes.map(
(attrs, i) => {
return (
<div
key={i}
className="rounded border bg-accent-foreground/30 p-2"
>
<p className="text-muted-foreground">
{attrs.trait_type}
</p>
<p>{attrs.value}</p>
</div>
);
}
)}
</div>
</div>
</div>
);
},
})}
<div className=" flex w-full flex-col gap-4">
Expand Down

0 comments on commit 97094ad

Please sign in to comment.