Merge pull request #1008 from OpenFn/add_default_name_to_workflow

Add default name to workflow

CHANGELOG.md

@@ -25,6 +25,8 @@ and this project adheres to
   [#951](https://github.com/OpenFn/Lightning/issues/951)
 - Fix issue where checking a credential type radio button shows as unchecked on
   first click. [#976](https://github.com/OpenFn/Lightning/issues/976)
+- Return the pre-filled workflow names
+  [#971](https://github.com/OpenFn/Lightning/issues/971)
 
 ## [v0.7.0-pre5] - 2023-07-28
 

assets/js/workflow-editor/index.ts

@@ -82,7 +82,7 @@ export default {
     });
 
     this.handleEvent('navigate', (e: { href: string }) => {
-      const id = new URL(e.href).searchParams.get('s');
+      const id = new URL(e.href, window.location.href).searchParams.get('s');
       this.component?.render(id);
     });
 

lib/lightning_web/live/workflow_live/components.ex

@@ -14,7 +14,6 @@ defmodule LightningWeb.WorkflowLive.Components do
         />
         <%= for workflow <- @workflows do %>
           <.workflow_card
-            can_create_workflow={@can_create_workflow}
             can_delete_workflow={@can_delete_workflow}
             workflow={%{workflow | name: workflow.name || "Untitled"}}
             project={@project}
@@ -25,45 +24,56 @@ defmodule LightningWeb.WorkflowLive.Components do
     """
   end
 
+  attr :project, :map, required: true
+  attr :can_delete_workflow, :boolean, default: false
+  attr :workflow, :map, required: true
+
   def workflow_card(assigns) do
+    assigns =
+      assigns
+      |> assign(
+        relative_updated_at:
+          Timex.Format.DateTime.Formatters.Relative.format!(
+            assigns.workflow.updated_at,
+            "{relative}"
+          )
+      )
+
     ~H"""
     <div>
-      <.link
-        id={"workflow-card-#{@workflow.id}"}
-        navigate={~p"/projects/#{@project.id}/w/#{@workflow.id}"}
-        class="col-span-1 rounded-md shadow-sm"
-        role="button"
-      >
-        <div class="flex flex-1 items-center justify-between truncate rounded-md border border-gray-200 bg-white hover:bg-gray-50">
-          <div class="flex-1 truncate px-4 py-2 text-sm">
+      <div class="flex flex-1 items-center justify-between truncate rounded-md border border-gray-200 bg-white hover:bg-gray-50">
+        <.link
+          id={"workflow-card-#{@workflow.id}"}
+          navigate={~p"/projects/#{@project.id}/w/#{@workflow.id}"}
+          class="flex-1 rounded-md shadow-sm"
+          role="button"
+        >
+          <div class="truncate px-4 py-2 text-sm">
             <span class="font-medium text-gray-900 hover:text-gray-600">
               <%= @workflow.name %>
             </span>
             <p class="text-gray-500 text-xs">
-              Created <%= Timex.Format.DateTime.Formatters.Relative.format!(
-                @workflow.updated_at,
-                "{relative}"
-              ) %>
+              Created <%= @relative_updated_at %>
             </p>
           </div>
-          <div class="flex-shrink-0 pr-2">
-            <div
-              :if={@can_delete_workflow}
-              class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-transparent text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
+        </.link>
+        <div class="flex-shrink-0 pr-2">
+          <div
+            :if={@can_delete_workflow}
+            class="inline-flex h-8 w-8 items-center justify-center rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
+          >
+            <.link
+              href="#"
+              phx-click="delete_workflow"
+              phx-value-id={@workflow.id}
+              data-confirm="Are you sure you'd like to delete this workflow?"
+              class="inline-flex h-8 w-8 items-center justify-center rounded-full text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
             >
-              <.link
-                href="#"
-                phx-click="delete_workflow"
-                phx-value-id={@workflow.id}
-                data-confirm="Are you sure you'd like to delete this workflow?"
-                class="inline-flex h-8 w-8 items-center justify-center rounded-full bg-transparent text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
-              >
-                <Icon.trash class="h-5 w-5 text-slate-300 hover:text-rose-700" />
-              </.link>
-            </div>
+              <Icon.trash class="h-5 w-5 text-slate-300 hover:text-rose-700" />
+            </.link>
           </div>
         </div>
-      </.link>
+      </div>
     </div>
     """
   end

lib/lightning_web/live/workflow_live/edit.ex

@@ -27,7 +27,13 @@ defmodule LightningWeb.WorkflowLive.Edit do
       assigns
       |> assign(
         base_url:
-          ~p"/projects/#{assigns.project}/w/#{assigns.workflow.id || "new"}",
+          case assigns.live_action do
+            :new ->
+              ~p"/projects/#{assigns.project}/w/new"
+
+            :edit ->
+              ~p"/projects/#{assigns.project}/w/#{assigns.workflow}"
+          end,
         workflow_form: to_form(assigns.changeset)
       )
 
@@ -320,18 +326,23 @@ defmodule LightningWeb.WorkflowLive.Edit do
   end
 
   @impl true
-  def handle_params(params, _url, socket) do
+  def handle_params(params, url, socket) do
     {:noreply,
      apply_action(socket, socket.assigns.live_action, params)
-     |> apply_selection_params(params)}
+     |> apply_selection_params(params)
+     |> assign_url(url)}
   end
 
   def apply_action(socket, :new, _params) do
     if socket.assigns.workflow do
       socket
     else
       socket
-      |> assign_workflow(%Workflow{project_id: socket.assigns.project.id})
+      |> assign_workflow(%Workflow{
+        project_id: socket.assigns.project.id,
+        name: Lightning.Name.generate(),
+        id: Ecto.UUID.generate()
+      })
     end
     |> assign(page_title: "New Workflow")
   end
@@ -429,14 +440,17 @@ defmodule LightningWeb.WorkflowLive.Edit do
             socket.assigns.workflow_params
         end
 
-      socket = socket |> apply_params(next_params)
+      socket =
+        socket
+        |> apply_params(next_params)
 
       socket =
         Lightning.Repo.insert_or_update(socket.assigns.changeset)
         |> case do
           {:ok, workflow} ->
             socket
             |> assign_workflow(workflow)
+            |> push_patch(to: build_next_path(socket, workflow), replace: true)
             |> put_flash(:info, "Workflow saved")
 
           {:error, changeset} ->
@@ -651,6 +665,17 @@ defmodule LightningWeb.WorkflowLive.Edit do
     end
   end
 
+  defp assign_url(socket, url) do
+    socket
+    |> assign(url: URI.parse(url))
+  end
+
+  defp build_next_path(socket, workflow) do
+    %{project: project, selection_params: selection_params} = socket.assigns
+
+    ~p"/projects/#{project}/w/#{workflow}?#{selection_params |> Map.reject(&match?({_, nil}, &1))}"
+  end
+
   # find the changeset for the selected item
   # it could be an edge, a job or a trigger
   defp find_item_in_changeset(changeset, id) do

test/lightning_web/live/workflow_live/edit_test.exs

@@ -48,7 +48,15 @@ defmodule LightningWeb.WorkflowLive.EditTest do
 
       assert view |> push_patches_to_view(initial_workflow_patchset(project))
 
+      workflow_name = view |> get_workflow_params() |> Map.get("name")
+
+      refute workflow_name == "", "the workflow should have a pre-filled name"
+
+      assert view |> element("#workflow_name_form") |> render() =~ workflow_name
+      assert view |> save_is_disabled?()
+
       view |> fill_workflow_name("My Workflow")
+
       assert view |> save_is_disabled?()
 
       {job, _, _} = view |> select_first_job()

test/lightning_web/live/workflow_live/index_test.exs

@@ -76,7 +76,7 @@ defmodule LightningWeb.WorkflowLive.IndexTest do
         |> click_create_workflow()
         |> follow_redirect(conn, "/projects/#{project.id}/w/new")
 
-      assert view |> element("#workflow-edit-") |> has_element?()
+      assert view |> element("div[id^=workflow-edit-]") |> has_element?()
     end
   end
 

test/support/workflow_live_helpers.ex

@@ -178,6 +178,10 @@ defmodule Lightning.WorkflowLive.Helpers do
     |> Enum.find_index(fn j -> j["id"] == job.id end)
   end
 
+  def get_workflow_params(view) do
+    :sys.get_state(view.pid).socket.assigns.workflow_params
+  end
+
   @doc """
   This helper replicates the data sent to the server when a new workflow is
   created, and the WorkflowDiagram component is mounted and determines the