├── .breakpoints
├── replit.nix
├── assets
    ├── favicon.png
    └── Chat-with-Claude-Sonnet-35@2x.jpg
├── .replit
├── pyproject.toml
├── main.py
└── README.md


/.breakpoints:
--------------------------------------------------------------------------------
1 | {
2 |   "files": {}
3 | }


--------------------------------------------------------------------------------
/replit.nix:
--------------------------------------------------------------------------------
1 | {pkgs}: {
2 |   deps = [
3 |     pkgs.ffmpeg-full
4 |   ];
5 | }
6 | 


--------------------------------------------------------------------------------
/assets/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mattppal/Chat-with-Claude-Sonnet-35/HEAD/assets/favicon.png


--------------------------------------------------------------------------------
/assets/Chat-with-Claude-Sonnet-35@2x.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/mattppal/Chat-with-Claude-Sonnet-35/HEAD/assets/Chat-with-Claude-Sonnet-35@2x.jpg


--------------------------------------------------------------------------------
/.replit:
--------------------------------------------------------------------------------
 1 | entrypoint = "README.md"
 2 | modules = ["python-3.11:v14-20231207-2f65342"]
 3 | run = "python main.py"
 4 | hidden = [".pythonlibs"]
 5 | 
 6 | [nix]
 7 | channel = "stable-23_11"
 8 | 
 9 | [unitTest]
10 | language = "python3"
11 | 
12 | [deployment]
13 | run = ["python3", "main.py"]
14 | deploymentTarget = "cloudrun"
15 | 
16 | [[ports]]
17 | localPort = 7860
18 | externalPort = 80
19 | exposeLocalhost = true
20 | 


--------------------------------------------------------------------------------
/pyproject.toml:
--------------------------------------------------------------------------------
 1 | [tool.poetry]
 2 | name = "python-template"
 3 | version = "0.1.0"
 4 | description = ""
 5 | authors = ["Your Name <you@example.com>"]
 6 | 
 7 | [tool.poetry.dependencies]
 8 | python = ">=3.11.0,<3.12"
 9 | gradio = "^4.31.5"
10 | anthropic = "^0.29.0"
11 | ratelimit = "^2.2.1"
12 | 
13 | [tool.poetry.dev-dependencies]
14 | debugpy = "^1.6.2"
15 | replit-python-lsp-server = {extras = ["yapf", "rope", "pyflakes"], version = "^1.5.9"}
16 | 
17 | [build-system]
18 | requires = ["poetry-core>=1.0.0"]
19 | build-backend = "poetry.core.masonry.api"


--------------------------------------------------------------------------------
/main.py:
--------------------------------------------------------------------------------
 1 | import os
 2 | 
 3 | import gradio as gr
 4 | import anthropic
 5 | 
 6 | client = anthropic.Anthropic(api_key=os.environ['ANTHROPIC_API_KEY'])
 7 | 
 8 | MODEL = "claude-3-5-sonnet-20240620"
 9 | 
10 | 
11 | def chat_with_replit(message, history):
12 | 
13 |   messages = []
14 |   response_content = ""
15 | 
16 |   for h in history:
17 |     u = str(h[0])
18 |     s = str(h[1])
19 | 
20 |     messages.append({"role": 'user', "content": u})
21 |     messages.append({"role": 'assistant', "content": s})
22 | 
23 |   messages = messages + [
24 |       {
25 |           "role": "user",
26 |           "content": str(message),
27 |       },
28 |   ]
29 | 
30 |   with client.messages.stream(
31 |       max_tokens=1024,
32 |       messages=messages,
33 |       model=MODEL,
34 |   ) as stream:
35 |     for text in stream.text_stream:
36 |       response_content += text
37 | 
38 |       yield response_content
39 | 
40 | 
41 | js = """<script src="https://replit.com/public/js/replit-badge-v2.js" theme="dark" position="bottom-right"></script>"""
42 | 
43 | with gr.Blocks(title="Replit + Anthropic", fill_height=True, head=js) as demo:
44 |   gr.ChatInterface(chat_with_replit,
45 |                    fill_height=True,
46 |                    examples=[
47 |                        "What is the meaning of life?",
48 |                        "What are some fun things to do in San Francisco?",
49 |                        "Interpret 'The Road Not Taken' by Robert Frost"
50 |                    ],
51 |                    title="🚀 Chat with Claude Sonnet 3.5")
52 | 
53 | demo.launch(favicon_path="assets/favicon.png", allowed_paths=["assets"])
54 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Chat with Claude Sonnet 3.5
 2 | 
 3 | This project allows users to interact with an AI language model using a Gradio interface. The code in `main.py` sets up a chat interface where users can communicate with Claude Sonnet 3.5, a model from Anthropic, and get text responses streamed back.
 4 | 
 5 | <div align="center">
 6 |   <img src="./assets/Chat-with-Claude-Sonnet-35@2x.jpg" width="50%" />
 7 | </div>
 8 | 
 9 | ## Code walkthrough
