[rubyforgood#5777] Add prototype buttons with form step navigation

priyapower · Jul 15, 2024 · 9f2aa58 · 9f2aa58
1 parent 9462d13
commit 9f2aa58
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/app/components/form/title_component.html.erb b/app/components/form/title_component.html.erb
@@ -11,6 +11,9 @@
       <h2 class="col-12 col-md-6 case-contacts-form-subtitle"><%= @subtitle %></h2>
       <% if @progress %>
         <div class="col-12 col-md-6 align-items-center d-flex gap-2 mt-2 mt-md-0">
+        <% if @navigable %>
+          <%= link_to 'BACK', @nav_back %>
+        <% end %>
           <p class="col-auto">
             <%= @steps_in_text %>
           </p>
@@ -20,6 +23,9 @@
             </div>
           </div>
         </div>
+        <% if @navigable %>
+          <%= link_to 'NEXT', @nav_next %>
+        <% end %>
       <% end %>
     </div>
 

diff --git a/app/components/form/title_component.rb b/app/components/form/title_component.rb
@@ -1,11 +1,16 @@
 # frozen_string_literal: true
 
 class Form::TitleComponent < ViewComponent::Base
-  def initialize(title:, subtitle:, step: nil, total_steps: nil, notes: nil, autosave: false)
+  def initialize(title:, subtitle:, step: nil, total_steps: nil, notes: nil, autosave: false, navigable: false, nav_back: nil, nav_next: nil)
     @title = title
     @subtitle = subtitle
     @notes = notes
     @autosave = autosave
+    @navigable = navigable
+    # @nav_back = nav_back if navigable
+    # @nav_next = nav_next if navigable
+    @nav_back = nav_back
+    @nav_next = nav_next
 
     if step && total_steps
       @steps_in_text = "Step #{step} of #{total_steps}"

diff --git a/app/views/case_contacts/form/details.html.erb b/app/views/case_contacts/form/details.html.erb
@@ -1,4 +1,4 @@
-<%= render(Form::TitleComponent.new(title: @case_contact.decorate.form_title, subtitle: "Contact details", step: @page, total_steps: @total_pages)) %>
+<%= render(Form::TitleComponent.new(title: @case_contact.decorate.form_title, subtitle: "Contact details", step: @page, total_steps: @total_pages, navigable: true, nav_back: leave_case_contacts_form_path, nav_next: next_wizard_path)) %>
 
 <div>
   <%= form_with(model: @case_contact, url: wizard_path(nil, case_contact_id: @case_contact.id), local: true, id: "casa-contact-form", class: "component-validated-form") do |form| %>