added tabs

app.py

@@ -1,11 +1,16 @@
 import gradio as gr
 from langchain_core.messages import HumanMessage
 import src.passage_finder as pf
+import src.srf_bot as sb
+import prompts.system_prompts as sp
+import os
 
-# Initialize PassageFinder
+# Initialize PassageFinder and Chatbot
 passage_finder = pf.PassageFinder()
+chatbot = sb.SRFChatbot()
 
-def respond(message):
+# Passage Finder functions
+def respond_passage_finder(message):
     config = passage_finder.get_configurable()
     results = passage_finder.graph.invoke({"messages": [HumanMessage(content=message)]}, config)
     
@@ -27,8 +32,8 @@ def respond(message):
     
     return output
 
-def process_input(message):
-    results = respond(message)
+def process_input_passage_finder(message):
+    results = respond_passage_finder(message)
     html_output = "<div class='response-container'>"
     for result in results:
         html_output += f"""
@@ -44,43 +49,137 @@ def process_input(message):
     html_output += "</div>"
     return html_output
 
-with gr.Blocks(css="""
-    body { background-color: #f0f0f0; }
-    .gradio-container { background-color: #ffffff; }
-    .response-container { border: 1px solid #e0e0e0; border-radius: 8px; padding: 20px; background-color: #f9f9f9; }
-    .result-item { margin-bottom: 20px; background-color: white; padding: 15px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
-    .reference { color: #2c3e50; margin-bottom: 10px; }
-    .quotes { font-style: italic; margin-bottom: 10px; }
-    .full-passage { margin-top: 10px; padding: 10px; background-color: #f0f0f0; border-radius: 5px; }
-    details summary { cursor: pointer; color: #3498db; font-weight: bold; }
-    details summary:hover { text-decoration: underline; }
-""") as demo:
-    gr.Markdown("# SRF Teachings Chatbot")
-    gr.Markdown("Ask questions about Self-Realization Fellowship teachings and receive responses with relevant quotes.")
-    
-    with gr.Row():
-        input_text = gr.Textbox(
-            placeholder="Ask about the meaning of life, spirituality, or any other topic...",
-            label="Your Question"
-        )
-        submit_btn = gr.Button("Submit", variant="primary")
-    
-    output_area = gr.HTML()
-    
-    gr.Markdown("### Sources")
-    gr.Textbox(value="Journey to Self Realization, Second Coming of Christ, and Autobiography of a Yogi", 
-               label="Available Sources", interactive=False)
+# Chatbot functions
+def respond_chatbot(query, history):
+    formatted_query = [HumanMessage(content=query)]
+    # Invoke the graph with properly formatted input
+    result = chatbot.graph.invoke({"messages": formatted_query}, chatbot.config)
+    # Get the passages from the graph and append to history if documents exist
+    state = chatbot.graph.get_state(config=chatbot.config).values
+    documents = state.get("documents")
+    passages = ''
+    if documents and len(documents) > 0:
+        for d in documents:
+            passages += f'<b>{d.metadata["publication_name"]} - {d.metadata["chapter_name"]}</b>\n{d.page_content}\n\n'
+        history.append((f'Passages: {query}', passages))
+    # Extract the assistant's response and append to history
+    response = result["messages"][-1].content
+    system_message_dropdown = state.get("system_message_dropdown")
+    history.append((query, f"<i>[{system_message_dropdown}]</i>\n" + response))
+    return history
+
+# Define the CSS
+css = """
+body { background-color: #f0f0f0; }
+.gradio-container { background-color: #ffffff; }
+.response-container { border: 1px solid #e0e0e0; border-radius: 8px; padding: 20px; background-color: #f9f9f9; }
+.result-item { margin-bottom: 20px; background-color: white; padding: 15px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
+.reference { color: #2c3e50; margin-bottom: 10px; }
+.quotes { font-style: italic; margin-bottom: 10px; }
+.full-passage { margin-top: 10px; padding: 10px; background-color: #f0f0f0; border-radius: 5px; }
+details summary { cursor: pointer; color: #3498db; font-weight: bold; }
+details summary:hover { text-decoration: underline; }
+
+/* Chatbot specific styles */
+.gr-button { background-color: #333333; color: white; font-size: 18px; padding: 10px; }
+.gr-textbox textarea { font-size: 18px; color: black; }
+.gr-dropdown { font-size: 18px; color: black; }
+.source-box { background-color: white; padding: 10px; border-radius: 8px; margin-top: 20px; color: black; border: 1px solid #D0D0D0; }
+
+/* Dark mode and responsive styles */
+@media (prefers-color-scheme: dark) {
+    .gradio-container { background-color: #1e1e1e; color: white; }
+    h1, h2, p { color: white; }
+    .gr-textbox textarea { background-color: #333333; color: white; }
+    .gr-button { background-color: #555555; color: white; }
+    .gr-dropdown { background-color: #333333; color: white; }
+    .source-box { background-color: #333333; color: white; border: 1px solid #555555; }
+}
+
+@media (max-width: 600px) {
+    .gr-row { flex-direction: column !important; }
+    .gr-column { width: 100% !important; }
+}
+"""
+
+with gr.Blocks(css=css) as demo:
+    gr.Markdown("# SRF Teachings App")
     
-    submit_btn.click(process_input, inputs=input_text, outputs=output_area)
+    with gr.Tabs():
+        with gr.TabItem("Passage Finder"):
+            gr.Markdown("Ask questions about Self-Realization Fellowship teachings and receive responses with relevant quotes.")
+            
+            with gr.Row():
+                input_text_pf = gr.Textbox(
+                    placeholder="Ask about the meaning of life, spirituality, or any other topic...",
+                    label="Your Question"
+                )
+                submit_btn_pf = gr.Button("Submit", variant="primary")
+            
+            output_area_pf = gr.HTML()
+            
+            gr.Markdown("### Sources")
+            gr.Textbox(value="Journey to Self Realization, Second Coming of Christ, and Autobiography of a Yogi", 
+                       label="Available Sources", interactive=False)
+            
+            submit_btn_pf.click(process_input_passage_finder, inputs=input_text_pf, outputs=output_area_pf)
+
+            gr.Examples(
+                examples=[
+                    "What is the meaning of life?",
+                    "Importance of good posture",
+                    "How can I find inner peace?",
+                    "What does Paramahansa Yogananda say about meditation?",
+                ],
+                inputs=input_text_pf,
+            )
+
+        with gr.TabItem("Chatbot"):
+            with gr.Row():
+                with gr.Column(scale=4):
+                    chatbot_output = gr.Chatbot(height=600)
+                    user_input_cb = gr.Textbox(placeholder="Type your question here...", label="Your Question", value="What is the meaning of life?")
+                    submit_button_cb = gr.Button("Submit")
+                
+                with gr.Column(scale=1):
+                    system_prompt_dropdown = gr.Dropdown(
+                        choices=list(sp.system_prompt_templates.keys()),
+                        label="Select Chatbot Instructions",
+                        value=list(sp.system_prompt_templates.keys())[0],
+                    )
+                    system_prompt_display = gr.Textbox(
+                        value=sp.system_prompt_templates[list(sp.system_prompt_templates.keys())[0]],
+                        label="Current Chatbot Instructions",
+                        lines=5,
+                        interactive=False
+                    )
+                    
+                    gr.Markdown("""
+                    <div class="source-box">
+                        <strong>Available sources:</strong>
+                        <ul>
+                            <li>Journey to Self-Realization</li>
+                            <li>The Second Coming of Christ</li>
+                            <li>Autobiography of a Yogi</li>
+                        </ul>
+                    </div>
+                    """)
+            
+            system_prompt_dropdown.change(
+                fn=chatbot.reset_system_prompt,
+                inputs=[system_prompt_dropdown],
+                outputs=[system_prompt_display]
+            )
+            
+            submit_button_cb.click(
+                fn=respond_chatbot,
+                inputs=[user_input_cb, chatbot_output],
+                outputs=[chatbot_output]
+            )
 
-    gr.Examples(
-        examples=[
-            "What is the meaning of life?",
-            "Importance of good posture",
-            "How can I find inner peace?",
-            "What does Paramahansa Yogananda say about meditation?",
-        ],
-        inputs=input_text,
-    )
+# Access the secrets
+username = os.getenv("USERNAME")
+password = os.getenv("PASSWORD")
 
-demo.launch()
+# Launch the interface
+demo.launch(share=True, auth=(username, password), debug=True)

app_passagefinder.py

@@ -0,0 +1,86 @@
+import gradio as gr
+from langchain_core.messages import HumanMessage
+import src.passage_finder as pf
+
+# Initialize PassageFinder
+passage_finder = pf.PassageFinder()
+
+def respond(message):
+    config = passage_finder.get_configurable()
+    results = passage_finder.graph.invoke({"messages": [HumanMessage(content=message)]}, config)
+    
+    documents = results.get('documents', [])
+    
+    output = []
+    for doc in documents:
+        quotes = doc.metadata.get('matched_quotes', [])
+        publication = doc.metadata.get('publication_name', 'Unknown Publication')
+        chapter = doc.metadata.get('chapter_name', 'Unknown Chapter')
+        full_passage = doc.metadata.get('highlighted_content', '')
+        
+        quote_text = "\n".join([f"• \"{q.quote}\"" for q in quotes])
+        output.append({
+            "quotes": quote_text,
+            "reference": f"{publication}: {chapter}",
+            "full_passage": full_passage
+        })
+    
+    return output
+
+def process_input(message):
+    results = respond(message)
+    html_output = "<div class='response-container'>"
+    for result in results:
+        html_output += f"""
+        <div class='result-item'>
+            <h3 class='reference'>{result['reference']}</h3>
+            <div class='quotes'>{result['quotes'].replace("• ", "<br>• ")}</div>
+            <details>
+                <summary>Show full passage</summary>
+                <div class='full-passage'>{result['full_passage']}</div>
+            </details>
+        </div>
+        """
+    html_output += "</div>"
+    return html_output
+
+with gr.Blocks(css="""
+    body { background-color: #f0f0f0; }
+    .gradio-container { background-color: #ffffff; }
+    .response-container { border: 1px solid #e0e0e0; border-radius: 8px; padding: 20px; background-color: #f9f9f9; }
+    .result-item { margin-bottom: 20px; background-color: white; padding: 15px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
+    .reference { color: #2c3e50; margin-bottom: 10px; }
+    .quotes { font-style: italic; margin-bottom: 10px; }
+    .full-passage { margin-top: 10px; padding: 10px; background-color: #f0f0f0; border-radius: 5px; }
+    details summary { cursor: pointer; color: #3498db; font-weight: bold; }
+    details summary:hover { text-decoration: underline; }
+""") as demo:
+    gr.Markdown("# SRF Teachings Chatbot")
+    gr.Markdown("Ask questions about Self-Realization Fellowship teachings and receive responses with relevant quotes.")
+    
+    with gr.Row():
+        input_text = gr.Textbox(
+            placeholder="Ask about the meaning of life, spirituality, or any other topic...",
+            label="Your Question"
+        )
+        submit_btn = gr.Button("Submit", variant="primary")
+    
+    output_area = gr.HTML()
+    
+    gr.Markdown("### Sources")
+    gr.Textbox(value="Journey to Self Realization, Second Coming of Christ, and Autobiography of a Yogi", 
+               label="Available Sources", interactive=False)
+    
+    submit_btn.click(process_input, inputs=input_text, outputs=output_area)
+
+    gr.Examples(
+        examples=[
+            "What is the meaning of life?",
+            "Importance of good posture",
+            "How can I find inner peace?",
+            "What does Paramahansa Yogananda say about meditation?",
+        ],
+        inputs=input_text,
+    )
+
+demo.launch()