Swap hidden link to a POST to work around nested query param bug (#160)

* Swap hidden link to a POST to work around nested query param bug

Author: edwardhorsford

app/assets/sass/_misc.scss

@@ -41,6 +41,11 @@
   color: $nhsuk-secondary-text-colour;
 }
 
+.app-suppress-link-styles .app-button-link {
+  text-decoration: none;
+  color: $nhsuk-secondary-text-colour;
+}
+
 .app-image-flip-horizontal {
   -webkit-transform: scaleX(-1);
   transform: scaleX(-1);

app/assets/sass/_typography.scss

@@ -26,3 +26,20 @@ h3 {
 .app-link--warning {
   color: $nhsuk-error-colour;
 }
+
+.app-button-link {
+  background: none;
+  border: none;
+  color: $nhsuk-link-colour;
+  cursor: pointer;
+  font: inherit;
+  padding: 0;
+  text-align: left;
+  text-decoration: underline;
+
+  &:hover,
+  &:focus {
+    color: $nhsuk-link-hover-colour;
+    text-decoration: none;
+  }
+}

app/views/events/images-before-mammography.html

@@ -6,7 +6,7 @@
 
 {% set gridColumn = "nhsuk-grid-column-full" %}
 
-{% set formAction = './imaging-answer' %}
+{% set formAction = './images' %}
 
 {% set activeTab = 'images' %}
 
@@ -28,13 +28,26 @@ <h1 class="nhsuk-heading-l js-image-count">
   {% set insetHtml %}
     <p>Mammography images will appear here once they have been transmitted by the PACS</p>
   {% endset %}
+
   {{ insetText({
     html: insetHtml
   }) }}
 
-  <div id="loading-spinner" class="">
-    <p class="app-suppress-link-styles"><a href="./images?event[workflowStatus][awaiting-images]=completed"><span class="">Loading images...</span></a></p>
-  </div>
+
+  {{ appHiddenInput({
+    name: "event[workflowStatus][awaiting-images]",
+    value: "completed"
+  }) }}
+
+  <p class="app-suppress-link-styles">
+    <button class="app-button-link" type="submit">
+      Loading images...
+    </button>
+    {# <a href="./images?event[workflowStatus][awaiting-images]=completed">
+      <span class="">Loading images...</span>
+    </a> #}
+  </p>
+
 
 
   {% include "screening-cannot-proceed-link.njk" %}

app/views/events/images.html

@@ -11,7 +11,7 @@
   {% if isAwaitingImages %}
     {% include "events/images-before-mammography.html" %}
   {% else %}
-      {% include "events/images-during-mammography.html" %}
+    {% include "events/images-during-mammography.html" %}
   {% endif %}
 
 {% endif %}