from fasthtml.common import * from openai import OpenAI # openai==1.2.0 from dotenv import load_dotenv, find_dotenv _ = load_dotenv(find_dotenv()) upstage_token = os.getenv('UPSTAGE_TOKEN') # Set up the app, including daisyui and tailwind for the chat component hdrs = (picolink, Script(src="https://cdn.tailwindcss.com"), Link(rel="stylesheet", href="https://cdn.jsdelivr.net/npm/daisyui@4.11.1/dist/full.min.css")) app = FastHTML(hdrs=hdrs, cls="p-4 max-w-lg mx-auto") #app = FastHTML() rt = app.route style=""" #mapid { height: 480px; } """ js = """ function load() { var map = L.map('mapid').setView([ 37.5158, 127.0991], 13); L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 19, attribution: '© OpenStreetMap' }).addTo(map); //alert('loading...'); } setTimeout(load, 1000); $("#chat_form :input[name='messages']").change(function(){ alert("The text has been changed."); }); """ # @rt('/') # def get(): # return Titled("MinorityMap", # Link(rel="stylesheet", href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css"), # Style(style), # Script(src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js"), # #Body(onload='load()'), # Div(id='mapid'), # Script(js) # ) client = OpenAI( api_key=upstage_token, base_url="https://api.upstage.ai/v1/solar" ) sp = "You are a helpful and concise assistant." def get_completion(prompt, model="solar-1-mini-chat"): messages = [{"role": "user", "content": prompt}] response = client.chat.completions.create( model=model, messages=messages, temperature=0, # this is the degree of randomness of the model's output ) return response.choices[0].message.content def get_completion_from_messages(messages, model="solar-1-mini-chat", temperature=0): response = client.chat.completions.create( model=model, messages=messages, temperature=temperature, # this is the degree of randomness of the model's output ) return response.choices[0].message.content # Chat message component (renders a chat bubble) def ChatMessage(msg, user): bubble_class = "chat-bubble-primary" if user else 'chat-bubble-secondary' chat_class = "chat-end" if user else 'chat-start' return Div(cls=f"chat {chat_class}")( Div('user' if user else 'assistant', cls="chat-header"), Div(msg, cls=f"chat-bubble {bubble_class}"), Hidden(msg, name="messages") ) # The input field for the user message. Also used to clear the # input field after sending a message via an OOB swap def ChatInput(): return Input(name='msg', id='msg-input', placeholder="Type a message", cls="input input-bordered w-full", hx_swap_oob='true') # The main screen @app.get def index(): return Titled("MinorityMap", Link(rel="stylesheet", href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/ui-darkness/jquery-ui.css"), Script(src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"), Script(src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"), Link(rel="stylesheet", href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css"), Style(style), Script(src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js"), #Body(onload='load()'), Form(id="chat_form", hx_post=send, hx_target="#chatlist", hx_swap="beforeend")( Div(id='mapid'), Div(cls="flex space-x-2 mt-2")( Group(ChatInput(), Button("Send", cls="btn btn-primary")) ) ), Div(id="chatlist", cls="chat-box h-[73vh] overflow-y-auto"), Script(js) ) # Handle the form submission @app.post def send(msg:str, messages:list[str]=None): if not messages: messages = [] messages.append(msg.rstrip()) print(messages[0]) post_append_str = ' Return as a JSON response with GeoLocation' r = get_completion(messages[0] + post_append_str) # get response from chat model return (ChatMessage(msg, True), # The user's message ChatMessage(r.rstrip(), False), # The chatbot's response ChatInput()) # And clear the input field via an OOB swap serve()