refactoring folders

lib/elixir_ai_web/features/home/ai_providers_live.ex

@@ -0,0 +1,189 @@
+defmodule ElixirAiWeb.AiProvidersLive do
+  use ElixirAiWeb, :live_component
+  import ElixirAiWeb.FormComponents
+  alias ElixirAi.AiProvider
+
+  def update(assigns, socket) do
+    {:ok,
+     socket
+     |> assign(assigns)
+     |> assign_new(:show_form, fn -> false end)
+     |> assign_new(:confirm_delete_id, fn -> nil end)
+     |> assign_new(
+       :form_data,
+       fn ->
+         %{
+           "name" => "",
+           "model_name" => "",
+           "api_token" => "",
+           "completions_url" => ""
+         }
+       end
+     )
+     |> assign_new(:error, fn -> nil end)}
+  end
+
+  def render(assigns) do
+    ~H"""
+    <div>
+      <div class="flex items-center justify-between mb-8">
+        <h1 class="text-lg font-semibold text-seafoam-300">AI Providers</h1>
+        <button
+          phx-click="toggle_form"
+          phx-target={@myself}
+          class="px-3 py-1 rounded text-sm border border-seafoam-900/40 bg-seafoam-950/20 text-seafoam-300 hover:border-seafoam-700 hover:bg-seafoam-950/40 transition-colors"
+        >
+          {if @show_form, do: "Cancel", else: "Add Provider"}
+        </button>
+      </div>
+
+      <%= if @show_form do %>
+        <form
+          phx-submit="create_provider"
+          phx-target={@myself}
+          class="mb-8 space-y-2 p-4 rounded-lg border border-seafoam-900/40 bg-seafoam-950/10"
+        >
+          <.input type="text" name="name" value={@form_data["name"]} label="Provider Name" />
+          <.input type="text" name="model_name" value={@form_data["model_name"]} label="Model Name" />
+          <.input type="password" name="api_token" value={@form_data["api_token"]} label="API Token" />
+          <.input
+            type="text"
+            name="completions_url"
+            value={@form_data["completions_url"]}
+            label="Completions URL"
+          />
+          <button
+            type="submit"
+            class="w-full px-4 py-2 rounded text-sm border border-seafoam-900/40 bg-seafoam-950/20 text-seafoam-300 hover:border-seafoam-700 hover:bg-seafoam-950/40 transition-colors"
+          >
+            Create Provider
+          </button>r
+        </form>
+      <% end %>
+
+      <%= if @error do %>
+        <p class="mb-4 text-sm text-red-400">{@error}</p>
+      <% end %>
+
+      <ul class="space-y-2">
+        <%= if @providers == [] do %>
+          <li class="text-sm text-seafoam-700">No providers configured yet.</li>
+        <% end %>
+        <%= for provider <- @providers do %>
+          <li class="p-4 rounded-lg border border-seafoam-900/40 bg-seafoam-950/20">
+            <div class="flex items-start justify-between">
+              <div class="flex-1">
+                <h3 class="text-sm font-medium text-seafoam-300">{provider.name}</h3>
+                <p class="text-xs text-seafoam-500 mt-1">Model: {provider.model_name}</p>
+              </div>
+              <button
+                phx-click="delete_provider"
+                phx-value-id={provider.id}
+                phx-target={@myself}
+                class="ml-4 px-2 py-1 rounded text-xs border border-red-900/40 bg-red-950/20 text-red-400 hover:border-red-700 hover:bg-red-950/40 transition-colors"
+              >
+                Delete
+              </button>
+            </div>
+          </li>
+        <% end %>
+      </ul>
+
+      <%= if @confirm_delete_id do %>
+        <.modal>
+          <h2 class="text-sm font-semibold text-seafoam-300 mb-2">Delete Provider</h2>
+          <p class="text-sm text-seafoam-500 mb-6">
+            Are you sure you want to delete this provider? This action cannot be undone.
+          </p>
+          <div class="flex gap-3 justify-end">
+            <button
+              phx-click="cancel_delete"
+              phx-target={@myself}
+              class="px-4 py-2 rounded text-sm border border-seafoam-900/40 bg-seafoam-950/20 text-seafoam-300 hover:border-seafoam-700 hover:bg-seafoam-950/40 transition-colors"
+            >
+              Cancel
+            </button>
+            <button
+              phx-click="confirm_delete"
+              phx-target={@myself}
+              class="px-4 py-2 rounded text-sm border border-red-900/40 bg-red-950/20 text-red-400 hover:border-red-700 hover:bg-red-950/40 transition-colors"
+            >
+              Delete
+            </button>
+          </div>
+        </.modal>
+      <% end %>
+    </div>
+    """
+  end
+
+  def handle_event("toggle_form", _params, socket) do
+    {:noreply, assign(socket, show_form: !socket.assigns.show_form, error: nil)}
+  end
+
+  def handle_event("delete_provider", %{"id" => id}, socket) do
+    {:noreply, assign(socket, confirm_delete_id: id)}
+  end
+
+  def handle_event("cancel_delete", _params, socket) do
+    {:noreply, assign(socket, confirm_delete_id: nil)}
+  end
+
+  def handle_event("confirm_delete", _params, socket) do
+    case AiProvider.delete(socket.assigns.confirm_delete_id) do
+      :ok ->
+        {:noreply, assign(socket, confirm_delete_id: nil)}
+
+      _ ->
+        {:noreply, assign(socket, confirm_delete_id: nil, error: "Failed to delete provider")}
+    end
+  end
+
+  def handle_event("create_provider", params, socket) do
+    name = String.trim(params["name"])
+    model_name = String.trim(params["model_name"])
+    api_token = String.trim(params["api_token"])
+    completions_url = String.trim(params["completions_url"])
+
+    cond do
+      name == "" ->
+        {:noreply, assign(socket, error: "Provider name can't be blank")}
+
+      model_name == "" ->
+        {:noreply, assign(socket, error: "Model name can't be blank")}
+
+      api_token == "" ->
+        {:noreply, assign(socket, error: "API token can't be blank")}
+
+      completions_url == "" ->
+        {:noreply, assign(socket, error: "Completions URL can't be blank")}
+
+      true ->
+        attrs = %{
+          name: name,
+          model_name: model_name,
+          api_token: api_token,
+          completions_url: completions_url
+        }
+
+        case AiProvider.create(attrs) do
+          :ok ->
+            {:noreply,
+             socket
+             |> assign(show_form: false)
+             |> assign(
+               form_data: %{
+                 "name" => "",
+                 "model_name" => "",
+                 "api_token" => "",
+                 "completions_url" => ""
+               }
+             )
+             |> assign(error: nil)}
+
+          _ ->
+            {:noreply, assign(socket, error: "Failed to create provider")}
+        end
+    end
+  end
+end

