app.py

from langchain_openai import OpenAIEmbeddings
from langchain_chroma import Chroma
from langchain_openai import ChatOpenAI
from langchain.chains import RetrievalQAWithSourcesChain
import gradio as gr
import os
from dotenv import load_dotenv
from supabase import create_client

load_dotenv()
url = os.getenv("SUPABASE_URL")
key = os.getenv("SUPABASE_KEY")
supabase = create_client(url, key)

openai_api_key = os.getenv("OPENAI_API_KEY")

persist_directory = "db"

embeddings = OpenAIEmbeddings()

vector_store = Chroma(
    persist_directory=persist_directory,
    embedding_function=embeddings
)
retriever = vector_store.as_retriever(search_kwargs={"k": 3})

llm = ChatOpenAI(model_name="gpt-4o", temperature=0.1)  # Modify model_name if you have access to GPT-4

chain = RetrievalQAWithSourcesChain.from_chain_type(
    llm=llm,
    chain_type="stuff",
    retriever = retriever,
    return_source_documents=True)

html_content = """
<div style="display: flex; align-items: center;">
    <img src="https://huggingface.co/spaces/powerwarez/gailabicon/resolve/main/gailab08.png" alt="image" style="width:50px;height:auto;margin-right:10px;">
    <span>제작: 교사 서동성</span>
</div>
"""

def respond(message, chat_history):  # 채팅봇의 응답을 처리하는 함수를 정의합니다.
    result = chain.invoke(message)
    data = supabase.table("kinderrecordusage").insert({"prompt":message}).execute()
    
    bot_message = '<strong>' + result['answer'] + '</strong><br><br>'

    for i, doc in enumerate(result['source_documents']):
        text = doc.page_content[0:500].replace('\n', ' ')
        page = str(doc.metadata['page'])
        bot_message += '[' + '관련내용:' + doc.page_content[0:500].replace('\n', ' ') + '...' + '] '

        # 빨간색 스타일 적용
        bot_message += '<span style="color:red;">' + doc.metadata['source'] + '</span>'

        # 파란색 스타일 적용
        bot_message += '<span style="color:blue;">' + '(' +  page + '쪽)</span> '

    chat_history.append((message, bot_message))  # 채팅 기록에 사용자의 메시지와 봇의 응답을 추가합니다.

    return "", chat_history

with gr.Blocks() as demo:  # gr.Blocks()를 사용하여 인터페이스를 생성합니다.
    gr.Markdown("<div style='font-size: 30px; font-weight: bold;'>2023 유치원 생활기록부 QnA chatbot</div>")
    chatbot = gr.Chatbot(label="채팅창")  # '채팅창'이라는 레이블을 가진 채팅봇 컴포넌트를 생성합니다.
    msg = gr.Textbox(label="입력")  # '입력'이라는 레이블을 가진 텍스트박스를 생성합니다.
    clear = gr.Button("초기화")  # '초기화'라는 레이블을 가진 버튼을 생성합니다.

    msg.submit(respond, [msg, chatbot], [msg, chatbot])  # 텍스트박스에 메시지를 입력하고 제출하면 respond 함수가 호출되도록 합니다.
    clear.click(lambda: None, None, chatbot, queue=False)  # '초기화' 버튼을 클릭하면 채팅 기록을 초기화합니다.
    gr.Markdown("2023 유치원 생활기록부 기재요령 <a href='https://www.moe.go.kr/sn3hcv/doc.html?fn=65fcc64258de266d005f7156e03f04f2&rs=/upload/synap/202407/'>미리보기</a>")
    gr.Markdown("2023 유치원 생활기록부 기재요령 다운로드 <a href='https://www.moe.go.kr/boardCnts/viewRenew.do?boardID=312&boardSeq=97281&lev=0&searchType=null&statusYN=W&page=1&s=moe&m=0301&opType=N'>이동하기</a>")
    gr.Markdown("정확한 내용은 원본을 꼭 확인하시기 바랍니다.")
    gr.HTML(html_content)

demo.launch()  # 인터페이스를 실행합니다. 실행하면 사용자는 '입력' 텍스트박스에 메시지를 작성하고 제출할 수 있으며, '초기화' 버튼을 통해 채팅 기록을 초기화 할 수 있습니다.