دمج روبوتات الدردشة مع واجهة Streamlit

تعرف على كيفية دمج واجهة الدردشة Streamlit مع LLMs.

سنغطي ما يلي...

Introduction to chat elements

يوفر Streamlit بعض عناصر الدردشة المصممة خصيصًا بناء روبوتات دردشة تفاعلية. تتيح لنا هذه العناصر بناء حوار أسئلة وأجوبة بين المستخدم ومسؤول التعليم.

  • st.chat_input : يعرض هذا عنصر واجهة مستخدم إدخال الدردشة الذي يسمح للمستخدم بكتابة الاستعلامات.

  • st.chat_message : يعرض هذا حاوية رسالة الدردشة التي تسمح للتطبيق بعرض الرسائل من المستخدم أو LLM.

  • st.status : يعرض هذا إخراج من العمليات طويلة الأمد ومكالمات API الخارجية حتى يتمكن المستخدم من الحصول على التحديثات أثناء عمل chatbot على استجابة.

Understanding the coding process

بناء روبوت محادثة باستخدام Streamlit وGroq وLlama LLM. سنبدأ بشرح الكود لفهم كيفية عمل العناصر والوظائف المختلفة.

سنبدأ بترميز البرنامج النصي الرئيسي app.py :

Press + to interact
import streamlit as st
import pandas as pd
from chatbot import generate_answer
# Set the general configuration of the main page
st.set_page_config(
page_title="Chatbot",
page_icon="🧊",
layout="wide",
initial_sidebar_state="expanded"
)
# Set the title
st.title(":rainbow[LLM chatbot]")
# Initialize chat history
if "messages" not in st.session_state:
st.session_state.messages = []
# Display chat messages from history on app rerun
for message in st.session_state.messages:
with st.chat_message(message["role"]):
st.markdown(message["content"])
# Accept user input
if prompt := st.chat_input("How can I help you today?"):
# Add user message to chat history
st.session_state.messages.append({"role": "user", "content": prompt})
# Display user message in chat message container
with st.chat_message("user"):
st.markdown(prompt)
# Display assistant response in chat message container
response = generate_answer(prompt)
st.session_state.messages.append({"role": "assistant", "content": response})

في هذا الكود نقوم بالخطوات التالية:

  • السطرين 1-2 : نقوم باستيراد المكتبات الضرورية، بما في ذلك streamlit و ...