1059 update designs for multiple endpoints

.gitignore

@@ -150,4 +150,6 @@ uploads/*
 npm-audit-report.json
 .cursor/rules/*
 
-github-pages
+github-pages
+
+.history

src/views/organisations/dataset-overview.html

@@ -10,13 +10,13 @@
   /organisations/{{ organisation.organisation | urlencode }}/{{ dataset.dataset | urlencode }}/endpoint-error/{{ endpoint.endpoint | urlencode }}
 {% endmacro %}
 
-{% macro lastAccessedInfo(organisation, dataset, endpoint) %}
-  {{endpoint.lastAccessed | govukDateTime}}
-  <br>
+{% macro endpointUrlWithError(organisation, dataset, endpoint) %}
+  <a style="{{ urlStyle}}" href="{{ endpoint.endpoint_url }}">{{ endpoint.endpoint_url }}</a>
+
   <p class="govuk-error-message">
-    <a href="{{ datasetUrl(organisation, dataset, endpoint) }}">{{ endpointErrorMessage(endpoint) }}</a>
+   {{ endpointErrorMessage(endpoint) }}
   </p>
-  <p class="app-inset-text__error"></p>
+
 {% endmacro %}
 
 {% from "govuk/components/breadcrumbs/macro.njk" import govukBreadcrumbs %}
@@ -66,7 +66,7 @@
 {% set rows = [
   {
     key: {
-      text: "Number of records"
+      text: "Number of records supplied"
     },
     value: {
       text: stats.numberOfRecords | default(0)
@@ -103,7 +103,6 @@
   {% endif %}
   {% set _ = rows.push(alternateSourcesRow) %}
 {% endif %}
-
 {% if authority !== 'some' %}
   {% set licenceRow = {
     key: {
@@ -114,76 +113,66 @@
     }
   } %}
   {{ rows.push(licenceRow) }}
+{% endif %}
 
+{% set endpointCount = 0 %}
+{% set endpointSummaryCards = [] %}
+{% if authority !== 'some' %}
+  {% set endpointCount = stats.endpoints | length %}
   {% for endpoint in stats.endpoints %}
-    {% set endpointRow = {
-      key: {
-        text: 'Endpoint URL',
-        classes: 'padding-top'
-      },
-      value: {
-        html: '<a  style="'+urlStyle+'" href="'+endpoint.endpoint_url+'">'+endpoint.endpoint_url+'</a>'
-      },
-      classes: 'padding-top'
-    } %}
-    {{ rows.push(endpointRow) }}
-
-    {% if endpoint.documentation_url %}
-      {% set documentationRow = {
-        key: {
-          text: 'Documentation URL'
-        },
-        value: {
-          html: '<a style="'+urlStyle+'" href="'+endpoint.documentation_url+'">'+endpoint.documentation_url+'</a>'
-        }
-      } %}
-      {{ rows.push(documentationRow) }}
-    {% endif %}
-
+    {% set endpointRows = [] %}
     {% if endpoint.error %}
-      {% set lastAccessedRow = {
-        key: {
-          text: 'Endpoint URL last accessed',
-          classes: 'app-inset-text---error'
-        },
-        value: {
-          html: lastAccessedInfo(organisation, dataset, endpoint)
-        }
-      } %}
+      {% set _ = endpointRows.push({
+        key: { text: "Endpoint URL" },
+        value: { html: endpointUrlWithError(organisation, dataset, endpoint) },
+        classes: 'app-inset-text---error dl-summary-card-list__row--error'
+      }) %}
     {% else %}
-      {% set lastAccessedRow = {
-        key: {
-          text: 'Endpoint URL last accessed'
-        },
-        value: {
-          text: endpoint.lastAccessed | govukDateTime
-        }
-      } %}
+      {% set endpointUrlHtml %}
+        <a style="{{ urlStyle }}" href="{{ endpoint.endpoint_url }}">{{ endpoint.endpoint_url }}</a>
+      {% endset %}
+      {% set _ = endpointRows.push({
+        key: { text: "Endpoint URL" },
+        value: { html: endpointUrlHtml }
+      }) %}
     {% endif %}
 
+    {% if not endpoint.documentation_url %}
+      {% set _ = endpointRows.push({
+        key: { text: "Webpage URL" },
+        value: { html: '<p class="govuk-error-message" > Documentation URL missing</p>' },
+        classes: 'app-inset-text---error dl-summary-card-list__row--error'
+      }) %}
+    {% else %}
+      {% set documentationUrlHtml %}
+        <a style="{{ urlStyle }}" href="{{ endpoint.documentation_url }}">{{ endpoint.documentation_url }}</a>
+      {% endset %}
+      {% set _ = endpointRows.push({
+        key: { text: "Webpage URL" },
+        value: { html: documentationUrlHtml }
+      }) %}
+    {% endif %}
 
-    {{ rows.push(lastAccessedRow) }}
-
-    {% set lastUpdatedRow = {
-      key: {
-        text: 'Endpoint URL last updated'
-      },
-      value: {
-        text: endpoint.lastUpdated and ( endpoint.lastUpdated | govukDateTime )
-      }
-    } %}
-    {{ rows.push(lastUpdatedRow) }}
+    {% set _ = endpointRows.push({
+      key: { text: "Date added" },
+      value: { text: endpoint.entryDate and (endpoint.entryDate | govukDateTime) }
+    }) %}
+    {% set _ = endpointRows.push({
+      key: { text: "Endpoint last accessed" },
+      value: { text: endpoint.lastAccessed and (endpoint.lastAccessed | govukDateTime) }
+    }) %}
+    {% set _ = endpointRows.push({
+      key: { text: "Endpoint last updated" },
+      value: { text: endpoint.lastUpdated and (endpoint.lastUpdated | govukDateTime) }
+    }) %}
 
-    {% set entryDateRow = {
-      key: {
-        text: 'Endpoint entry date'
+    {% set endpointDisplayIndex = endpointCount - loop.index0 %}
+    {% set _ = endpointSummaryCards.push({
+      card: {
+        title: { text: "Endpoint " ~ endpointDisplayIndex }
       },
-      value: {
-        text: endpoint.entryDate and ( endpoint.entryDate | govukDateTime )
-      }
-    } %}
-    {{ rows.push(entryDateRow) }}
-
+      rows: endpointRows
+    }) %}
   {% endfor %}
 {% endif %}
 
@@ -218,6 +207,15 @@ <h2 class="govuk-heading-m govuk-visually-hidden">Map of dataset</h2>
       <h2 class="govuk-heading-m">Dataset details</h2>
       {{ govukSummaryList({ rows: rows }) }}
     </section>
+    {% if authority !== 'some' %}
+    <section>
+      <h2 class="govuk-heading-m">Active endpoints</h2>
+      <p class="govuk-body">You have {{ endpointCount }} endpoint{% if endpointCount != 1 %}s{% endif %} we are currently checking for data.</p>
+      {% for endpointSummaryCard in endpointSummaryCards %}
+        {{ govukSummaryList(endpointSummaryCard) }}
+      {% endfor %}
+    </section>
+    {% endif %}
     {% if authority === "some" %}
       {{ alternativeSourceNotice(organisation, dataset, downloadUrl, alternateSources) }}
     {% endif %}
@@ -266,4 +264,4 @@ <h2 class="govuk-heading-m">Dataset actions</h2>
     </script>
     <script src="/public/js/map.bundle.js"></script>
   {% endif %}
-{% endblock %}
+{% endblock %}

test/acceptance/dataset_overview.test.js

@@ -41,7 +41,8 @@ test.describe('Dataset overview', () => {
     expect(await page.getByRole('link', { name: 'Task list' })).toBeDefined()
 
     expect(await page.getByRole('h2', { name: 'Dataset details' })).toBeDefined()
-    expect(await page.locator('.govuk-grid-column-two-thirds .govuk-summary-list').count()).toEqual(1)
+    expect(await page.getByRole('h2', { name: 'Active endpoints' })).toBeDefined()
+    expect(await page.locator('.govuk-grid-column-two-thirds .govuk-summary-list').count()).toBeGreaterThanOrEqual(2)
 
     expect(await page.getByRole('h2', { name: 'Dataset actions' })).toBeDefined()
     expect(await page.locator('.govuk-grid-column-one-third .govuk-list').count()).toEqual(1)

test/unit/views/organisations/dataset-overview.test.js

@@ -37,8 +37,8 @@ describe('Dataset Overview Page', () => {
           name: 'endpoint 2',
           endpoint: 'BAR',
           endpoint_url: 'http://endpoint2.co.uk',
-          lastAccessed: '2024-19-19',
-          lastUpdated: '2024-19-19',
+          lastAccessed: '2024-09-19',
+          lastUpdated: '2024-09-19',
           entryDate: '2024-12-12',
           error: {
             code: 404,
@@ -77,20 +77,31 @@ describe('Dataset Overview Page', () => {
 
   it('Renders dataset details correctly', () => {
     expect(document.querySelector('#main-content h2.govuk-heading-m').textContent).toContain('Dataset details')
-    const summaryListValues = document.querySelectorAll('dd.govuk-summary-list__value')
-
-    expect(summaryListValues[0].textContent.trim()).toEqual(params.stats.numberOfRecords.toString())
-    expect(summaryListValues[1].textContent.trim()).toEqual('Open Government Licence')
-    expect(summaryListValues[2].textContent).toContain(params.stats.endpoints[0].endpoint_url)
-    expect(summaryListValues[3].textContent).toContain(params.stats.endpoints[0].documentation_url)
-    expect(summaryListValues[4].textContent).toContain(govukDateTime(params.stats.endpoints[0].lastAccessed))
-    expect(summaryListValues[5].textContent).toContain(govukDateTime(params.stats.endpoints[0].lastUpdated))
-    expect(summaryListValues[6].textContent).toContain(govukDateTime(params.stats.endpoints[0].entryDate))
-    expect(summaryListValues[7].textContent).toContain(params.stats.endpoints[1].endpoint_url)
-    expect(summaryListValues[8].textContent).toContain(govukDateTime(params.stats.endpoints[1].lastAccessed))
-    expect(summaryListValues[8].textContent).toContain(params.stats.endpoints[1].error.code)
-    expect(summaryListValues[9].textContent).toContain(govukDateTime(params.stats.endpoints[1].lastUpdated))
-    expect(summaryListValues[10].textContent).toContain(govukDateTime(params.stats.endpoints[1].entryDate))
+    const summaryLists = document.querySelectorAll('.govuk-summary-list')
+
+    expect(summaryLists.length).toEqual(3)
+    expect(summaryLists[0].textContent).toContain(params.stats.numberOfRecords.toString())
+  })
+
+  it('Renders active endpoint cards in descending order', () => {
+    const endpointCards = document.querySelectorAll('.govuk-summary-card')
+    const endpointTitles = document.querySelectorAll('.govuk-summary-card__title')
+
+    expect(endpointCards.length).toEqual(2)
+    expect(endpointTitles[0].textContent.trim()).toEqual('Endpoint 2')
+    expect(endpointTitles[1].textContent.trim()).toEqual('Endpoint 1')
+
+    expect(endpointCards[0].textContent).toContain(params.stats.endpoints[0].endpoint_url)
+    expect(endpointCards[0].textContent).toContain(params.stats.endpoints[0].documentation_url)
+    expect(endpointCards[0].textContent).toContain(govukDateTime(params.stats.endpoints[0].lastAccessed))
+    expect(endpointCards[0].textContent).toContain(govukDateTime(params.stats.endpoints[0].lastUpdated))
+    expect(endpointCards[0].textContent).toContain(govukDateTime(params.stats.endpoints[0].entryDate))
+
+    expect(endpointCards[1].textContent).toContain(params.stats.endpoints[1].endpoint_url)
+    expect(endpointCards[1].textContent).toContain(govukDateTime(params.stats.endpoints[1].lastAccessed))
+    expect(endpointCards[1].textContent).toContain(params.stats.endpoints[1].error.code)
+    expect(endpointCards[1].textContent).toContain(govukDateTime(params.stats.endpoints[1].lastUpdated))
+    expect(endpointCards[1].textContent).toContain(govukDateTime(params.stats.endpoints[1].entryDate))
   })
 
   it('Renders breadcrumbs correctly', () => {