import gradio as gr
# from huggingface_hub import InferenceClient
from openai import OpenAI
import os
openai_api_key = os.getenv('api_key')
openai_api_base = os.getenv('url')
model_name = "weblab-GENIAC/Tanuki-8x8B-dpo-v1.0"
"""
For more information on `huggingface_hub` Inference API support, please check the docs: https://huggingface.co/docs/huggingface_hub/v0.22.2/en/guides/inference
"""
# client = InferenceClient("HuggingFaceH4/zephyr-7b-beta")
client = OpenAI(
    api_key=openai_api_key,
    base_url=openai_api_base,
)


def respond(
    message,
    history: list[tuple[str, str]],
    # system_message,
    max_tokens,
    temperature,
    top_p,
):
    messages = [
        {"role": "system", "content": "以下は、タスクを説明する指示です。要求を適切に満たす応答を書きなさい。"}]

    for val in history:
        if val[0]:
            messages.append({"role": "user", "content": val[0]})
        if val[1]:
            messages.append({"role": "assistant", "content": val[1]})

    messages.append({"role": "user", "content": message})

    response = ""

    for message in client.chat.completions.create(
        model=model_name,
        messages=messages,
        max_tokens=max_tokens,
        stream=True,
        temperature=temperature,
        top_p=top_p,
    ):
        token = message.choices[0].delta.content

        # response += token
        if token is not None:
            response += (token)
        yield response


"""
For information on how to customize the ChatInterface, peruse the gradio docs: https://www.gradio.app/docs/chatinterface
"""

# カスタムCSS
custom_css = """
#chatbox {
    height: 600px; /* 高さを調整 */
    overflow-y: auto; /* 縦方向のスクロールを可能に */
}

.gradio-chatbot .message {
    max-width: 80%; /* チャットボックスの横幅調整 */
    margin-bottom: 20px; /* メッセージ間のマージン調整 */
}
"""

demo = gr.ChatInterface(
    respond,
    additional_inputs=[
        # gr.Textbox(value="You are a friendly Chatbot.",
        #           label="System message"),
        gr.Slider(minimum=1, maximum=2048, value=1024,
                  step=1, label="Max new tokens"),
        gr.Slider(minimum=0.1, maximum=4.0, value=0.3,
                  step=0.1, label="Temperature"),
        gr.Slider(
            minimum=0.1,
            maximum=1.0,
            value=0.95,
            step=0.05,
            label="Top-p (nucleus sampling)",
        ),
    ],
)
description = """
### [Tanuki-8x8B-dpo-v1.0](https://huggingface.co/weblab-GENIAC/Tanuki-8x8B-dpo-v1.0)との会話(期間限定での公開)
- 人工知能開発のため､入出力データは著作権フリー(CC0)で公開予定ですので､ご注意ください｡著作物､個人情報､機密情報､誹謗中傷などのデータを入力しないでください｡
"""
# グループ化して表示
with gr.Blocks(css=custom_css) as interface:
    # 説明文を表示
    gr.Markdown(description)
    # ChatInterfaceを表示
    demo.render()
    # components = [gr.Markdown(description), demo]

if __name__ == "__main__":
    # demo.launch()
    interface.launch()