Upload 6 files

.chainlit/config.toml

@@ -0,0 +1,78 @@
+[project]
+# Whether to enable telemetry (default: true). No personal data is collected.
+enable_telemetry = false
+
+# List of environment variables to be provided by each user to use the app.
+user_env = []
+
+# Duration (in seconds) during which the session is saved when the connection is lost
+session_timeout = 3600
+
+# Enable third parties caching (e.g LangChain cache)
+cache = false
+
+# Follow symlink for asset mount (see https://github.com/Chainlit/chainlit/issues/317)
+# follow_symlink = false
+
+[features]
+# Show the prompt playground
+prompt_playground = true
+
+# Authorize users to upload files with messages
+multi_modal = true
+
+# Allows user to use speech to text
+[features.speech_to_text]
+    enabled = false
+    # See all languages here https://github.com/JamesBrill/react-speech-recognition/blob/HEAD/docs/API.md#language-string
+    # language = "en-US"
+
+[UI]
+# Name of the app and chatbot.
+name = "Chatbot"
+
+# Show the readme while the conversation is empty.
+show_readme_as_default = true
+
+# Description of the app and chatbot. This is used for HTML tags.
+# description = ""
+
+# Large size content are by default collapsed for a cleaner ui
+default_collapse_content = true
+
+# The default value for the expand messages settings.
+default_expand_messages = false
+
+# Hide the chain of thought details from the user in the UI.
+hide_cot = false
+
+# Link to your github repo. This will add a github button in the UI's header.
+# github = ""
+
+# Specify a CSS file that can be used to customize the user interface.
+# The CSS file can be served from the public directory or via an external link.
+# custom_css = "/public/test.css"
+
+# Override default MUI light theme. (Check theme.ts)
+[UI.theme.light]
+    #background = "#FAFAFA"
+    #paper = "#FFFFFF"
+
+    [UI.theme.light.primary]
+        #main = "#F80061"
+        #dark = "#980039"
+        #light = "#FFE7EB"
+
+# Override default MUI dark theme. (Check theme.ts)
+[UI.theme.dark]
+    #background = "#FAFAFA"
+    #paper = "#FFFFFF"
+
+    [UI.theme.dark.primary]
+        #main = "#F80061"
+        #dark = "#980039"
+        #light = "#FFE7EB"
+
+
+[meta]
+generated_by = "0.7.501"

Dockerfile

@@ -0,0 +1,13 @@
+FROM python:3.9
+RUN useradd -m -u 1000 user
+USER user
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH
+WORKDIR $HOME/app
+COPY --chown=user . $HOME/app
+RUN chown -R user:user $HOME/app
+RUN chmod -R 755 $HOME/app
+COPY ./requirements.txt ~/app/requirements.txt
+RUN pip install -r requirements.txt
+COPY . .
+CMD ["chainlit", "run", "app.py", "--port", "7860"]

app.py

@@ -0,0 +1,106 @@
+import chainlit as cl
+from openai import OpenAI
+from langsmith.run_helpers import traceable
+from langsmith_config import setup_langsmith_config
+import base64
+import os
+
+os.environ["OPENAI_API_KEY"] = os.getenv("OPENAI_API_KEY")
+model = "gpt-4-1106-preview"
+model_vision = "gpt-4-vision-preview"
+setup_langsmith_config()
+    
+def process_images(msg: cl.Message):
+    # Processing images exclusively
+    images = [file for file in msg.elements if "image" in file.mime]
+
+    # Accessing the bytes of a specific image
+    image_bytes = images[0].content # take the first image just for demo purposes
+    
+    # we need base64 encoded image
+    image_base64 = base64.b64encode(image_bytes).decode('utf-8')
+    return image_base64
+
+async def process_stream(stream, msg: cl.Message):
+    for part in stream:
+            if token := part.choices[0].delta.content or "":
+                await msg.stream_token(token)
+
+def handle_vision_call(msg, image_history):
+    image_base64 = None
+    image_base64 = process_images(msg)
+    
+    if image_base64:
+        # add the image to the image history
+        image_history.append(
+        {
+            "role": "user",
+            "content": [
+                    {"type": "text", "text": msg.content},
+                    {
+                        "type": "image_url",
+                        "image_url": {
+                            "url": f"data:image/jpeg;base64,{image_base64}"
+                        }
+                    },
+                ],
+            }
+        )
+        stream = gpt_vision_call(image_history)
+        return stream
+
+@traceable(run_type="llm", name="gpt 4 turbo call")
+async def gpt_call(message_history: list = []):
+    client = OpenAI()
+
+    stream = client.chat.completions.create(
+        model=model,
+        messages=message_history,
+        stream=True,
+    )
+    
+    return stream
+
+@traceable(run_type="llm", name="gpt 4 turbo vision call")
+def gpt_vision_call(image_history: list = []):
+    client = OpenAI()
+  
+    stream = client.chat.completions.create(
+        model=model_vision,
+        messages=image_history,
+        max_tokens=1000,
+        stream=True,
+    )
+
+    return stream
+
+@cl.on_chat_start
+def start_chat():
+    cl.user_session.set(
+        "message_history",
+        [{"role": "system", "content": "You are a helpful assistant."}],
+    )
+    cl.user_session.set("image_history", [{"role": "system", "content": "You are a helpful assistant."}])
+
+@cl.on_message
+async def on_message(msg: cl.Message):
+    message_history = cl.user_session.get("message_history")
+    image_history = cl.user_session.get("image_history")
+    
+    stream_msg = cl.Message(content="") 
+    stream = None
+
+    if msg.elements:
+        stream = handle_vision_call(msg, image_history)
+
+    else:
+        # add the message in both to keep the coherence between the two histories
+        message_history.append({"role": "user", "content": msg.content})
+        image_history.append({"role": "user", "content": msg.content})
+        
+        stream = await gpt_call(message_history)
+    
+    if stream:
+        await process_stream(stream, msg=stream_msg)
+        image_history.append({"role": "system", "content": stream_msg.content})
+        message_history.append({"role": "system", "content": stream_msg.content})

chainlit.md

@@ -0,0 +1,14 @@
+# Welcome to Chainlit! 🚀🤖
+
+Hi there, Developer! 👋 We're excited to have you on board. Chainlit is a powerful tool designed to help you prototype, debug and share applications built on top of LLMs.
+
+## Useful Links 🔗
+
+- **Documentation:** Get started with our comprehensive [Chainlit Documentation](https://docs.chainlit.io) 📚
+- **Discord Community:** Join our friendly [Chainlit Discord](https://discord.gg/k73SQ3FyUh) to ask questions, share your projects, and connect with other developers! 💬
+
+We can't wait to see what you create with Chainlit! Happy coding! 💻😊
+
+## Welcome screen
+
+To modify the welcome screen, edit the `chainlit.md` file at the root of your project. If you do not want a welcome screen, just leave this file empty.

langsmith_config.py

@@ -0,0 +1,8 @@
+import os
+
+def setup_langsmith_config():
+    os.environ["LANGCHAIN_ENDPOINT"] = "https://api.smith.langchain.com" # Update with your API URL if using a hosted instance of Langsmith.
+    os.environ["LANGCHAIN_API_KEY"] = os.getenv("LANGCHAIN_API_KEY") # Update with your API key
+    os.environ["LANGCHAIN_TRACING_V2"] = "true"
+    project_name = "GPT-4-VISION-DEMO" # Update with your project name
+    os.environ["LANGCHAIN_PROJECT"] = project_name # Optional: "default" is used if not set

requirements.txt

@@ -0,0 +1,3 @@
+chainlit
+openai
+langsmith