app.py

import gradio as gr
import anthropic
import base64
import httpx
import os
import time
import random

client = anthropic.Anthropic(
    # defaults to os.environ.get("ANTHROPIC_API_KEY")
    api_key="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",
)

MODEL_NAME = "claude-3-opus-20240229"


def print_like_dislike(x: gr.LikeData):
    print(x.index, x.value, x.liked)

def add_message(history, message):
    if message["files"]:
        for x in message["files"]:
            with open(x, "rb") as image_file:
                binary_data = image_file.read()
                base_64_encoded_data = base64.b64encode(binary_data)
                base64_string = base_64_encoded_data.decode('utf-8')
                image_media_type = "image/png"
                # message["text"] = "What is present in the uploaded image" if message["text"] == None else message["text"]
                message_list = [{
                "role": 'user',"content": 
                [{"type": "image", "source": {"type": "base64", "media_type": image_media_type ,"data": base64_string}},
                 {"type": "text", "text": message["text"] }
                ]}]
                
                response = client.messages.create(model=MODEL_NAME,  max_tokens=1024, messages=message_list).content[0].text
                history.append((x, response))

        
    elif message["text"] is not None:
        
        response = client.messages.create( model=MODEL_NAME, max_tokens=1024, 
                                          messages=[ {"role": "user", "content": message["text"]}] ).content[0].text
        history.append((message["text"], response))
        
    return history, gr.MultimodalTextbox(value=None, interactive=False)

def bot(history):
    response = history[-1][1]
    history[-1][1] = ""
    for character in response:        
        history[-1][1] += character
        time.sleep(0.01)
        yield history


with gr.Blocks() as demo:
    chatbot = gr.Chatbot(
        [],
        elem_id="chatbot",
        bubble_full_width=False,
    )

    chat_input = gr.MultimodalTextbox(interactive=True, file_types=["image"], placeholder="Enter message or upload image file in png ...", show_label=True)

    chat_msg = chat_input.submit(add_message, [chatbot, chat_input], [chatbot, chat_input])
    bot_msg = chat_msg.then(bot, chatbot, chatbot, api_name="bot_response")
    bot_msg.then(lambda: gr.MultimodalTextbox(interactive=True), None, [chat_input])

    chatbot.like(print_like_dislike, None, None)

demo.queue()
demo.launch()