File size: 2,527 Bytes
aa560ea
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
639596d
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75

# imports for running Chatbot
import os
import gradio as gr
from xai_sdk import Client
from xai_sdk.chat import user
from dotenv import load_dotenv

# pull custom image assets (purple thunderbolt)
#gr.set_static_paths(paths=["assets/"])

# load XAI_API_Key from .env file
load_dotenv()

# get api key from the environment, securely
api_key = os.getenv("XAI_API_KEY")

# check to see if api key is working properly.
# will comment out code block later but keep for documenting purposes
'''
if api_key:
    print("API key loaded successfully (first 10 chars):", api_key[:10] + "...")
else:
    print("ERROR: API key not found! Check your .env file.")
    #ran successful API is active now
'''

#create grok client
client = Client(api_key = api_key)

#print("Grok client initialized — ready to chat!")

def grok_chat(message, history):
    # Start new conversation
    conversation = client.chat.create(model="grok-4")

    # Safely add previous user messages from history
    for turn in history:
        if isinstance(turn, (list, tuple)) and len(turn) > 0 and turn[0]:
            conversation.append(user(turn[0]))

    # Add the current user message
    conversation.append(user(message))

    # Stream response
    partial_response = ""
    for full_response, chunk in conversation.stream():
        if chunk.content:
            partial_response += chunk.content
            yield partial_response

# creating chat interface with gradio, calls grok_chat function
# full UI plus fetching through grok API
with gr.Blocks(theme=gr.themes.Monochrome()) as demo:
    gr.ChatInterface(
        fn=grok_chat,                   # grok_chat function defined above
        title="🗲 Grok-4 Chatbot (Basic)",
        description="A simple chat with Grok-4 using the xAI API by Andrew Dykeman",
        examples=["Explain CNN's like you are an expert computer vision tutor", 
                  "Explain quantum computing as if your are an expert tutor in the field",
                  "Who is the true expert, Elliot or Andrew?"],
        chatbot = gr.Chatbot(
            height = 600,
            avatar_images = (None, "https://x.ai/favicon.ico") #avatar_images = (None, "assets/chat_icon.png") changed to url
        )
    )

# Launch the app
demo.launch()

'''Completed flow, chat icon is now a statis url instead of downlowded asset,
hugging face was failing to sync because of the png files in assets. The PNG files allowed for more customization,
but continued having issues with whhen syncing to huggingface'''

#checking