fix: connector connect and disconnect

.changeset/tasty-donkeys-accept.md

@@ -0,0 +1,5 @@
+---
+'@starknet-react/core': patch
+---
+
+Improve connector disconnect

examples/starknet-react-next/src/components/ConnectWallet.tsx

@@ -1,16 +1,24 @@
-import { useStarknet, InjectedConnector } from '@starknet-react/core'
+import { useStarknet } from '@starknet-react/core'
 
 export function ConnectWallet() {
-  const { account, connect, disconnect } = useStarknet()
+  const { account, connect, disconnect, connectors } = useStarknet()
 
   if (account) {
     return (
       <div>
         <p>Account: {account}</p>
-        <button onClick={() => disconnect(new InjectedConnector())}>Disconnect</button>
+        <button onClick={() => disconnect()}>Disconnect</button>
       </div>
     )
   }
 
-  return <button onClick={() => connect(new InjectedConnector())}>Connect</button>
+  return (
+    <>
+      {connectors.map((connector, idx) => (
+        <button key={idx} onClick={() => connect(connector)}>
+          Connect
+        </button>
+      ))}
+    </>
+  )
 }

packages/core/src/providers/starknet/manager.ts

@@ -8,6 +8,7 @@ import { ConnectorNotFoundError } from '../../errors'
 interface StarknetManagerState {
   account?: string
   connectors: Connector[]
+  connector?: Connector
   library: ProviderInterface
   error?: Error
 }
@@ -22,12 +23,17 @@ interface SetProvider {
   provider?: ProviderInterface
 }
 
+interface SetConnector {
+  type: 'set_connector'
+  connector?: Connector
+}
+
 interface SetError {
   type: 'set_error'
   error: Error
 }
 
-type Action = SetAccount | SetProvider | SetError
+type Action = SetAccount | SetProvider | SetConnector | SetError
 
 function reducer(state: StarknetManagerState, action: Action): StarknetManagerState {
   switch (action.type) {
@@ -37,6 +43,9 @@ function reducer(state: StarknetManagerState, action: Action): StarknetManagerSt
     case 'set_provider': {
       return { ...state, library: action.provider ?? defaultProvider }
     }
+    case 'set_connector': {
+      return { ...state, connector: action.connector }
+    }
     case 'set_error': {
       return { ...state, error: action.error }
     }
@@ -70,6 +79,7 @@ export function useStarknetManager({
       (account) => {
         dispatch({ type: 'set_account', account: account.address })
         dispatch({ type: 'set_provider', provider: account })
+        dispatch({ type: 'set_connector', connector })
       },
       (err) => {
         console.error(err)
@@ -78,24 +88,27 @@ export function useStarknetManager({
     )
   }, [])
 
-  const disconnect = useCallback((connector: Connector) => {
-    connector.disconnect().then(
+  const disconnect = useCallback(() => {
+    if (!state.connector) return
+    state.connector.disconnect().then(
       () => {
         dispatch({ type: 'set_account', account: undefined })
         dispatch({ type: 'set_provider', provider: undefined })
+        dispatch({ type: 'set_connector', connector: undefined })
       },
       (err) => {
         console.error(err)
         dispatch({ type: 'set_error', error: new ConnectorNotFoundError() })
       }
     )
-  }, [])
+  }, [state.connector])
 
   useEffect(() => {
     async function tryAutoConnect(connectors: Connector[]) {
       // Autoconnect priority is defined by the order of the connectors.
       for (let i = 0; i < connectors.length; i++) {
         try {
+          console.log(connectors[i])
           if (!(await connectors[i].ready())) {
             // Not already authorized, try next.
             continue

packages/core/src/providers/starknet/model.ts

@@ -4,7 +4,7 @@ import { Connector } from '../../connectors'
 export interface StarknetState {
   account?: string
   connect: (connector: Connector) => void
-  disconnect: (connector: Connector) => void
+  disconnect: () => void
   library: ProviderInterface
   connectors: Connector[]
   error?: Error