ui created with gradio

.env.example

@@ -0,0 +1 @@
+GOOGLE_API_KEY=your_google_api_key_here from https://aistudio.google.com/apikey

app.py

@@ -0,0 +1,33 @@
+import gradio as gr # Import the Gradio library for building UIs
+from chatbot import chatbot # Import the AI chatbot function from the app module
+import json # Import the json library for handling JSON data
+import os # Import the os library for interacting with the operating system
+
+# Load branding data from the branding.json file
+with open(os.path.abspath(os.path.join(os.path.dirname(__file__), 'branding.json'))) as f:
+    brand_info = json.load(f)['brand']
+
+# Create the Gradio interface using gr.Blocks for custom layout
+with gr.Blocks(theme='default', title=brand_info['organizationName']) as demo:
+    # Embed the logo using HTML for centering and styling
+    gr.HTML(f'''<div style="display: flex; justify-content: center; margin-bottom: 20px;">
+            <img src="{brand_info['logo']['title']}" alt="{brand_info['organizationName']} Logo" style="height: 100px;">
+        </div>''')
+    # Create the chat interface with specified functions and branding
+    gr.ChatInterface(
+        fn=chatbot, # Function to call for chatbot responses
+        chatbot=gr.Chatbot(height=500, avatar_images=(None, brand_info['chatbot']['avatar']), type="messages"), # Configure chatbot display
+        title=brand_info['organizationName'], # Set the title of the chat interface
+        description=brand_info['slogan'], # Set the description/slogan
+        type="messages", # Specify the message format
+        examples=[
+            ["What is AI?"],
+            ["Can you explain machine learning?"],
+            ["How does a neural network work?"],
+            ["What is natural language processing?"],
+        ] # Example prompts for the chatbot
+    )
+
+# Launch the Gradio interface when the script is executed
+if __name__ == "__main__":
+    demo.launch(favicon_path=brand_info['logo']['favicon']) # Launch the demo with the specified favicon path

branding.json

@@ -0,0 +1,26 @@
+{
+    "brand":
+    {
+        "organizationName": "HERE AND NOW AI",
+        "website": "https://hereandnowai.com",
+        "email": "info@hereandnowai.com",
+        "mobile": "+91 996 296 1000",
+        "slogan": "designed with passion for innovation",
+        "colors": {"primary": "#FFDF00", "secondary": "#004040"},
+        "logo":
+            {
+                "title": "https://raw.githubusercontent.com/hereandnowai/images/refs/heads/main/logos/logo-of-here-and-now-ai.png",
+                "favicon": "https://raw.githubusercontent.com/hereandnowai/images/refs/heads/main/logos/favicon-logo-with-name.png"}, "chatbot": {"avatar": "https://raw.githubusercontent.com/hereandnowai/images/refs/heads/main/logos/caramel.jpeg", "face": "https://raw.githubusercontent.com/hereandnowai/images/refs/heads/main/logos/caramel-face.jpeg"
+            },
+        
+        "socialMedia":
+            {
+                "blog": "https://hereandnowai.com/blog",
+                "linkedin": "https://www.linkedin.com/company/hereandnowai/",
+                "instagram": "https://instagram.com/hereandnow_ai",
+                "github": "https://github.com/hereandnowai",
+                "x": "https://x.com/hereandnow_ai",
+                "youtube": "https://youtube.com/@hereandnow_ai"
+            }
+    }
+}

chatbot.py

@@ -0,0 +1,29 @@
+from dotenv import load_dotenv
+from poml.integration.langchain import LangchainPomlTemplate
+from langchain_google_genai import ChatGoogleGenerativeAI
+from langchain_core.output_parsers import StrOutputParser
+
+load_dotenv()
+llm = ChatGoogleGenerativeAI(model="gemini-2.5-flash-lite", temperature=0.7)
+
+conversation_history = []
+
+def chatbot(user_input, history=None):
+    global conversation_history
+    prompt = LangchainPomlTemplate.from_file("prompt.poml")
+    history_text = "\n".join([f"Human: {h['user']}\nAssistant: {h['bot']}" for h in conversation_history[-5:]])
+    context = {"question": user_input, "history": history_text}
+    chain = prompt | llm | StrOutputParser()
+    response = chain.invoke(context)
+    conversation_history.append({"user": user_input, "bot": response})
+    if len(conversation_history) > 10:
+        conversation_history.pop(0)
+    return response
+
+if __name__ == "__main__":
+    while True:
+        user_input = input("You: ")
+        if user_input.lower() in ["exit", "quit"]:
+            break
+        response = chatbot(user_input)
+        print(f"Bot: {response}")

prompt.poml

@@ -0,0 +1,25 @@
+<poml>
+<role>Your name is Caramel AI, built by HERE AND NOW AI. You are a French Teacher. You teach French to English speaking children who do not know any French.</role>
+
+<task>
+<list>Say that you are a friendly French teacher</list>
+<list>Ask the user, what they want to learn in French and teach only that topic</list>
+<list>Explain everything in simple English.</list>
+<list>Keep your answers simple, concise, and explain the meaning of each word in English.</list>
+<list>Remember previous conversations and build upon what the user has learned</list>
+</task>
+
+Previous conversation history:
+{{ history }}
+
+Current question: {{ question }}
+
+<example>
+Bonjour! Comment allez-vous?
+Bonjour: Hello
+Comment: How
+allez-vous: are you going?
+
+But the meaning of the sentence together: **how are you?**
+</example>
+</poml>

requirements.txt

@@ -0,0 +1,5 @@
+python-dotenv
+langchain-google-genai
+langchain
+poml
+gradio