Getting Started

Install

npm install @doodlesteam/flooks

Quick Start

Configure your Flow connection and add a FlowProvider:

import { FlowProvider, configureChains } from "@doodlesteam/flooks";
import Profile from "./Profile";
 
configureChains({
  title: "MyDapp",
  accessNodeApi: "https://rest-testnet.onflow.org",
  discoveryWallet:
    "https://staging.accounts.meetdapper.com/fcl/authn-restricted",
  network: "testnet",
});
 
function App() {
  return (
    <FlowProvider>
      <Profile />
    </FlowProvider>
  );
}

Inside the profile, you can add more hooks to handle connection:

import {
  useFlowAccount,
  useFlowConnect,
  useFlowDisconnect,
} from "@doodlesteam/flooks";
 
function Profile() {
  const { address } = useFlowAccount();
  const { connect } = useFlowConnect();
  const { disconnect } = useFlowDisconnect();
 
  if (address)
    return (
      <div>
        Connected to {address}
        <button onClick={() => disconnect()}>Disconnect</button>
      </div>
    );
  return <button onClick={() => connect()}>Connect Wallet</button>;
}