Allow resetting nftCollection to shortcut polling (coral-xyz#1960)

onsol-labs · Dec 25, 2022 · d31e6a1 · d31e6a1
1 parent 2b3b13d
commit d31e6a1
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 10 deletions.
diff --git a/packages/app-extension/src/index.tsx b/packages/app-extension/src/index.tsx
@@ -2,7 +2,6 @@ import React, { lazy, Suspense } from "react";
 import ReactDOM from "react-dom";
 import { openPopupWindow } from "@coral-xyz/common/dist/esm/browser";
 import { BACKPACK_FEATURE_POP_MODE } from "@coral-xyz/common/dist/esm/generated-config";
-import { Loading } from "@coral-xyz/react-common/dist/esm/components/base/Loading";
 
 import "./index.css";
 
@@ -35,7 +34,7 @@ document.addEventListener("keypress", async function onPress(event) {
 //
 ReactDOM.render(
   <React.StrictMode>
-    <Suspense fallback={<Loading />}>
+    <Suspense fallback={null}>
       <App />
     </Suspense>
     <Suspense fallback={null}>

diff --git a/packages/recoil/src/atoms/nft.tsx b/packages/recoil/src/atoms/nft.tsx
@@ -97,13 +97,14 @@ const nftMetadata = selector<Map<string, Nft>>({
  * Poll local NFT data and create list of all as source for nftById(s) atoms
  * This atom breaks to global app rerender due to blockchain data polling.
  */
-const nftCollections = atom<{
+export const nftCollections = atom<{
   [Blockchain.SOLANA]: NftCollection[] | null;
   [Blockchain.ETHEREUM]: NftCollection[] | null;
 }>({
   key: "nftCollections",
   effects: [
-    ({ setSelf, getPromise }) => {
+    ({ setSelf, onSet, getPromise }) => {
+      let timeout;
       const pollLocalData = async (isInitial?: boolean) => {
         try {
           const [solana, ethereum, currentValue] = await Promise.all([
@@ -122,13 +123,23 @@ const nftCollections = atom<{
           // ensure polling continues even on error.
           console.error(e);
         }
-        setTimeout(() => requestAnimationFrame(() => pollLocalData()), 1000);
+        timeout = setTimeout(
+          () => requestAnimationFrame(() => pollLocalData()),
+          1000
+        );
       };
       setSelf({
         [Blockchain.SOLANA]: null,
         [Blockchain.ETHEREUM]: null,
       });
       pollLocalData(true);
+      onSet(() => {
+        clearTimeout(timeout);
+        pollLocalData();
+      });
+      return () => {
+        clearTimeout(timeout);
+      };
     },
   ],
 });
diff --git a/packages/recoil/src/context/Notifications.tsx b/packages/recoil/src/context/Notifications.tsx
@@ -1,11 +1,8 @@
 import React, { useEffect } from "react";
-import type {
-  Blockchain,
-  FEATURE_GATES_MAP,
-  Notification,
-} from "@coral-xyz/common";
+import type { FEATURE_GATES_MAP, Notification } from "@coral-xyz/common";
 import {
   BackgroundSolanaConnection,
+  Blockchain,
   CHANNEL_POPUP_NOTIFICATIONS,
   ChannelAppUi,
   getLogger,
@@ -82,6 +79,13 @@ export function NotificationsProvider(props: any) {
   const setKeyringStoreState = useSetRecoilState(atoms.keyringStoreState);
   const setActiveUser = useSetRecoilState(atoms.user);
   const resetAllUsers = useResetRecoilState(atoms.allUsers);
+  const _setNftCollections = useSetRecoilState(atoms.nftCollections);
+  const resetNftCollections = () => {
+    _setNftCollections({
+      [Blockchain.SOLANA]: null,
+      [Blockchain.ETHEREUM]: null,
+    });
+  };
   // Preferences.
   const setPreferences = useSetRecoilState(atoms.preferences);
   const setFeatureGates = useSetRecoilState(atoms.featureGates);
@@ -570,6 +574,7 @@ export function NotificationsProvider(props: any) {
       setWalletData(notif.data.walletData);
       setActiveUser(notif.data.user);
       resetAllUsers();
+      resetNftCollections();
     };
 
     const handleRemovedUser = (notif: Notification) => {