Skip to content

Lens Identity

Lens identity allows you to use Open Frames that support Lens.

Requirements

In order to use Lens identity you need to install @rainbow-me/rainbowkit, @lens-protocol/client, viem and wagmi dependencies.

npm
npm install @rainbow-me/rainbowkit @lens-protocol/client viem wagmi

Usage

import {
  useLensFrameContext,
  useLensIdentity,
} from "@frames.js/render/identity/lens";
import { FrameUI } from "@frames.js/render/ui";
import { useFrame } from "@frames.js/render/use-frame";
import { WebStorage } from "@frames.js/render/identity/storage";
 
export function MyFrame() {
  const lensFrameContext = useLensFrameContext({
    fallbackContext: {
      pubId: "0x01-0x01",
    },
  });
  const signerState = useLensIdentity({
    // WebStorage is default value for storage option. It uses local storage by default.
    // You can implement your own storage that implements the Storage interface from @frames.js/render/identity/types.
    // storage: new WebStorage(),
  });
  const frameState = useFrame({
    homeframeUrl: "...", // url to frame
    frameActionProxy: "/frames",
    frameGetProxy: "/frames",
    frameContext: lensFrameContext.frameContext,
    signerState,
    specification: "openframes",
  });
 
  return <FrameUI frameState={frameState} />;
}

Please see our guide on how to use Headless UI, useFrame() and Storage.