10 | 
11 | This entire demo lives in `main.py` and is under 50 lines, making it simple and straightforward to understand. Here's a breakdown of what's going on:
12 | 
13 | ### Imports and Initialization
14 | 
15 | - `os`: For accessing environment variables.
16 | - `gradio as gr`: For creating a user interface.
17 | - `anthropic`: For interacting with the AI model.
18 | 
19 | ```python
20 | import os
21 | import gradio as gr
22 | import anthropic
23 | ```
24 | 
25 | ### Client Initialization
26 | 
27 | - Initializes an Anthropic client using an API key from environment variables.
28 | - Specifies the model to be used (`Claude Sonnet 3.5`).
29 | 
30 | ```python
31 | client = anthropic.Anthropic(api_key=os.environ['ANTHROPIC_API_KEY'])
32 | MODEL = "claude-3-5-sonnet-20240620"
33 | ```
34 | 
35 | ### Function `chat_with_replit`
36 | 
37 | This function takes a user's message and a history of previous messages, constructs the input for the AI model, and yields streaming responses.
38 | 
39 | ```python
40 | def chat_with_replit(message, history):
41 |     messages = []
42 |     response_content = ""
43 | 
44 |     for h in history:
45 |         u = str(h[0])
46 |         s = str(h[1])
47 | 
48 |         messages.append({"role": 'user', "content": u})
49 |         messages.append({"role": 'assistant', "content": s})
50 | 
51 |     messages = messages + [
52 |         {
53 |             "role": "user",
54 |             "content": str(message),
55 |         },
56 |     ]
57 | 
58 |     with client.messages.stream(
59 |         max_tokens=1024,
60 |         messages=messages,
61 |         model=MODEL,
62 |     ) as stream:
63 |         for text in stream.text_stream:
64 |             response_content += text
65 |             yield response_content
66 | ```
67 | 
68 | ### Gradio Interface Setup
69 | 
70 | - Creates a Gradio Blocks interface with a chat component.
71 | - Provides example prompts and sets the title for the chat interface.
72 | - Launches the Gradio app with a specified favicon and allowed paths.
73 | 
74 | ```python
75 | with gr.Blocks(fill_height=True, head=js) as demo:
76 |     gr.ChatInterface(chat_with_replit,
77 |                     fill_height=True,
78 |                     examples=[
79 |                         "What is the meaning of life?",
80 |                         "What are some fun things to do in San Francisco?",
81 |                         "Interpret 'The Road Not Taken' by Robert Frost"
82 |                     ],
83 |                     title="🚀 Chat with Claude Sonnet 3.5")
84 | 
85 | demo.launch(favicon_path="assets/favicon.png", allowed_paths=["assets"])
86 | ```
87 | 
88 | ## Usage
89 | 1. Set the `ANTHROPIC_API_KEY` environment variable with your Anthropic API key.
90 | 2. Click "Run"
91 | 3. Navigate to the "Webview" tab (ignore the "Output" that might appear, this is a Gradio issue)
92 | 4. Tinker and deploy :)
93 | 
94 | ## Notes
95 | 
96 | - The Gradio interface is customizable. You can modify the examples, title, and design as per your needs.
97 | - Ensure you use Replit Secrets to be sure your API key and other sensitive information are kept secure.


--------------------------------------------------------------------------------