TP2000 1570 & 1571 Update quota create layout and quota content changes

common/static/common/js/components/QuotaOriginFormset/QuotaOriginForm.js

@@ -67,7 +67,7 @@ function QuotaOriginForm({
 
   return (
     <div>
-      <h3 className="govuk-heading-m">Origin {index + 1}</h3>
+      <h3 className="govuk-heading-m">Quota origin {index + 1}</h3>
       <input type="hidden" name={`origins-${index}-pk`} value={origin.pk} />
       <div className="govuk-form-group">
         <DateField

common/static/common/js/components/QuotaOriginFormset/tests/__snapshots__/index.test.js.snap

@@ -8,7 +8,7 @@ exports[`QuotaOriginFormset renders empty formset when no initial data 1`] = `
     <h3
       className="govuk-heading-m"
     >
-      Origin 
+      Quota origin 
       1
     </h3>
     <input
@@ -254,7 +254,7 @@ exports[`QuotaOriginFormset renders formset with props 1`] = `
     <h3
       className="govuk-heading-m"
     >
-      Origin 
+      Quota origin 
       1
     </h3>
     <input
@@ -637,7 +637,7 @@ exports[`QuotaOriginFormset renders formset with props 1`] = `
     <h3
       className="govuk-heading-m"
     >
-      Origin 
+      Quota origin 
       2
     </h3>
     <input
@@ -1023,7 +1023,7 @@ exports[`QuotaOriginFormset renders with formset errors 1`] = `
     <h3
       className="govuk-heading-m"
     >
-      Origin 
+      Quota origin 
       1
     </h3>
     <input
@@ -1412,7 +1412,7 @@ exports[`QuotaOriginFormset renders with formset errors 1`] = `
     <h3
       className="govuk-heading-m"
     >
-      Origin 
+      Quota origin 
       2
     </h3>
     <input

common/static/common/js/components/QuotaOriginFormset/tests/index.test.js

@@ -149,9 +149,9 @@ describe("QuotaOriginFormset", () => {
 
     // add an empty origin
     fireEvent.click(screen.getByText("Add another origin"));
-    expect(screen.getByText("Origin 1")).toBeInTheDocument();
-    expect(screen.queryByText("Origin 2")).toBeInTheDocument();
-    expect(screen.queryByText("Origin 3")).not.toBeInTheDocument();
+    expect(screen.getByText("Quota origin 1")).toBeInTheDocument();
+    expect(screen.queryByText("Quota origin 2")).toBeInTheDocument();
+    expect(screen.queryByText("Quota origin 3")).not.toBeInTheDocument();
   });
 
   it("should remove origin form when delete button is clicked", () => {
@@ -170,7 +170,7 @@ describe("QuotaOriginFormset", () => {
 
     // delete the last origin
     fireEvent.click(screen.getByText("Delete this origin"));
-    expect(screen.getByText("Origin 1")).toBeInTheDocument();
-    expect(screen.queryByText("Origin 2")).not.toBeInTheDocument();
+    expect(screen.getByText("Quota origin 1")).toBeInTheDocument();
+    expect(screen.queryByText("Quota origin 2")).not.toBeInTheDocument();
   });
 });

common/static/common/scss/_quota-definitions.scss

@@ -20,4 +20,12 @@
     .govuk-summary-list__row:last-child .govuk-summary-list__value {
         border: 0;
     }
+}
+
+.definition-duplicate {
+    border-bottom: 3px solid govuk-colour("dark-grey");
+}
+
+.definition-original {
+    color: $govuk-secondary-text-colour;
 }

quotas/constants.py

@@ -2,6 +2,7 @@
 QUOTA_ORIGINS_FORMSET_PREFIX = "origins"
 QUOTA_EXCLUSIONS_FORMSET_PREFIX = "exclusions"
 CATEGORY_HELP_TEXT = "Categories are required for the TAP database but will not appear as a TARIC3 object in your workbasket"
+MECHANISM_HELP_TEXT = "Mechanisms are required for the TAP database but will not appear as a TARIC3 object in your workbasket"
 SAFEGUARD_HELP_TEXT = (
     "Once the quota category has been set as ‘Safeguard’, this cannot be changed"
 )

quotas/forms/react_forms.py

@@ -18,6 +18,7 @@
 from quotas import models
 from quotas import validators
 from quotas.constants import CATEGORY_HELP_TEXT
+from quotas.constants import MECHANISM_HELP_TEXT
 from quotas.constants import ORDER_NUMBER_HELP_TEXT
 from quotas.constants import QUOTA_EXCLUSIONS_FORMSET_PREFIX
 from quotas.constants import QUOTA_ORIGINS_FORMSET_PREFIX
@@ -296,6 +297,7 @@ class Meta:
     )
     mechanism = forms.ChoiceField(
         choices=validators.AdministrationMechanism.choices,
+        help_text=MECHANISM_HELP_TEXT,
         error_messages={
             "invalid_choice": "Please select a valid mechanism",
             "required": "Choose the mechanism",
@@ -344,28 +346,13 @@ def init_layout(self, request):
         )
 
         self.helper.layout = Layout(
-            Accordion(
-                AccordionSection(
-                    "Order number",
-                    Field("order_number", css_class="govuk-input--width-20"),
-                ),
-                AccordionSection(
-                    "Validity",
-                    "start_date",
-                    "end_date",
-                ),
-                AccordionSection(
-                    "Category and mechanism",
-                    "category",
-                    "mechanism",
-                ),
-                AccordionSection(
-                    "Quota origins",
-                    Div(
-                        HTML(origins_html),
-                    ),
-                ),
-                css_class="govuk-width-!-two-thirds",
+            Field("order_number", css_class="govuk-input--width-20"),
+            "start_date",
+            "end_date",
+            "category",
+            "mechanism",
+            Div(
+                HTML(origins_html),
             ),
             Submit(
                 "submit",

quotas/forms/wizards.py

@@ -48,7 +48,7 @@ def init_layout(self, request):
         self.helper.layout = Layout(
             Div(
                 HTML(
-                    '<h2 class="govuk-heading">Enter main and sub-quota order numbers</h2>',
+                    '<h2 class="govuk-heading">Enter main and sub-quota order numbers to link together</h2>',
                 ),
             ),
             Div(

quotas/jinja2/includes/quotas/quota-create-origins.jinja

@@ -10,7 +10,7 @@
   };
   const groupsWithMembers = {{groups_with_members|safe}};
   const geoAreasOptions = [
-    {"label": "", "value": ""},
+    {"label": "Choose geographical area", "value": ""},
     {% for geo_area in geo_area_options %}
     {
       "label": "{{ geo_area.area_id  ~ " - " ~ geo_area.description }}",

quotas/jinja2/quota-definitions/sub-quota-definitions-selected.jinja

@@ -1,5 +1,6 @@
 {% extends "quota-definitions/sub-quota-duplicate-definitions-step.jinja"%}
 {% from "components/table/macro.njk" import govukTable %}
+{% from "components/inset-text/macro.njk" import govukInsetText %}
 
 {% block form %}
     {% set table_rows = [] %}
@@ -17,35 +18,35 @@
       {% set main_definition = view.get_main_definition(definition.main_definition)%}
 
       {{ table_rows.append([
-        {"text": main_definition.sid},
-        {"text": "{:%d %b %Y}".format(main_definition.valid_between.lower) },
-        {"text": "{:%d %b %Y}".format(main_definition.valid_between.upper) if main_definition.valid_between.upper else "-" },
-        {"text": intcomma(main_definition.volume) },
-        {"text": main_definition.measurement_unit.abbreviation },
-        {"text": "-" },
-        {"text": "-" },
-        {"text": "-" },
-        {"text": "-" },
+        {"text": main_definition.sid, "classes": "definition-original" },
+        {"text": "{:%d %b %Y}".format(main_definition.valid_between.lower), "classes": "definition-original" },
+        {"text": "{:%d %b %Y}".format(main_definition.valid_between.upper) if main_definition.valid_between.upper else "-", "classes": "definition-original" },
+        {"text": intcomma(main_definition.volume), "classes": "definition-original" },
+        {"text": main_definition.measurement_unit.abbreviation, "classes": "definition-original" },
+        {"text": "-", "classes": "definition-original" },
+        {"text": "-", "classes": "definition-original" },
+        {"text": "-", "classes": "definition-original" },
+        {"text": "-", "classes": "definition-original" },
       ]) or "" }}
       {% set formatted_start_date = view.format_date(definition.sub_definition_staged_data.start_date) %}
       {% set formatted_end_date = view.format_date(definition.sub_definition_staged_data.end_date) %}
       {{ table_rows.append([
-        {"text": "-"},
-        {"text": formatted_start_date },
-        {"text": formatted_end_date },
-        {"text": intcomma(definition.sub_definition_staged_data.volume) },
-        {"text": definition.sub_definition_staged_data.measurement_unit_abbreviation or main_definition.measurement_unit.abbreviation},
-        {"text": definition.sub_definition_staged_data.relationship_type or "-" },
-        {"text": definition.sub_definition_staged_data.coefficient or "-"   },
-        {"text": definition_status_cell },
-        {"text": edit_link },
+        {"text": "-", "classes": "definition-duplicate"},
+        {"text": formatted_start_date, "classes": "definition-duplicate" },
+        {"text": formatted_end_date, "classes": "definition-duplicate" },
+        {"text": intcomma(definition.sub_definition_staged_data.volume), "classes": "definition-duplicate" },
+        {"text": definition.sub_definition_staged_data.measurement_unit_abbreviation or main_definition.measurement_unit.abbreviation, "classes": "definition-duplicate"},
+        {"text": definition.sub_definition_staged_data.relationship_type or "-", "classes": "definition-duplicate" },
+        {"text": definition.sub_definition_staged_data.coefficient or "-", "classes": "definition-duplicate"   },
+        {"text": definition_status_cell, "classes": "definition-duplicate" },
+        {"text": edit_link, "classes": "definition-duplicate" },
       ]) or "" }}
 
     {% endfor %}
-    <p>You must enter a co-efficient value and specify the relationship type for each definition period.</p>
+    {{ govukInsetText({'text': "You must enter a co-efficient value and specify the relationship type for each duplicated definition period."})}}
     {{ govukTable({
       "head": [
-        {"text": "Sid"},
+        {"text": "SID"},
         {"text": "Start date"},
         {"text": "End date"},
         {"text": "Volume"},
@@ -57,7 +58,12 @@
       ],
       "rows": table_rows,
     }) }}
-    <p>Selecting 'Submit' will create the new definitions and create a quota association. Further edits to the definitions can be made via the Quota view</p>
+    <div class="govuk-grid-row">
+      <div class="govuk-grid-column-two-thirds">
+    <p>Selecting 'Submit' will create the new definitions and quota associations. </p>
+    <p>Further edits to the definition periods can be made on the quota order number page through an additional workbasket transaction.</p>
+      </div>
+    </div>
   <div class="govuk-button-group">
   {{ govukButton({
     "text": "Submit",

quotas/jinja2/quota-definitions/sub-quota-duplicate-definitions-start.jinja

@@ -9,8 +9,9 @@
             <li>the sub-quota order number</li>
             <li>which definitions should be duplicated from main to sub-quota</li>
             <li>any updates to be made to the duplicated definitions</li>
-            <li>(additional updates can be made after duplication, via the edit definition page)</li>
         </ul>
+        Additional updates can be made after duplication, via the edit definition page.
+
     </p>
     <div class="govuk-button-group">
     {{ govukButton({"text": "Start now", "isStartButton": True}) }}

quotas/views/wizards.py

@@ -59,19 +59,19 @@ class DuplicateDefinitionsWizard(
 
     step_metadata = {
         START: {
-            "title": "Duplicate quota definitions",
+            "title": "Create quota associations",
             "link_text": "Start",
         },
         QUOTA_ORDER_NUMBERS: {
-            "title": "Create associations",
+            "title": "Choose quotas to be linked",
             "link_text": "Order numbers",
         },
         SELECT_DEFINITION_PERIODS: {
-            "title": "Select definition periods",
+            "title": "Select definition periods to duplicate",
             "link_text": "Definition periods",
         },
         SELECTED_DEFINITIONS: {
-            "title": "Provide updates and details for duplicated definitions",
+            "title": "Edit duplicated definition periods",
             "link_text": "Selected definitions",
         },
         COMPLETE: {"title": "Finished", "link_text": "Success"},

workbaskets/jinja2/workbaskets/edit-workbasket.jinja

@@ -78,7 +78,7 @@
     {{ workbasket_column("Quotas", [
       {"text": "Create a new quota", "url": url('quota-ui-create')},
       {"text": "Find and edit quotas", "url": url('quota-ui-list')},
-      {"text": "Create quota association", "url": url('sub_quota_definitions-ui-create')},
+      {"text": "Create quota associations", "url": url('sub_quota_definitions-ui-create')},
       ])
     }}
     {{ workbasket_column("Regulations", [