lib/elixir_ai_web/features/home/home_live.ex

@@ -0,0 +1,152 @@
+defmodule ElixirAiWeb.HomeLive do
+  use ElixirAiWeb, :live_view
+  import ElixirAiWeb.FormComponents
+  alias ElixirAi.{ConversationManager, AiProvider}
+  require Logger
+  import ElixirAi.PubsubTopics
+
+  def mount(_params, _session, socket) do
+    if connected?(socket) do
+      Phoenix.PubSub.subscribe(ElixirAi.PubSub, providers_topic())
+      :pg.join(ElixirAi.LiveViewPG, {:liveview, __MODULE__}, self())
+      send(self(), :load_data)
+    end
+
+    {:ok,
+     socket
+     |> assign(conversations: [])
+     |> assign(ai_providers: [])
+     |> assign(new_name: "")
+     |> assign(error: nil)}
+  end
+
+  def render(assigns) do
+    ~H"""
+    <div class="max-w-lg mx-auto mt-16 px-4 space-y-16">
+      <div>
+        <h1 class="text-lg font-semibold text-seafoam-300 mb-8">Conversations</h1>
+
+        <.conversation_list conversations={@conversations} />
+
+        <.create_conversation_form new_name={@new_name} ai_providers={@ai_providers} />
+
+        <%= if @error do %>
+          <p class="mt-2 text-sm text-red-400">{@error}</p>
+        <% end %>
+      </div>
+
+      <div>
+        <.live_component
+          module={ElixirAiWeb.AiProvidersLive}
+          id="ai-providers"
+          providers={@ai_providers}
+        />
+      </div>
+    </div>
+    """
+  end
+
+  defp conversation_list(assigns) do
+    ~H"""
+    <ul class="mb-8 space-y-2">
+      <%= if @conversations == [] do %>
+        <li class="text-sm text-seafoam-700">No conversations yet.</li>
+      <% end %>
+      <%= for name <- @conversations do %>
+        <li>
+          <.link
+            navigate={~p"/chat/#{name}"}
+            class="block px-4 py-2 rounded-lg border border-seafoam-900/40 bg-seafoam-950/20 text-seafoam-300 hover:border-seafoam-700 hover:bg-seafoam-950/40 transition-colors text-sm"
+          >
+            {name}
+          </.link>
+        </li>
+      <% end %>
+    </ul>
+    """
+  end
+
+  defp create_conversation_form(assigns) do
+    ~H"""
+    <form phx-submit="create" class="space-y-2">
+      <.input type="text" name="name" value={@new_name} label="Conversation Name" />
+      <select
+        name="ai_provider_id"
+        class="w-full rounded px-3 py-2 text-sm bg-seafoam-950/20 border border-seafoam-900/40 text-seafoam-100 focus:outline-none focus:ring-1 focus:ring-seafoam-700"
+      >
+        <%= for {provider, index} <- Enum.with_index(@ai_providers) do %>
+          <option value={provider.id} selected={index == 0}>
+            {provider.name} - {provider.model_name}
+          </option>
+        <% end %>
+      </select>
+      <button
+        type="submit"
+        class="w-full px-4 py-2 rounded text-sm border border-seafoam-900/40 bg-seafoam-950/20 text-seafoam-300 hover:border-seafoam-700 hover:bg-seafoam-950/40 transition-colors"
+      >
+        Create
+      </button>
+    </form>
+    """
+  end
+
+  def handle_event("create", %{"name" => name, "ai_provider_id" => provider_id}, socket) do
+    name = String.trim(name)
+
+    cond do
+      name == "" ->
+        {:noreply, assign(socket, error: "Name can't be blank")}
+
+      provider_id == "" ->
+        {:noreply, assign(socket, error: "Please select an AI provider")}
+
+      true ->
+        case ConversationManager.create_conversation(name, provider_id) do
+          {:ok, _pid} ->
+            {:noreply,
+             socket
+             |> push_navigate(to: ~p"/chat/#{name}")
+             |> assign(error: nil)}
+
+          {:error, :already_exists} ->
+            {:noreply, assign(socket, error: "A conversation with that name already exists")}
+
+          {:error, :failed_to_load} ->
+            {:noreply,
+             assign(socket,
+               error: "Conversation was saved but failed to load"
+             )}
+
+          _ ->
+            {:noreply, assign(socket, error: "Failed to create conversation")}
+        end
+    end
+  end
+
+  def handle_info(:load_data, socket) do
+    conversations = ConversationManager.list_conversations()
+
+    Logger.debug(
+      "Conversations: #{inspect(conversations, limit: :infinity, printable_limit: :infinity)}"
+    )
+
+    ai_providers = AiProvider.all()
+
+    Logger.debug(
+      "AI Providers: #{inspect(ai_providers, limit: :infinity, printable_limit: :infinity)}"
+    )
+
+    {:noreply,
+     socket
+     |> assign(conversations: conversations)
+     |> assign(ai_providers: ai_providers)}
+  end
+
+  def handle_info({:provider_added, _attrs}, socket) do
+    {:noreply, assign(socket, ai_providers: AiProvider.all())}
+  end
+
+  def handle_info({:provider_deleted, _id}, socket) do
+    {:noreply, assign(socket, ai_providers: AiProvider.all())}
+  end
+end