Improve the /new view so creating workflows feels seamless

This commit is contained in:
Jason Zimdars
2025-09-04 15:59:56 -05:00
parent 65d965bc5e
commit d46c3d4163
2 changed files with 13 additions and 10 deletions
+1 -1
View File
@@ -1,5 +1,5 @@
<%= turbo_frame_tag workflow do %>
<article class="panel" style="--panel-size: 40ch;">
<article class="panel" style="--panel-size: 40ch;" style="view-transition-name: <%= dom_id(workflow) %>">
<div class="flex gap-half align-center justify-starts">
<%= turbo_frame_tag dom_id(workflow, :header) do %>
<%= link_to edit_workflow_path(workflow) do %>
+12 -9
View File
@@ -1,17 +1,20 @@
<% @page_title = "Create a new Workflow" %>
<% @page_title = "Workflows" %>
<% content_for :header do %>
<%= render "filters/menu", user_filtering: @user_filtering %>
<h1 class="header__title"><%= @page_title %></h1>
<% end %>
<article class="panel center margin-block-start flex flex-column gap" style="view-transition-name: <%= dom_id(@workflow) %>">
<%= form_with model: @workflow, url: workflows_path, data: { controller: "form" } do |form| %>
<%= form.text_field :name, required: true, autofocus: true, class: "input txt-large", placeholder: "Name your Workflow…", data: { action: "keydown.esc@document->form#cancel" } %>
<%= form.button type: :submit, class: "btn btn--reversed center margin-block-start txt-large" do %>
<%= icon_tag "check" %>
<span class="for-screen-reader">Create Workflow</span>
<article class="panel center" style="--panel-size: 40ch;" style="view-transition-name: <%= dom_id(@workflow) %>">
<div class="flex gap-half align-center justify-starts">
<%= form_with model: @workflow, url: workflows_path, data: { controller: "form" } do |form| %>
<h2 class="txt-large margin-none">
<%= form.text_field :name, required: true, autofocus: true, class: "input", placeholder: "Name your Workflow…", data: { action: "keydown.esc@document->form#cancel" } %>
</h2>
<%= form.button type: :submit, class: "btn btn--reversed center margin-block-start txt-medium" do %>
<span>Create Workflow</span>
<% end %>
<%= link_to "Go back", workflows_path, data: { form_target: "cancel" }, hidden: true %>
<% end %>
<%= link_to "Go back", workflows_path, data: { form_target: "cancel" }, hidden: true %>
<% end %>
</div>
</article>