Merge pull request #2087 from alphagov/edit-downtime-page-transition

Transition edit downtime and destroy downtime to use the design system

app/assets/stylesheets/downtimes.scss

@@ -10,6 +10,10 @@
 
 .downtimes__table-link {
   @include govuk-media-query($from: "tablet") {
-    white-space: nowrap;  
+    white-space: nowrap;
   }
 }
+
+.remove-link, .remove-link:visited{
+  color: govuk-colour("red");
+}

app/controllers/downtimes_controller.rb

@@ -1,7 +1,6 @@
 class DowntimesController < ApplicationController
   before_action :require_govuk_editor
   before_action :load_edition, except: [:index]
-  before_action :process_params, only: %i[update]
 
   layout "design_system"
 
@@ -39,19 +38,33 @@ def edit
   def update
     @downtime = Downtime.for(@edition.artefact)
 
-    if params["commit"] == "Cancel downtime"
+    if params[:downtime]
+      datetime_validation_errors = datetime_validation_errors(downtime_params, %w[start_time end_time])
+      if datetime_validation_errors.empty? && @downtime.update(downtime_params)
+        DowntimeScheduler.schedule_publish_and_expiry(@downtime)
+        flash[:success] = "#{edition_link} downtime message re-scheduled (from #{view_context.downtime_datetime(@downtime)})".html_safe
+        redirect_to downtimes_path
+      else
+        @downtime.valid? # Make sure the model validations have run
+        datetime_validation_errors.each do |name, message|
+          # Remove any default messages for this field added by the model validation
+          @downtime.errors.delete(name)
+          @downtime.errors.add(name, message)
+        end
+        render :edit
+      end
+    else
       DowntimeRemover.destroy_immediately(@downtime)
       flash[:success] = "#{edition_link} downtime message cancelled".html_safe
       redirect_to downtimes_path
-    elsif @downtime.update(downtime_params)
-      DowntimeScheduler.schedule_publish_and_expiry(@downtime)
-      flash[:success] = "#{edition_link} downtime message re-scheduled (from #{view_context.downtime_datetime(@downtime)})".html_safe
-      redirect_to downtimes_path
-    else
-      render :edit
     end
   end
 
+  def destroy
+    @downtime = Downtime.for(@edition.artefact)
+    render :delete
+  end
+
 private
 
   def downtime_params
@@ -67,10 +80,6 @@ def load_edition
     @edition = Edition.find(params[:edition_id])
   end
 
-  def process_params
-    squash_multiparameter_datetime_attributes(downtime_params, %w[start_time end_time])
-  end
-
   def edition_link
     view_context.link_to(@edition.title, edit_edition_downtime_path(@edition), class: "link-inherit bold")
   end

app/models/downtime.rb

@@ -9,7 +9,7 @@ class Downtime
   belongs_to :artefact, optional: true
 
   validate :start_time_precedes_end_time
-  validate :end_time_is_in_future, on: :create
+  validate :end_time_is_in_future
   validates :message, :start_time, :end_time, :artefact, presence: true
 
   def self.for(artefact)

app/views/downtimes/_form.html.erb

@@ -7,32 +7,32 @@
   year: {
     name: "downtime[start_time(1i)]",
     label: "Year",
-    value: params.dig("downtime", "start_time(1i)"),
+    value: params.dig("downtime", "start_time(1i)") || @downtime.start_time&.year,
     width: 4,
   },
   month: {
     name: "downtime[start_time(2i)]",
     label: "Month",
-    value: params.dig("downtime", "start_time(2i)"),
+    value: params.dig("downtime", "start_time(2i)") || @downtime.start_time&.month,
     width: 2,
   },
   day: {
     id: "downtime_start_time",
     name: "downtime[start_time(3i)]",
     label: "Day",
-    value: params.dig("downtime", "start_time(3i)"),
+    value: params.dig("downtime", "start_time(3i)") || @downtime.start_time&.day,
     width: 2,
   },
   hour: {
     name: "downtime[start_time(4i)]",
     label: "Hour",
-    value: params.dig("downtime", "start_time(4i)"),
+    value: params.dig("downtime", "start_time(4i)") || @downtime.start_time&.hour,
     width: 2,
   },
   minute: {
     name: "downtime[start_time(5i)]",
     label: "Minute",
-    value: params.dig("downtime", "start_time(5i)"),
+    value: params.dig("downtime", "start_time(5i)") || @downtime.start_time&.minute,
     width: 2,
   },
 } %>
