From 6d6486dbed60ebf5a78bcb9dc94419faa6a14675 Mon Sep 17 00:00:00 2001
From: Andriy <raykage@hotmail.de>
Date: Wed, 2 Nov 2022 17:04:01 +0900
Subject: [PATCH] fixed all user nfts showing before mutated method is called

---
 components/UserTokensGrid.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/components/UserTokensGrid.tsx b/components/UserTokensGrid.tsx
index 4a195b97..a97aefd7 100644
--- a/components/UserTokensGrid.tsx
+++ b/components/UserTokensGrid.tsx
@@ -1,4 +1,4 @@
-import { FC, useEffect } from 'react'
+import { FC, useEffect, useState } from 'react'
 import LoadingCard from './LoadingCard'
 import { useUserTokens } from '@reservoir0x/reservoir-kit-ui'
 import { useInView } from 'react-intersection-observer'
@@ -17,6 +17,7 @@ type Props = {
 }
 
 const UserTokensGrid: FC<Props> = ({ fallback, owner }) => {
+  const [mutated, setMutated] = useState<boolean>(false)
   const userTokensParams: Parameters<typeof useUserTokens>['1'] = {
     limit: 20,
     includeTopBid: true,
@@ -36,7 +37,7 @@ const UserTokensGrid: FC<Props> = ({ fallback, owner }) => {
   })
 
   useEffect(() => {
-    userTokens.mutate()
+    userTokens.mutate().then(() => setMutated(true))
     return () => {
       userTokens.setSize(1)
     }
@@ -65,6 +66,10 @@ const UserTokensGrid: FC<Props> = ({ fallback, owner }) => {
     )
   }
 
+  if (!mutated) {
+    return <div></div>
+  }
+
   return (
     <div className="mx-auto mb-8 grid max-w-[2400px] gap-8 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-4 2xl:grid-cols-5">
       {isFetchingInitialData