This commit is contained in:
@@ -95,7 +95,15 @@ defmodule ElixirAi.ChatRunner do
|
|||||||
"properties" => %{
|
"properties" => %{
|
||||||
"color" => %{
|
"color" => %{
|
||||||
"type" => "string",
|
"type" => "string",
|
||||||
"enum" => ElixirAiWeb.ChatLive.valid_background_colors()
|
"enum" => [
|
||||||
|
"bg-cyan-950/30",
|
||||||
|
"bg-red-950/30",
|
||||||
|
"bg-green-950/30",
|
||||||
|
"bg-blue-950/30",
|
||||||
|
"bg-yellow-950/30",
|
||||||
|
"bg-purple-950/30",
|
||||||
|
"bg-pink-950/30"
|
||||||
|
]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"required" => ["color"]
|
"required" => ["color"]
|
||||||
|
|||||||
@@ -3,22 +3,11 @@ defmodule ElixirAiWeb.ChatLive do
|
|||||||
require Logger
|
require Logger
|
||||||
import ElixirAiWeb.Spinner
|
import ElixirAiWeb.Spinner
|
||||||
import ElixirAiWeb.ChatMessage
|
import ElixirAiWeb.ChatMessage
|
||||||
|
import ElixirAiWeb.ChatProviderDisplay
|
||||||
alias ElixirAi.ChatRunner
|
alias ElixirAi.ChatRunner
|
||||||
alias ElixirAi.ConversationManager
|
alias ElixirAi.ConversationManager
|
||||||
import ElixirAi.PubsubTopics
|
import ElixirAi.PubsubTopics
|
||||||
|
|
||||||
def valid_background_colors do
|
|
||||||
[
|
|
||||||
"bg-cyan-950/30",
|
|
||||||
"bg-red-950/30",
|
|
||||||
"bg-green-950/30",
|
|
||||||
"bg-blue-950/30",
|
|
||||||
"bg-yellow-950/30",
|
|
||||||
"bg-purple-950/30",
|
|
||||||
"bg-pink-950/30"
|
|
||||||
]
|
|
||||||
end
|
|
||||||
|
|
||||||
def mount(%{"name" => name}, _session, socket) do
|
def mount(%{"name" => name}, _session, socket) do
|
||||||
case ConversationManager.open_conversation(name) do
|
case ConversationManager.open_conversation(name) do
|
||||||
{:ok, _pid} ->
|
{:ok, _pid} ->
|
||||||
@@ -35,6 +24,7 @@ defmodule ElixirAiWeb.ChatLive do
|
|||||||
|> assign(messages: conversation.messages)
|
|> assign(messages: conversation.messages)
|
||||||
|> assign(streaming_response: conversation.streaming_response)
|
|> assign(streaming_response: conversation.streaming_response)
|
||||||
|> assign(background_color: "bg-cyan-950/30")
|
|> assign(background_color: "bg-cyan-950/30")
|
||||||
|
|> assign(provider: conversation.provider)
|
||||||
|> assign(db_error: nil)}
|
|> assign(db_error: nil)}
|
||||||
|
|
||||||
{:error, :not_found} ->
|
{:error, :not_found} ->
|
||||||
@@ -50,6 +40,7 @@ defmodule ElixirAiWeb.ChatLive do
|
|||||||
|> assign(messages: [])
|
|> assign(messages: [])
|
||||||
|> assign(streaming_response: nil)
|
|> assign(streaming_response: nil)
|
||||||
|> assign(background_color: "bg-cyan-950/30")
|
|> assign(background_color: "bg-cyan-950/30")
|
||||||
|
|> assign(provider: nil)
|
||||||
|> assign(db_error: Exception.format(:error, reason))}
|
|> assign(db_error: Exception.format(:error, reason))}
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
@@ -61,7 +52,8 @@ defmodule ElixirAiWeb.ChatLive do
|
|||||||
<.link navigate={~p"/"} class="text-cyan-700 hover:text-cyan-400 transition-colors">
|
<.link navigate={~p"/"} class="text-cyan-700 hover:text-cyan-400 transition-colors">
|
||||||
←
|
←
|
||||||
</.link>
|
</.link>
|
||||||
{@conversation_name}
|
<span class="flex-1">{@conversation_name}</span>
|
||||||
|
<.chat_provider_display provider={@provider} />
|
||||||
</div>
|
</div>
|
||||||
<%= if @db_error do %>
|
<%= if @db_error do %>
|
||||||
<div class="mx-4 mt-2 px-3 py-2 rounded text-sm text-red-400 bg-red-950/40" role="alert">
|
<div class="mx-4 mt-2 px-3 py-2 rounded text-sm text-red-400 bg-red-950/40" role="alert">
|
||||||
33
lib/elixir_ai_web/chat/chat_provider_display.ex
Normal file
33
lib/elixir_ai_web/chat/chat_provider_display.ex
Normal file
@@ -0,0 +1,33 @@
|
|||||||
|
defmodule ElixirAiWeb.ChatProviderDisplay do
|
||||||
|
use Phoenix.Component
|
||||||
|
|
||||||
|
attr :provider, :any, default: nil
|
||||||
|
|
||||||
|
def chat_provider_display(%{provider: nil} = assigns) do
|
||||||
|
~H"""
|
||||||
|
<div class="flex items-center gap-1.5 text-xs text-cyan-900 italic">
|
||||||
|
No provider set
|
||||||
|
</div>
|
||||||
|
"""
|
||||||
|
end
|
||||||
|
|
||||||
|
def chat_provider_display(assigns) do
|
||||||
|
~H"""
|
||||||
|
<div class="flex items-center gap-2 text-xs min-w-0">
|
||||||
|
<div class="flex items-center gap-1.5 px-2 py-1 rounded bg-cyan-950/50 border border-cyan-900/40 min-w-0">
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="currentColor"
|
||||||
|
class="w-3 h-3 shrink-0 text-cyan-600"
|
||||||
|
>
|
||||||
|
<path d="M10 9a3 3 0 1 0 0-6 3 3 0 0 0 0 6ZM6 8a2 2 0 1 1-4 0 2 2 0 0 1 4 0ZM1.49 15.326a.78.78 0 0 1-.358-.442 3 3 0 0 1 4.308-3.516 6.484 6.484 0 0 0-1.905 3.959c-.023.222-.014.442.025.654a4.97 4.97 0 0 1-2.07-.655ZM16.44 15.98a4.97 4.97 0 0 0 2.07-.654.78.78 0 0 0 .357-.442 3 3 0 0 0-4.308-3.516 6.484 6.484 0 0 1 1.907 3.96 2.32 2.32 0 0 1-.026.654ZM18 8a2 2 0 1 1-4 0 2 2 0 0 1 4 0ZM5.304 16.19a.844.844 0 0 1-.277-.71 5 5 0 0 1 9.947 0 .843.843 0 0 1-.277.71A6.975 6.975 0 0 1 10 18a6.974 6.974 0 0 1-4.696-1.81Z" />
|
||||||
|
</svg>
|
||||||
|
<span class="text-cyan-400 font-medium truncate">{@provider.name}</span>
|
||||||
|
<span class="text-cyan-800">·</span>
|
||||||
|
<span class="text-cyan-600 truncate">{@provider.model_name}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
"""
|
||||||
|
end
|
||||||
|
end
|
||||||
Reference in New Issue
Block a user