ysharma's picture
ysharma HF staff
updated gradio sdk
0858675
---
title: ChatGPT Plugins UI With Langchain
emoji: ๐Ÿ“Š
colorFrom: yellow
colorTo: yellow
sdk: gradio
sdk_version: 3.36.0
app_file: app.py
pinned: false
license: mit
---
Check out the configuration reference at https://huggingface.co./docs/hub/spaces-config-reference
## Steps to add new Plugins to your Langchain-Gradio ChatGPT PLUGIN WebUI
1. **Acquire the API Endpoint**
- You need an API which you can query, and for this example let's consider using a The Bored API.
- **API Endpoint**: [https://www.boredapi.com/api/activity/?type=](https://www.boredapi.com/api/activity/?type=)
2. **Create a Function to Query the API**
- You can access any Gradio demo as an API via the Gradio Python Client.
```python
def bored_api(activity_type) -> str:
'''
Get a random activity to do based on the activity type.
'''
activity_type_list = ["education", "recreational", "social", "diy", "charity", "cooking", "relaxation", "music", "busywork"]
activity_type = activity_type.lower()
if activity_type not in activity_type_list:
activity_type = random.choice(activity_type_list)
api_url = "https://www.boredapi.com/api/activity/?type=" + activity_type
response = requests.get(
api_url
)
return response.json()['activity']
```
3. **Add Function definitions**
- Add the function definition to the `gpt_function_definitions.py` file (simply copy and paste). Don't forget to add function description in docstring.
- Add required imports
```python
from gpt_function_definitions import generate_image, generate_caption, get_news, bored_api
```
4. **Add the function to the Tools list**
- Add a description - describe what your function does. Models like GPT3.5/4 support Function Calling. The OpenAI Functions Agent from Langchain is designed to work with these functions and models.
- Name - add a name of your function, don't include spaces
```python
tools = [
#image generation
...
# Describe an image
...
# Get lattest top news
...
# Bored Api
Tool.from_function(
func=bored_api,
name="bored_api",
description="Get a random activity to do based on the activity type"
# coroutine= ... <- you can specify an async method if desired as well
),
]
```
5. **Update the Chatbot Layout**
- Go to the Blocks Chatbot layout and add a new checkbox for your plugin as:
```python
bored = gr.Checkbox(label="๐Ÿ™„bored", value=False)
```
- Add the new checkbox component (example - <i>bored</i>) to your submit and click events for your chatbot and to the predict function accordingly.
- And also to the `plugins` list in `predict`
```python
plugins = [stable_diff, image_cap, top_news, search, bored]
```
**Thats it! you have added your own brand new CHATGPT Plugin for yourself. Go PLAY!!**