address review

apibara · Oct 17, 2024 · 4ec809e · 4ec809e
1 parent 0132107
commit 4ec809e
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 42 deletions.
diff --git a/docs/components/demo/change-default-network.tsx b/docs/components/demo/change-default-network.tsx
@@ -1,33 +1,21 @@
 import { type Chain, mainnet, sepolia } from "@starknet-react/chains";
-import {
-  StarknetConfig,
-  publicProvider,
-  useAccount,
-  useDisconnect,
-  useNetwork,
-} from "@starknet-react/core";
-import { useEffect, useState } from "react";
-import { availableConnectors } from "../starknetkit";
+import { publicProvider, useAccount, useNetwork } from "@starknet-react/core";
+import { useState } from "react";
 import { Button } from "../ui/button";
-import { WalletBar } from "../starknet/bar";
+import { DemoContainer } from "../starknet";
 
 export function ChangeDefaultNetwork() {
   const [defaultChain, setDefaultChain] = useState<Chain>(sepolia);
   const chains = [mainnet, sepolia];
   const provider = publicProvider();
 
   return (
-    <StarknetConfig
-      chains={chains}
-      provider={provider}
-      connectors={availableConnectors}
-      defaultChain={defaultChain} // Propagate the defaultChain option here
-    >
+    <DemoContainer hasWallet defaultChainId={defaultChain.id}>
       <ChangeNetworkInner
         defaultChain={defaultChain}
         setDefaultChain={setDefaultChain}
       />
-    </StarknetConfig>
+    </DemoContainer>
   );
 }
 
@@ -38,11 +26,9 @@ function ChangeNetworkInner({
   defaultChain: Chain;
   setDefaultChain: (chain: Chain) => void;
 }) {
-  const { address, isConnected } = useAccount();
-  const { disconnect, error } = useDisconnect();
-
   const { chain } = useNetwork();
   const chains = [sepolia, mainnet];
+  const { address, isConnected } = useAccount();
 
   return (
     <div className="flex flex-col gap-4">
@@ -51,20 +37,6 @@ function ChangeNetworkInner({
         <pre>{isConnected ? "Connected" : "Not Connected"}</pre>
       </div>
 
-      {!isConnected ? (
-        <div className="flex flex-col px-4 border border-primary rounded-xl">
-          <WalletBar />
-        </div>
-      ) : null}
-
-      {isConnected ? (
-        <div className="flex justify-center">
-          <Button onClick={() => disconnect()} className="w-32">
-            Disconnect
-          </Button>
-        </div>
-      ) : null}
-
       <div className="h-full flex flex-col justify-center">
         <p className="font-medium">Current Chain: </p>
         <pre>{chain?.name || "Not connected"}</pre>

diff --git a/docs/components/starknet/index.tsx b/docs/components/starknet/index.tsx
@@ -2,14 +2,16 @@ import { WalletBar } from "./bar";
 import { StarknetProvider } from "./provider";
 
 export function DemoContainer({
+  defaultChainId,
   hasWallet,
   children,
 }: {
+  defaultChainId?: bigint;
   hasWallet?: boolean;
   children: React.ReactNode;
 }) {
   return (
-    <StarknetProvider>
+    <StarknetProvider defaultChainId={defaultChainId}>
       <div className="flex flex-col px-4 border border-primary rounded-xl">
         {hasWallet ? <WalletBar /> : null}
         <div className="py-4">{children}</div>

diff --git a/docs/components/starknet/provider.tsx b/docs/components/starknet/provider.tsx
@@ -9,10 +9,12 @@ import {
 } from "@starknet-react/core";
 
 export function StarknetProvider({
+  defaultChainId,
   children,
   explorer,
 }: {
   children: React.ReactNode;
+  defaultChainId?: bigint;
   explorer?: ExplorerFactory;
 }) {
   const chains = [sepolia, mainnet];
@@ -32,6 +34,7 @@ export function StarknetProvider({
       provider={provider}
       connectors={connectors}
       explorer={explorer}
+      defaultChainId={defaultChainId}
     >
       {children}
     </StarknetConfig>

diff --git a/packages/core/src/context/starknet.tsx b/packages/core/src/context/starknet.tsx
@@ -102,7 +102,7 @@ interface UseStarknetManagerProps {
   explorer?: ExplorerFactory;
   connectors?: Connector[];
   autoConnect?: boolean;
-  defaultChain?: Chain;
+  defaultChainId?: bigint;
 }
 
 function useStarknetManager({
@@ -111,12 +111,14 @@ function useStarknetManager({
   explorer,
   connectors = [],
   autoConnect = false,
-  defaultChain,
+  defaultChainId,
 }: UseStarknetManagerProps): StarknetState & {
   account?: AccountInterface;
   address?: Address;
 } {
-  const defaultChain = defaultChainId ? chains.find((c) => c.id === defaultChainId) ?? chains[0];
+  const defaultChain = defaultChainId
+    ? (chains.find((c) => c.id === defaultChainId) ?? chains[0])
+    : chains[0];
   if (defaultChain === undefined) {
     throw new Error("Must provide at least one chain.");
   }
@@ -185,7 +187,7 @@ function useStarknetManager({
         currentProvider: providerForChain(defaultChain, provider).provider,
       }));
     }
-  }, [defaultChain, connectorRef, provider]);
+  }, [defaultChain, provider]);
   const connect = useCallback(
     async ({ connector }: { connector?: Connector }) => {
       if (!connector) {
@@ -324,7 +326,7 @@ export interface StarknetProviderProps {
   /** Application. */
   children?: React.ReactNode;
   /** Default chain to use when wallet is not connected */
-  defaultChain?: Chain;
+  defaultChainId?: bigint;
 }
 
 /** Root Starknet context provider. */
@@ -335,7 +337,7 @@ export function StarknetProvider({
   explorer,
   autoConnect,
   queryClient,
-  defaultChain,
+  defaultChainId,
   children,
 }: StarknetProviderProps): JSX.Element {
   const { account, address, ...state } = useStarknetManager({
@@ -344,7 +346,7 @@ export function StarknetProvider({
     explorer,
     connectors,
     autoConnect,
-    defaultChain,
+    defaultChainId,
   });
 
   return (