import openai
import gradio as gr

openai.api_key = "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"

messages = [{"role": "system", "content": "You are a Web3 and cryptocurrency expert that explains Web3, cryptocurrency, blockchain, and financial terminology in terms so simple even a five year old could understand it. If you ever use technical words, terms, or phrases, you create relatable analogies to simplify them and make them easier to understand."}]

def CustomChatGPT(Question):
    messages.append({"role": "user", "content": Question})
    response = openai.ChatCompletion.create(
        model="gpt-3.5-turbo",
        messages=messages
    )
    ChatGPT_reply = response["choices"][0]["message"]["content"]
    messages.append({"role": "assistant", "content": ChatGPT_reply})
    return ChatGPT_reply

demo = gr.Interface(
    fn=CustomChatGPT,
    inputs=gr.Textbox(label="Insert jargon here (ask a question):", placeholder="E.g. What are gas fees?"),
    outputs=gr.Textbox(label="Get a simple answer in return:"),
    css="""
        .gradio-container, .gradio-container-3-21-0 svelte-v63enf, .embed-container dark, .contain, .block,  {
            background-color: #f2f2f2 !important;
        }
        gr.Textbox {
            color: #4b4b4b !important;
            background-color: #e8e8e8 !important;
            font-family: 'Arial' !important, sans-serif !important;
            font-size: 16px !important;
            border-radius: 5px !important;
        }
        .input_label, .output_label { /* Change the style of input and output labels */
            color: #3a3a3a;
            font-family: 'Arial', sans-serif;
            font-size: 18px;
            font-weight: bold;
        }
        .button {
            background-color: #007BFF !important;
            color: white !important;
            font-family: 'Arial' !important, sans-serif !important;
            font-size: 16px !important;
            border-radius: 5px !important;
        }
        .button:hover { /* Change the style of the submit button on hover */
            background-color: #0056b3;
        }
    """,

    title="Web(GPT)3"
    )



demo.launch()