@@ -44,32 +44,32 @@
   year: {
     name: "downtime[end_time(1i)]",
     label: "Year",
-    value: params.dig("downtime", "end_time(1i)"),
+    value: params.dig("downtime", "end_time(1i)") || @downtime.end_time&.year,
     width: 4,
   },
   month: {
     name: "downtime[end_time(2i)]",
     label: "Month",
-    value: params.dig("downtime", "end_time(2i)"),
+    value: params.dig("downtime", "end_time(2i)") || @downtime.end_time&.month,
     width: 2,
   },
   day: {
     id: "downtime_end_time",
     name: "downtime[end_time(3i)]",
     label: "Day",
-    value: params.dig("downtime", "end_time(3i)"),
+    value: params.dig("downtime", "end_time(3i)") || @downtime.end_time&.day,
     width: 2,
   },
   hour: {
     name: "downtime[end_time(4i)]",
     label: "Hour",
-    value: params.dig("downtime", "end_time(4i)"),
+    value: params.dig("downtime", "end_time(4i)") || @downtime.end_time&.hour,
     width: 2,
   },
   minute: {
     name: "downtime[end_time(5i)]",
     label: "Minute",
-    value: params.dig("downtime", "end_time(5i)"),
+    value: params.dig("downtime", "end_time(5i)") || @downtime.end_time&.minute,
     width: 2,
   },
 } %>
@@ -85,7 +85,7 @@
       hint: "Message is auto-generated once a schedule has been made.",
       id: "downtime_message",
       name: "downtime[message]",
-      value: params.dig("downtime", "message"),
+      value: params.dig("downtime", "message") || @downtime.message,
       error_items: errors_for(f.object.errors, :message),
     } %>
   </div>

app/views/downtimes/delete.html.erb

@@ -0,0 +1,19 @@
+<% content_for :page_title, 'Remove downtime message' %>
+<% content_for :title, 'Remove downtime message' %>
+
+<div class="govuk-grid-column-two-thirds">
+  <%= render "govuk_publishing_components/components/lead_paragraph", {
+    text: "Are you sure you want to remove the scheduled downtime message for #{@downtime.artefact.name}?",
+    margin_bottom: 8
+  } %>
+
+  <%= form_for @downtime, url: edition_downtime_path(@edition), html: { class: 'form well remove-top-margin', 'data-module': 'downtime-message' } do |f| %>
+    <div class="govuk-button-group">
+      <%= render "govuk_publishing_components/components/button", {
+        text: "Remove",
+        destructive: true
+      } %>
+      <%= link_to "Cancel", downtimes_path, class: "govuk-link govuk-link--no-visited-state" %>
+    </div>
+  <% end %>
+</div>

app/views/downtimes/edit.html.erb

@@ -1,19 +1,27 @@
-<% content_for :page_title, 'Re-schedule downtime message' %>
-
-<ul class="breadcrumb">
-  <li class="crumb"><%= link_to 'Downtime', downtimes_path %></li>
-  <li class="active"><%= @downtime.artefact.name %></li>
-</ul>
+<% content_for :page_title, 'Edit downtime message' %>
+<% content_for :title, 'Edit downtime message' %>
+<% content_for :title_context, @downtime.artefact.name %>
+<% unless @downtime.errors.empty? %>
+  <% content_for :error_summary, render("shared/error_summary", { object: @downtime })  %>
+<% end %>
 
-<div class="page-title">
-  <h1>
-    <span class="small"><%= @downtime.artefact.name %></span>
-    Re-schedule downtime message
-  </h1>
-</div>
+<div class="govuk-grid-column-two-thirds">
+  <%= render "govuk_publishing_components/components/lead_paragraph", {
+    text: "Downtime message appear on the service's start page one day before the downtime is due to occur.",
+    margin_bottom: 6
+  } %>
 
 <%= form_for @downtime, url: edition_downtime_path(@edition), html: { class: 'form well remove-top-margin', 'data-module': 'downtime-message' } do |f| %>
   <%= render 'form', f: f %>
-  <%= f.submit 'Re-schedule downtime message', class: 'js-submit btn btn-success' %>
-  <%= f.submit 'Cancel downtime', class: 'add-left-margin btn btn-danger' %>
+    <div class="govuk-button-group">
+      <%= render "govuk_publishing_components/components/button", {
+        text: "Save",
+        value: "save",
+        name: "save"
+      } %>
+
+      <%= link_to "Cancel", downtimes_path, class: "govuk-link govuk-link--no-visited-state" %>
+      <%= link_to "Remove", edition_destroy_downtime_path, class: "govuk-link remove-link" %>
+    </div>
 <% end %>
