wip: update ts sdk version (#200)

covalenthq · Sep 20, 2024 · a34548a · a34548a
1 parent 7e18be0
commit a34548a
Show file tree

Hide file tree

Showing 83 changed files with 613 additions and 471 deletions.
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -6,7 +6,7 @@
     "singleQuote": false,
     "quoteProps": "as-needed",
     "jsxSingleQuote": false,
-    "trailingComma": "es5",
+    "trailingComma": "all",
     "bracketSpacing": true,
     "bracketSameLine": false,
     "arrowParens": "always",

diff --git a/.storybook/manager.ts b/.storybook/manager.ts
@@ -5,7 +5,8 @@ export const defaultTheme: ThemeVars = {
     ...themes.dark,
     appBg: "black",
     colorSecondary: "#FF4C8B",
-    brandImage: "../src/static/goldrush-powered-by-covalent.svg",
+    brandImage:
+        "https://github.com/covalenthq/goldrush-kit/blob/main/src/static/goldrush-powered-by-covalent.svg",
     base: "light",
     brandTitle: "GoldRush Kit - powered by Covalent",
     brandUrl: "https://github.com/covalenthq/goldrush-kit/",

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -82,7 +82,7 @@
         "vite-plugin-dts": "^3.8.2"
     },
     "dependencies": {
-        "@covalenthq/client-sdk": "^2.0.3",
+        "@covalenthq/client-sdk": "^2.1.1",
         "@radix-ui/react-avatar": "^1.0.4",
         "@radix-ui/react-checkbox": "^1.0.4",
         "@radix-ui/react-dialog": "^1.0.5",

diff --git a/src/components/Atoms/Address/Address.stories.tsx b/src/components/Atoms/Address/Address.stories.tsx
@@ -15,6 +15,6 @@ export const Address: Story = {
     args: {
         address: "0xd8da6bf26964af9d7eed9e03e53415d37aa96045",
         show_copy_icon: true,
-        actionable_address: (address: string) => storyAction(address),
+        actionable_address: (address) => storyAction(address),
     },
 };
diff --git a/src/components/Atoms/Address/Address.tsx b/src/components/Atoms/Address/Address.tsx
@@ -17,6 +17,10 @@ export const Address: React.FC<AddressProps> = ({
     avatar = null,
     actionable_address = () => null,
 }) => {
+    if (!address) {
+        return <></>;
+    }
+
     const [showCopy, setShowCopy] = useState<boolean>(false);
     const { toast } = useToast();
 
@@ -39,7 +43,7 @@ export const Address: React.FC<AddressProps> = ({
 
                 {actionableWrapper(
                     actionable_address(address),
-                    label?.trim() || truncate(address)
+                    label?.trim() || truncate(address),
                 )}
 
                 {show_copy_icon && (

diff --git a/src/components/Atoms/AddressAvatar/AddressAvatar.tsx b/src/components/Atoms/AddressAvatar/AddressAvatar.tsx
@@ -51,7 +51,7 @@ export const AddressAvatar: React.FC<AddressAvatarProps> = ({
 
     const BG_COLOR = useMemo<React.CSSProperties["backgroundColor"]>(
         () => stringToColor(address),
-        [address]
+        [address],
     );
 
     return (

diff --git a/src/components/Atoms/AddressCard/AddressCard.stories.tsx b/src/components/Atoms/AddressCard/AddressCard.stories.tsx
@@ -15,6 +15,6 @@ export const AddressCard: Story = {
     args: {
         address: "0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045",
         avatar: {},
-        actionable_address: (address: string) => storyAction(address),
+        actionable_address: (address) => storyAction(address),
     },
 };
diff --git a/src/components/Atoms/NFT/NFT.stories.tsx b/src/components/Atoms/NFT/NFT.stories.tsx
@@ -52,6 +52,6 @@ export const NFT: Story = {
                 value: "Passion Red",
             },
         ],
-        actionable_contract: (address: string) => storyAction(address),
+        actionable_contract: (address) => storyAction(address),
     },
 };
diff --git a/src/components/Atoms/NFT/NFT.tsx b/src/components/Atoms/NFT/NFT.tsx
@@ -25,7 +25,7 @@ export const NFT: React.FC<NFTProps> = ({
 
     const chain = useMemo<ChainItem | null>(
         () => chains?.find((o) => o.name === chain_name) ?? null,
-        [chains, chain_name]
+        [chains, chain_name],
     );
 
     return (
@@ -44,7 +44,7 @@ export const NFT: React.FC<NFTProps> = ({
                         <TokenAvatar
                             only_primary
                             size={GRK_SIZES.EXTRA_SMALL}
-                            chain_color={chain.color_theme.hex}
+                            chain_color={chain.color_theme?.hex}
                             primary_url={chain?.logo_url}
                         />
                     </div>
@@ -56,7 +56,7 @@ export const NFT: React.FC<NFTProps> = ({
             <CardDetail
                 heading={actionableWrapper(
                     actionable_contract(collection_address || ""),
-                    collection_name?.toUpperCase() ?? null
+                    collection_name?.toUpperCase() ?? null,
                 )}
                 content={token_id ? `#${token_id}` : null}
                 wrapperClassName="p-2 !text-left"

diff --git a/src/components/Atoms/Pool/Pool.stories.tsx b/src/components/Atoms/Pool/Pool.stories.tsx
@@ -20,6 +20,6 @@ export const Pool: Story = {
             "https://logos.covalenthq.com/tokens/1/0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2.png",
         token_1_ticker_symbol: "WETH",
         pool_address: "0x66a0f676479cee1d7373f3dc2e2952778bff5bd6",
-        actionable_pool: (address: string) => storyAction(address),
+        actionable_pool: (address) => storyAction(address),
     },
 };
diff --git a/src/components/Atoms/Pool/Pool.tsx b/src/components/Atoms/Pool/Pool.tsx
@@ -28,7 +28,7 @@ export const Pool: React.FC<PoolProps> = ({
 
             {actionableWrapper(
                 actionable_pool(pool_address),
-                `${token_0_ticker_symbol}-${token_1_ticker_symbol}`
+                `${token_0_ticker_symbol}-${token_1_ticker_symbol}`,
             )}
         </div>
     );

diff --git a/src/components/Atoms/Timestamp/Timestamp.tsx b/src/components/Atoms/Timestamp/Timestamp.tsx
@@ -8,11 +8,15 @@ export const Timestamp: React.FC<TimestampProps> = ({
     defaultType = "relative",
     dynamic = true,
 }) => {
+    if (!timestamp) {
+        return <></>;
+    }
+
     const [relativeTime, setRelativeTime] = useState<boolean>(
-        defaultType === "relative"
+        defaultType === "relative",
     );
     const [parsedTime, setParsedTime] = useState<string>(
-        timestampParser(timestamp, relativeTime ? "relative" : "descriptive")
+        timestampParser(timestamp, relativeTime ? "relative" : "descriptive"),
     );
 
     useEffect(() => {
@@ -23,8 +27,8 @@ export const Timestamp: React.FC<TimestampProps> = ({
                 setParsedTime(
                     timestampParser(
                         timestamp,
-                        relativeTime ? "relative" : "descriptive"
-                    )
+                        relativeTime ? "relative" : "descriptive",
+                    ),
                 );
             }, 1000);
         }
@@ -39,7 +43,10 @@ export const Timestamp: React.FC<TimestampProps> = ({
     const handleToggle = useCallback((isRelative: boolean) => {
         setRelativeTime(!isRelative);
         setParsedTime(
-            timestampParser(timestamp, !isRelative ? "relative" : "descriptive")
+            timestampParser(
+                timestamp,
+                !isRelative ? "relative" : "descriptive",
+            ),
         );
     }, []);
 

diff --git a/src/components/Atoms/TokenAvatar/TokenAvatar.tsx b/src/components/Atoms/TokenAvatar/TokenAvatar.tsx
@@ -51,7 +51,7 @@ export const TokenAvatar: React.FC<TokenAvatarProps> = ({
             await themedSvg(
                 primaryRef,
                 primary_url || "",
-                DefaultToken.toString()
+                DefaultToken.toString(),
             );
         })();
     }, [primary_url, primaryRef]);
@@ -62,7 +62,7 @@ export const TokenAvatar: React.FC<TokenAvatarProps> = ({
                 await themedSvg(
                     secondaryRef,
                     secondary_url || "",
-                    DefaultToken.toString()
+                    DefaultToken.toString(),
                 );
             }
         })();

diff --git a/src/components/Molecules/Address/AddressActivityDetails/AddressActivityDetails.tsx b/src/components/Molecules/Address/AddressActivityDetails/AddressActivityDetails.tsx
@@ -4,6 +4,7 @@ import { Skeleton } from "@/components/ui/skeleton";
 import {
     GRK_SIZES,
     DEFAULT_ERROR_MESSAGE,
+    FALLBACK_ERROR,
 } from "@/utils/constants/shared.constants";
 import { type Option, None, Some } from "@/utils/option";
 import { useGoldRush } from "@/utils/store";
@@ -25,7 +26,7 @@ export const AddressActivityDetails: React.FC<AddressActivityDetailsProps> = ({
     const [maybeResult, setMaybeResult] =
         useState<Option<ChainActivityEvent[] | null>>(None);
     const [errorMessage, setErrorMessage] = useState<string | null>(
-        initialErrorMessage
+        initialErrorMessage,
     );
 
     useEffect(() => {
@@ -51,15 +52,18 @@ export const AddressActivityDetails: React.FC<AddressActivityDetailsProps> = ({
                             address.trim(),
                             {
                                 testnets: true,
-                            }
+                            },
                         );
                     if (error.error) {
                         throw error;
                     }
+                    if (!data?.items) {
+                        throw FALLBACK_ERROR;
+                    }
                     setMaybeResult(new Some(data.items));
                 } catch (error: GoldRushResponse<null> | any) {
                     setErrorMessage(
-                        error?.error_message ?? DEFAULT_ERROR_MESSAGE
+                        error?.error_message ?? DEFAULT_ERROR_MESSAGE,
                     );
                     setMaybeResult(new Some(null));
                     console.error(error);

diff --git a/src/components/Molecules/Address/AddressActivityList/AddressActivityList.tsx b/src/components/Molecules/Address/AddressActivityList/AddressActivityList.tsx
@@ -5,6 +5,7 @@ import { IconWrapper } from "@/components/Shared";
 import {
     GRK_SIZES,
     DEFAULT_ERROR_MESSAGE,
+    FALLBACK_ERROR,
 } from "@/utils/constants/shared.constants";
 import { type Option, None, Some } from "@/utils/option";
 import { useGoldRush } from "@/utils/store";
@@ -25,7 +26,7 @@ export const AddressActivityList: React.FC<AddressActivityListProps> = ({
     const [maybeResult, setMaybeResult] =
         useState<Option<ChainActivityEvent[] | null>>(None);
     const [errorMessage, setErrorMessage] = useState<string | null>(
-        initialErrorMessage
+        initialErrorMessage,
     );
 
     useEffect(() => {
@@ -51,15 +52,18 @@ export const AddressActivityList: React.FC<AddressActivityListProps> = ({
                             address.trim(),
                             {
                                 testnets: true,
-                            }
+                            },
                         );
                     if (error.error) {
                         throw error;
                     }
+                    if (!data?.items) {
+                        throw FALLBACK_ERROR;
+                    }
                     setMaybeResult(new Some(data.items));
                 } catch (error: GoldRushResponse<null> | any) {
                     setErrorMessage(
-                        error?.error_message ?? DEFAULT_ERROR_MESSAGE
+                        error?.error_message ?? DEFAULT_ERROR_MESSAGE,
                     );
                     setMaybeResult(new Some(null));
                     console.error(error);
@@ -85,7 +89,7 @@ export const AddressActivityList: React.FC<AddressActivityListProps> = ({
                         only_primary={true}
                         primary_url={row.original.logo_url}
                         size={GRK_SIZES.EXTRA_EXTRA_SMALL}
-                        chain_color={row.original.color_theme.hex}
+                        chain_color={row.original.color_theme?.hex}
                     />
                     {row.getValue("label")}
                 </div>

diff --git a/src/components/Molecules/Address/AddressDetails/AddressDetails.stories.tsx b/src/components/Molecules/Address/AddressDetails/AddressDetails.stories.tsx
@@ -15,6 +15,6 @@ export const AddressDetails: Story = {
     args: {
         address: "0xf15689636571dba322b48E9EC9bA6cFB3DF818e1",
         chain_name: "eth-mainnet",
-        actionable_transaction: (token: string) => storyAction(token),
+        actionable_transaction: (token) => storyAction(token),
     },
 };