Code Monkey home page Code Monkey logo

openai-assistant-gql-demo's Introduction

Kasper's AI Extension Banner

GraphQL and OpenAI Assistant Experiment

This repository contains a SvelteKit application that integrates OpenAI's GPT with GraphQL to provide an interactive assistant experience. Users can ask questions about a GraphQL schema, and the assistant will provide responses.

Features

  • GraphQL Integration: Communicates with a GraphQL API to fetch and display data based on user queries.
  • OpenAI Assistant: Leverages OpenAI's API to understand and respond to user queries.
  • Interactive UI: Provides a chat-like interface for users to interact with the GraphQL assistant.

Example

Example

Getting Started

Prerequisites

  • Node.js and npm installed.
  • An OpenAI API key.

Installation

  1. Clone the repository:
git clone https://github.com/kasperlaursen/openai-assistant-gql-demo.git
  1. Navigate to the project directory:
cd openai-assistant-gql-demo
  1. Install dependencies:
npm install
  1. Create a .env file at the root of your project and add your OpenAI API key:
OPENAI_API_KEY=your_openai_api_key_here

Setup the Assistant and Update the ID

To configure your assistant with the specific capabilities required for interacting with the Star Wars GraphQL API, follow these steps:

  1. Download the GraphQL Schema: Download the full GraphQL schema from the following Apollo Studio link: Star Wars SWAPI GraphQL Schema.

  2. Configure the Assistant: Set up your assistant with the instructions provided.

You are an helpful assistant with knowledge about the Star Wars GraphQL api and its full schema.
You will help the user gain information about the schema, as well as generating queries for the graphql endpoint based on the schema.
The full GraphQL schema is star-wars-swapi.graphql.
  1. Update the Assistant ID: In your code, ensure you have the correct ASSISTANT_ID set to link to your configured OpenAI assistant. This ID connects your code with the specific assistant instance trained for this task.

  2. Upload the GraphQL Schema: Upload the star-wars-swapi.graphql schema file to your application's environment where the assistant can access it.

  3. Configure Tool Functions: Utilize the callWithQuery function as a bridge between your assistant and the GraphQL API. This function should be defined to accept a query parameter, representing the GraphQL query to be executed against the Star Wars API.

Here's the JSON schema for the callWithQuery function for your reference:

{
	"name": "callWithQuery",
	"description": "Sends a GraphQL Query request to the api, and returns the result.",
	"parameters": {
		"type": "object",
		"properties": {
			"query": {
				"type": "string",
				"description": "The graphql query to execute"
			}
		},
		"required": ["query"]
	}
}
  1. Integrate with Code Interpreter and Retrieval Tools: Make sure your setup includes a code interpreter for the dynamic execution of the code snippets and a retrieval mechanism to fetch information based on user requests.

After completing these steps, your assistant should be ready to help users explore the Star Wars GraphQL schema efficiently.

Running the Application

Start the development server:

npm run dev

Visit http://localhost:3000 in your browser to view the application.

Usage

  • Type your questions about the GraphQL schema into the input field.
  • Press 'Send' to submit your question.
  • View the assistant's response in the chat interface.

Contributing

Contributions are welcome! Please feel free to submit a pull request.

Attribution

Ui by: v0.dev

openai-assistant-gql-demo's People

Contributors

kasperlaursen avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.