Building a Gemini-Powered AI Chatbot using PydanticAI and Gradio

In this blog post, we'll explore how to build an AI chatbot interface using the Gemini model from Google AI, PydanticAI, and powered by Gradio for the user interface.

About PydanticAI

Pydantic-ai is a Python library that simplifies the process of building and deploying large language model (LLM) applications. It was developed by the creators of the popular Pydantic validation library and is designed to seamlessly integrate with it.

About Google's Gemini

Gemini is Google's most capable and general large language model (LLM). It's a multimodal AI model that can understand and generate text, code, images, audio, video, and more.

About Gradio

Gradio is an open-source Python library that allows you to quickly create user interfaces (UIs) for your machine learning models, APIs, or any arbitrary Python function.

Now, let's move towards the implementation, the fun part.

Setting up the environment

First, we need to install the necessary libraries, for this sample, I have worked on Google Colab notebook, you can use whatever IDE you like that can run Python:

!pip?install?pydantic-ai
!pip?install?nest_asyncio
!pip?install?gradio==5.6.0
!pip?install?python-dotenv
        

Next, we import the required modules:

from?pydantic_ai?import?Agent
from?pydantic_ai.models.gemini?import?GeminiModel
import?asyncio
import?nest_asyncio
import?gradio?as?gr
import?os
from?dotenv?import?load_dotenv
        

We then load our Gemini API key and model name from a .env file, enabling secure storage of sensitive information. Ensure you create a .env file in the same directory as your notebook and populate it with your credentials:

load_dotenv()
GEMINI_API_KEY?=?os.getenv("GEMINI_API_KEY")
MODEL_NAME?=?os.getenv("MODEL_NAME")
        

Finally, we apply nest_asyncio to enable running asynchronous operations within Gradio:

nest_asyncio.apply()
        

Creating the Gemini Agent

Now, let's create the core of our chatbot—the Gemini agent. We define a function agent_response that handles user input and interacts with the Gemini model:

def agent_response(user_input, systemprompt_input):
  agent = Agent(
      GeminiModel(MODEL_NAME, api_key=GEMINI_API_KEY), 
      system_prompt= systemprompt_input 
  )

  result = agent.run_sync(user_input)

  return result.data
        

This function takes the user's question and a system prompt as input. It initializes a Gemini agent, runs the user's query, and returns the AI-generated response. In the above code, the model I used is "gemini-1.5-flash". For the API key, you can generate it at https://aistudio.google.com/app/apikey

Building the Gradio Interface

With the agent ready, we build the user interface using Gradio. We start by defining prompt choices for the user to select how the AI should respond:

prompt_choices?=?{
????"Concise":?"Be?concise,?reply?with?one?sentence.",
????"Explain":?"Explain?in?detail,?reply?with?as?much?as?information?possible."
}
        

Next, we create the main interface structure using Gradio components:

def create_main_interface():
  with gr.Blocks():
      with gr.Row():
          with gr.Column():
              user_input = gr.Textbox(lines = 5,  max_lines=40, label="Enter your question", placeholder="e.g. how to loose weight?")
              systemprompt_input = gr.Dropdown(choices=list(prompt_choices.keys()), label="How to respond?", value=list(prompt_choices.keys())[0])  

              # Button to add the product to the list
              add_btn = gr.Button("Answer")
              answer = gr.Markdown(label="Answer")

      # Event handler
      add_btn.click(
        agent_response,
        inputs=[user_input, systemprompt_input],
        outputs=answer,
      )        

Inside the create_main_interface function, we add a textbox for user input, a dropdown for prompt selection, a button to trigger the AI response, and a markdown component to display the answer. We link the button's click event to the agent_response function.

Launching the Chatbot

Finally, we create the main Gradio blocks, add a title, theme, and logo, and launch the chatbot:

  # Create the main Blocks for the entire interface
  # other themes can be found at:- https://huggingface.co/spaces/gradio/theme-gallery
with gr.Blocks(theme="gstaff/sketch") as demo:
    with gr.Row():
            gr.HTML("""
            <style>
                @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
                body {
                  font-family: 'Roboto', sans-serif;
                }
                h1 {
                  font-size: 22px;
                  color: #7BC039; /* Example color */
                }
                h2 {
                  font-size: 14px;
                  color: #7BC039; /* Example color */
                  padding: 5px;
                  border-radius: 5px;
                  text-align: center;
                }
                .container {
                  display: flex;
                  flex-wrap: wrap;
                }
                }
              </style>

              <div style="display: flex; align-items: center; justify-content: center;">
                  <img src="https://icons.iconarchive.com/icons/iconarchive/incognito-animals/72/Cat-Avatar-icon.png" width="32" height="32" style="margin-right: 10px;">
                  <div>
                      <h2>jam.AI - Just ask me</h2>
                  </div>
              </div> """)

    with gr.Row():
            # Call the function to create the pricing interface
            iface = create_main_interface()

demo.title = "jam.AI"
demo.launch()
        

Now, you have a fully functional AI chatbot powered by Gemini using PydanticAI and Gradio! Users can ask questions, choose a response style, and receive answers generated by the AI model.

This is how it looks:

The above is running on Hugging Face space as well, link:- https://waqas700297-jam-ai.hf.space/

Conclusion

This blog post demonstrated how to leverage the power of Gemini using PydanticAI and Gradio to create an interactive chatbot experience. You can enhance this chatbot by adding features like conversation history, user authentication, and more.

Happy coding!