Sync updates from source repository

README.md

@@ -1,13 +1,14 @@
 ---
 title: Ask Anabel
-emoji: 🚀
-colorFrom: blue
-colorTo: red
-sdk: gradio
-sdk_version: 4.38.1
+emoji: 📈
+colorFrom: indigo
+colorTo: green
+sdk: streamlit
+sdk_version: 1.32.2
 app_file: app.py
-license: apache-2.0
 pinned: false
-short_description: Ask Anabel about Social Emotional Learning
+license: apache-2.0
+short_description: Ask SEL questions based on the works of Anabel Jensen
 ---
+
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -1,79 +1,117 @@
 from omegaconf import OmegaConf
 from query import VectaraQuery
 import os
-import gradio as gr
+
+import streamlit as st
+from streamlit_pills import pills
+
+from PIL import Image
+
+max_examples = 6
 
 def isTrue(x) -> bool:
     if isinstance(x, bool):
         return x
     return x.strip().lower() == 'true'
 
-corpus_keys = str(os.environ['corpus_keys']).split(',')
-cfg = OmegaConf.create({
-    'corpus_keys': corpus_keys,
-    'api_key': str(os.environ['api_key']),
-    'title': os.environ['title'],
-    'source_data_desc': os.environ['source_data_desc'],
-    'streaming': isTrue(os.environ.get('streaming', False)),
-    'prompt_name': os.environ.get('prompt_name', None),
-    'examples': os.environ.get('examples', None)
-})
+def launch_bot():
+    def generate_response(question):
+        response = vq.submit_query(question)
+        return response
+    
+    def generate_streaming_response(question):
+        response = vq.submit_query_streaming(question)
+        return response
+    
+    def show_example_questions():        
+        if len(st.session_state.example_messages) > 0 and st.session_state.first_turn:            
+            selected_example = pills("Queries to Try:", st.session_state.example_messages, index=None)
+            if selected_example:
+                st.session_state.ex_prompt = selected_example
+                st.session_state.first_turn = False
+                return True
+        return False
 
-vq = VectaraQuery(cfg.api_key, cfg.corpus_keys, cfg.prompt_name)
-
-def respond(message, history):
-    if cfg.streaming:
-        # Call stream response and stream output
-        stream = vq.submit_query_streaming(message)
-        
+    if 'cfg' not in st.session_state:
+        corpus_keys = str(os.environ['corpus_keys']).split(',')
+        cfg = OmegaConf.create({
+            'corpus_keys': corpus_keys,
+            'api_key': str(os.environ['api_key']),
+            'title': os.environ['title'],
+            'source_data_desc': os.environ['source_data_desc'],
+            'streaming': isTrue(os.environ.get('streaming', False)),
+            'prompt_name': os.environ.get('prompt_name', None),
+            'examples': os.environ.get('examples', None)
+        })
+        st.session_state.cfg = cfg
+        st.session_state.ex_prompt = None
+        st.session_state.first_turn = True        
+        example_messages = [example.strip() for example in cfg.examples.split(",")]
+        st.session_state.example_messages = [em for em in example_messages if len(em)>0][:max_examples]
         
-        outputs = ""
-        for output in stream:
-            outputs += output
-            yield outputs
-    else:
-        # Call non-stream response and return message output
-        response = vq.submit_query(message)
-        yield response
+        st.session_state.vq = VectaraQuery(cfg.api_key, cfg.corpus_keys, cfg.prompt_name)
 
-heading_html = f'''
-                <table>
-                  <tr>
-                      <td style="width: 80%; text-align: left; vertical-align: middle;"> <h1>Vectara AI Assistant: {cfg.title}</h1> </td>
-                      <td style="width: 20%; text-align: right; vertical-align: middle;"> <img src="https://github.com/david-oplatka/chatbot-streamlit/blob/main/Vectara-logo.png?raw=true"> </td>
-                  </tr>
-                  <tr>
-                      <td colspan="2" style="font-size: 16px;">This demo uses Retrieval Augmented Generation from <a href="https://vectara.com/">Vectara</a> to ask questions about {cfg.source_data_desc}.</td>
-                  </tr>
-                </table>
-                '''
+    cfg = st.session_state.cfg
+    vq = st.session_state.vq
+    st.set_page_config(page_title=cfg.title, layout="wide")
 
