@pinecone-database/connect-react

Pinecone Connect - React

The Connect to Pinecone widget gets our integration partners started fast with a seamless Pinecone authentication experience. Your users can get started with Pinecone in just 3 clicks.

This library provides a component for rendering the Connect widget embedded in a React app.

This package is under development.

Learn more about becoming a Pinecone integration partner.

Installation

To install this package into your existing React project:

npm i -S @pinecone-database/connect-react

Usage

The component PineconeConnect renders the Connect to Pinecone widget.

PineconeConnect

A component that renders the Connect widget. The onConnect callback is called when the user finishes authorizing the connection. The integrationId prop should be the unique URL slug for your integration.

function PineconeConnect({ integrationId, onConnect }: {
  integrationId?: string;
  onConnect: (apiKey: string) => void;
});

Example

import {PineconeConnect} from '@pinecone-database/connect-react';
import {useState} from 'react';

function ExampleApp() {
  const [apiKey, setApiKey] = useState<string | null>(null);
  return (
    <>
      <div>
        To get started with Example App, first you'll need to set up a Pinecone account.
        <PineconeConnect integrationId="example-app" onConnect={setApiKey} />
      </div>
      {apiKey && <div>Your Pinecone API key is: {apiKey}</div>}
    </>
  );
}

export default ExampleApp;