Kinora Provider

Wrap your App.

Wrap your app with the Kinora Provider Component to correctly initialize the Kinora instance, passing in the player's authenticated Lens Apollo Client. In the case of utilizing NextJS, this component should be placed in the App.tsx pages folder of your application.

Make sure to also set and configure the LivePeer Config.

import { KinoraProvider } from "kinora-sdk";
import { apolloClient } from "../../lib/lens/client";
import { createReactClient, studioProvider, LivepeerConfig,} from "@livepeer/react";

const livepeerClient = createReactClient({
  provider: studioProvider({
    apiKey: process.env.LIVEPEER_STUDIO_KEY!,
  }),
});
 
function App() {
  return (
    <LivepeerConfig client={livepeerClient}>
      <KinoraProvider playerAuthedApolloClient={apolloClient}  ipfsConfig={{
    uploadEndpoint: "https://api.pinata.cloud/pinning/pinJSONToIPFS",
    gateway: "https://gateway.pinata.cloud",
    headers: { Authorization: "Bearer YOUR_JWT" }
  }}>
        <Component {...pageProps} />
      </KinoraProvider>
    </LivepeerConfig>
  )
}

Kinora Provider Props

/* Lens authenticated Apollo Client. This can be the same client used for other Lens interactions within your App that the player is Authed for. It is used for enabling the Player to interact with the Quest publication Open Action.*/
playerAuthedApolloClient: ApolloClient<NormalizedCacheObject>;

/* IPFS Config. The upload endpoint, gateway and required auth headers for your IPFS client i.e. Infura, Pinata etc.*/
ipfsConfig: {
  uploadEndpoint: string;
  gateway: string;
  headers?: Record<string, string>;
};