Guides
Icon BrandGithubIcon BrandTwitterIcon BrandDiscord

Icon LinkConnecting

Icon LinkRequesting a Connection

Before interacting with the wallet, you need to request a connection, which will authorize your application to execute other actions. You can do this by calling the connect() method on the window.fuel object. 

const isConnected = await fuel.connect();
console.log("Connection response", isConnected);

To disconnect, use the disconnect() method. 

await fuel.disconnect();

Icon LinkChecking for a Connection

To check if the user's wallet is already connected, you can use the isConnected() method. 

const isConnected = await fuel.isConnected();
expect(isConnected).toBeTruthy();

Icon LinkListening to Connection Events

The connect() method returns a promise. If you prefer to do it in an async way, you can use fuel.on('connection', () => void) to listen for changes in the connection. 

fuel?.on(fuel.events.connection, handleConnection);
return () => {
  fuel?.off(fuel.events.connection, handleConnection);
};

Icon LinkWith React

In a React app, you can use the useIsConnected hook below to check if the user's wallet is connected. This hook depends on the useFuel hook on the Getting Started page. 

import { useEffect, useState } from "react";
 
import { useFuel } from "./useFuel";
 
export function useIsConnected() {
  const [fuel] = useFuel();
  const [isConnected, setIsConnected] = useState(false);
 
  useEffect(() => {
    async function handleConnection() {
      const isConnected = await fuel.isConnected();
      setIsConnected(isConnected);
    }
 
    if (fuel) {
      handleConnection();
    }
 
    /* eventConnection:start */
    fuel?.on(fuel.events.connection, handleConnection);
    return () => {
      fuel?.off(fuel.events.connection, handleConnection);
    };
    /* eventConnection:end */
  }, [fuel]);
 
  return [isConnected];
}

Here is how you can use the useIsConnected hook in a component: 

const [isConnected] = useIsConnected();

Was this page helpful?

Icon HelpCircleAsk a question in the forum. Icon Link
Icon ListDetailsOn this page