-bot_css = """
-table {
-  border: none;
-  width: 100%;
-  table-layout: fixed;
-  border-collapse: separate;
-}
-td {
-  vertical-align: middle;
-  border: none;
-}
-img {
-  width: 75%;
-}
-h1 {
-  font-size: 2em; /* Adjust the size as needed */
-}
-"""
+    # left side content
+    with st.sidebar:
+        image = Image.open('Vectara-logo.png')
+        st.image(image, width=175)
+        st.markdown(f"## About\n\n"
+                    f"This demo uses Retrieval Augmented Generation to ask questions about {cfg.source_data_desc}\n\n")
 
-if cfg.examples:
-    app_examples = [example.strip() for example in cfg.examples.split(",")]
-else:
-    app_examples = None
+        st.markdown("---")
+        st.markdown(
+            "## How this works?\n"
+            "This app was built with [Vectara](https://vectara.com).\n"
+            "Vectara's [Indexing API](https://docs.vectara.com/docs/api-reference/indexing-apis/indexing) was used to ingest the data into a Vectara corpus (or index).\n\n"
+            "This app uses Vectara [Chat API](https://docs.vectara.com/docs/console-ui/vectara-chat-overview) to query the corpus and present the results to you, answering your question.\n\n"
+        )
+        st.markdown("---")
+        
+
+    st.markdown(f"<center> <h2> Vectara AI Assistant: {cfg.title} </h2> </center>", unsafe_allow_html=True)
+
+    if "messages" not in st.session_state.keys():
+        st.session_state.messages = [{"role": "assistant", "content": "How may I help you?"}]
+                
+    # Display chat messages
+    for message in st.session_state.messages:
+        with st.chat_message(message["role"]):
+            st.write(message["content"])
 
-demo = gr.ChatInterface(respond, description = heading_html, css = bot_css,
-                        chatbot = gr.Chatbot(value = [[None, "How may I help you?"]]), examples = app_examples, cache_examples = False)
+    example_container = st.empty()
+    with example_container:
+        if show_example_questions():
+            example_container.empty()
+            st.rerun()
 
+    # select prompt from example question or user provided input
+    if st.session_state.ex_prompt:
+        prompt = st.session_state.ex_prompt
+    else:
+        prompt = st.chat_input()
+    if prompt:
+        st.session_state.messages.append({"role": "user", "content": prompt})
+        with st.chat_message("user"):
+            st.write(prompt)
+        st.session_state.ex_prompt = None
+        
+    # Generate a new response if last message is not from assistant
+    if st.session_state.messages[-1]["role"] != "assistant":
+        with st.chat_message("assistant"):
+            if cfg.streaming:
+                stream = generate_streaming_response(prompt) 
+                response = st.write_stream(stream) 
+            else:
+                with st.spinner("Thinking..."):
+                    response = generate_response(prompt)
+                    st.write(response)
+            message = {"role": "assistant", "content": response}
+            st.session_state.messages.append(message)
+            st.rerun()
+    
 if __name__ == "__main__":
-    demo.launch()
+    launch_bot()

query.py

@@ -125,4 +125,4 @@ class VectaraQuery():
                         chunks.append(chunk)
                         yield chunk
 
-        return ''.join(chunks)
+        return ''.join(chunks)

requirements.txt

@@ -1,5 +1,5 @@
-gradio==3.40.0
 requests_to_curl==1.1.0
 toml==0.10.2
 omegaconf==2.3.0
 syrupy==4.0.8
+streamlit_pills==0.3.0