defmodule EzcontainerRailwayWeb.ContainerCreateLive do
  alias EzcontainerRailway.Railway
  alias Phoenix.Component
  use Phoenix.LiveView
  use EzcontainerRailwayWeb, :live_view

  def render(assigns) do
    ~H"""
    <div class="flex space-around w-full">
        <article class="m-auto">
        <%= if @target == "image" do %>
            <.form for={@form} phx-submit="create_container">
                <div class="grid grid-rows-1 grid-cols-4 gap-4"> 
                    <label class="label flex space-between">
                        <span class="label-text">Container Name</span>
                    </label>
                    <input class="input input-bordered inline col-span-3" name="name" />
                    <label class="label flex space-between">
                        <span class="label-text-alt">Tag</span>
                    </label>
                    <input class="input input-bordered inline" name="tag" />
                </div>
                <div class="text-center mt-6">
                    <button phx-submit class={"btn btn-primary #{if @loading, do: "loading-dots"}"}>CREATE</button>
                </div>
                <input type="hidden" name="target" value="container" />
            </.form>
        <% end %>
        <%= if @target == "repo" do %>
            <.form for={@form} phx-submit="create_container">
                <div class="grid grid-rows-1 grid-cols-4 gap-4"> 
                    <label class="label flex space-between">
                        <span class="label-text">Repo</span>
                    </label>
                    <input class="input input-bordered inline col-span-3" name="name" />
                    <label class="label flex space-between">
                        <span class="label-text-alt">Branch</span>
                    </label>
                    <input class="input input-bordered inline" name="tag" />
                </div>
                <div class="text-center mt-6">
                    <button phx-submit class={"btn btn-primary #{if @loading, do: "loading-spinner"}"}>CREATE</button>
                </div>
                <input type="hidden" name="target" value="repo" />
            </.form>
        <% end %>
            <div class="flex w-full mt-5 space-around">
                <button class="m-auto btn btn-secondary" phx-click="switch_target">Switch to <%= if @target == "repo", do: "Image", else: "Repo" %></button>
            </div>
        </article>
    </div>
    """
  end

  def mount(_params, session, socket) do
    form = Component.to_form(%{"name" => "", "tag" => ""})
    
    {:ok, socket |> assign(form: form, target: "image", session: session, loading: false)}
  end

  def handle_info({:create, data}, socket) do
    {:ok, resp} = Railway.create_service(
      data["name"],
      "image",
      socket.assigns.session["railway_token"]
    )

    {:noreply, socket |> put_flash(:info, "container deplying") |> push_redirect(to: "/containers")}
  end

  def handle_event("create_container", data, socket) do
    send(self(), {:create, data})
    {:noreply, socket |> assign(loading: true)}
  end

  def handle_event("switch_target", _, socket) do
    IO.inspect socket.assigns
    case socket.assigns.target do
      "repo" -> {:noreply, socket |> assign(target: "image")}
      "image" -> {:noreply, socket |> assign(target: "repo")}
    end
  end
end