KinoraSDK
  • Overview
  • Quickstart
  • Contracts
  • Subgraphs
  • Open Source Code
  • SDK Reference
    • Envoker
      • Instantiate Envoker
      • Instantiate New Quest
      • Terminate & Withdraw
      • Delete Quest
      • Verify Player Milestone
    • Dispatch
      • Instantiate Dispatch
      • Join Quest
      • Milestone Eligibility Check
      • Complete Milestone
    • Kinora Player Wrapper
      • Kinora Provider
      • Kinora Player Wrapper
      • Send Metrics On-Chain
    • Helpers
  • Live
    • Quest No Code
    • Cypher Search
    • Chromadin
  • Architecture
    • Data Corruption Mitigation
  • Resources
    • Issues
    • Testing
    • Contributors
    • About the Devs
    • Storefront
  • Github
  • Livepeer Developer Docs
Powered by GitBook
On this page
  1. SDK Reference
  2. Kinora Player Wrapper

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}>
        <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>;
PreviousKinora Player WrapperNextKinora Player Wrapper

Last updated 1 year ago