+</div>

config/routes.rb

@@ -49,7 +49,8 @@
       resource :downtime, only: %i[new create]
     end
     constraints FeatureConstraint.new("design_system_downtime_edit") do
-      resource :downtime, only: %i[edit update]
+      resource :downtime, only: %i[edit update destroy]
+      get "downtime" => "downtimes#destroy", as: :destroy_downtime
     end
     resource :downtime, only: %i[new create edit update destroy], controller: "legacy_downtimes"
   end

test/functional/downtimes_controller_test.rb

@@ -31,7 +31,7 @@ class DowntimesControllerTest < ActionController::TestCase
       should "redirect to the downtime index page" do
         DowntimeScheduler.stubs(:schedule_publish_and_expiry)
         post :create, params: { edition_id: edition.id, downtime: downtime_params }
-        assert_redirected_to controller: "legacy_downtimes", action: "index"
+        assert_redirected_to controller: "downtimes", action: "index"
       end
     end
 
@@ -107,13 +107,13 @@ class DowntimesControllerTest < ActionController::TestCase
     context "cancelling scheduled downtime" do
       should "invoke the DowntimeRemover" do
         DowntimeRemover.expects(:destroy_immediately).with(downtime)
-        put :update, params: { edition_id: edition.id, downtime: downtime_params, commit: "Cancel downtime" }
+        put :update, params: { edition_id: edition.id, commit: "Cancel downtime" }
       end
 
       should "redirect to the downtime index" do
         DowntimeRemover.stubs(:destroy_immediately)
-        put :update, params: { edition_id: edition.id, downtime: downtime_params, commit: "Cancel downtime" }
-        assert_redirected_to controller: "legacy_downtimes", action: "index"
+        put :update, params: { edition_id: edition.id, commit: "Cancel downtime" }
+        assert_redirected_to controller: "downtimes", action: "index"
       end
     end
 
@@ -127,7 +127,7 @@ class DowntimesControllerTest < ActionController::TestCase
         create_downtime
         DowntimeScheduler.stubs(:schedule_publish_and_expiry)
         put :update, params: { edition_id: edition.id, downtime: downtime_params, commit: "Re-schedule downtime message" }
-        assert_redirected_to controller: "legacy_downtimes", action: "index"
+        assert_redirected_to controller: "downtimes", action: "index"
       end
     end
 
@@ -165,6 +165,14 @@ class DowntimesControllerTest < ActionController::TestCase
     end
   end
 
+  context "#destroy" do
+    should "render the page ok" do
+      create_downtime
+      get :destroy, params: { edition_id: edition.id }
+      assert_response :ok
+    end
+  end
+
   def edition
     @edition ||= FactoryBot.create(:transaction_edition)
   end

test/integration/downtime_integration_test.rb

@@ -18,6 +18,7 @@ class DowntimeIntegrationTest < JavascriptIntegrationTest
     test_strategy = Flipflop::FeatureSet.current.test!
     test_strategy.switch!(:design_system_downtime_index_page, true)
     test_strategy.switch!(:design_system_downtime_new, true)
+    test_strategy.switch!(:design_system_downtime_edit, true)
   end
 
   test "Scheduling new downtime" do
@@ -44,10 +45,12 @@ class DowntimeIntegrationTest < JavascriptIntegrationTest
     visit root_path
     click_link "Downtime"
     click_link "Edit downtime"
-    legacy_enter_end_time first_of_july_next_year_at_nine_thirty_pm_bst
+    enter_to_date_and_time first_of_july_next_year_at_nine_thirty_pm_bst
+
+    find("textarea#downtime_message").click
 
     assert_match("This service will be unavailable from midday to 9:30pm on #{day} 1 July.", page.find_field("Message").value)
-    click_on "Re-schedule downtime message"
+    click_on "Save"
 
     assert page.has_content?("downtime message re-scheduled")
     assert page.has_content?("midday to 9:30pm on 1 July")
@@ -60,7 +63,8 @@ class DowntimeIntegrationTest < JavascriptIntegrationTest
     visit root_path
     click_link "Downtime"
     click_link "Edit downtime"
-    click_on "Cancel downtime"
+    click_link "Remove"
+    click_on "Remove"
 
     assert page.has_content?("downtime message cancelled")
     assert_no_downtime_scheduled