[SD-265] add date range field

examples/nuxt-app/test/features/landingpage/custom-collection.feature

@@ -32,6 +32,7 @@ Feature: Custom Collection
     Then the custom collection dropdown field labelled "Terms dependent example" should have the "default" variant applied
     Then the custom collection dropdown field labelled "Terms dependent child example" should have the "default" variant applied
     And the custom collection checkbox group labelled "Checkbox group" should have the "default" variant applied
+    And the custom collection date range field labelled "Date range example" should have the "default" variant applied
 
   @mockserver
   Scenario: Default page - reverse form theme
@@ -47,6 +48,7 @@ Feature: Custom Collection
     Then the custom collection dropdown field labelled "Terms dependent example" should have the "reverse" variant applied
     Then the custom collection dropdown field labelled "Terms dependent child example" should have the "reverse" variant applied
     And the custom collection checkbox group labelled "Checkbox group" should have the "reverse" variant applied
+    And the custom collection date range field labelled "Date range example" should have the "reverse" variant applied
 
   @mockserver
   Scenario: Alt page - default form theme
@@ -62,6 +64,7 @@ Feature: Custom Collection
     Then the custom collection dropdown field labelled "Terms dependent example" should have the "reverse" variant applied
     Then the custom collection dropdown field labelled "Terms dependent child example" should have the "reverse" variant applied
     And the custom collection checkbox group labelled "Checkbox group" should have the "reverse" variant applied
+    And the custom collection date range field labelled "Date range example" should have the "reverse" variant applied
 
   @mockserver
   Scenario: Alt page - reverse form theme
@@ -77,6 +80,7 @@ Feature: Custom Collection
     Then the custom collection dropdown field labelled "Terms dependent example" should have the "default" variant applied
     Then the custom collection dropdown field labelled "Terms dependent child example" should have the "default" variant applied
     And the custom collection checkbox group labelled "Checkbox group" should have the "default" variant applied
+    And the custom collection date range field labelled "Date range example" should have the "default" variant applied
 
   @mockserver
   Scenario: Error

examples/nuxt-app/test/features/search-listing/events.feature

@@ -8,7 +8,7 @@ Feature: Events collection
     Given the page endpoint for path "/events" returns fixture "/search-listing/events/page" with status 200
     And the search network request is stubbed with fixture "/search-listing/events/response" and status 200
     When I visit the page "/events"
-    Then the search listing page should have 2 results
+    Then the search listing page should have 4 results
     And the search listing layout should be "grid"
     And the search network request should be called with the "/search-listing/events/request" fixture
     And the event search listing results should have following items:

examples/nuxt-app/test/features/search-listing/filters.feature

@@ -101,6 +101,62 @@ Feature: Search listing - Filter
     When I toggle the search listing filters section
     Then the search listing dropdown field labelled "Terms filter example" should have the value "Orange, Purple"
 
+  @mockserver
+  Example: Date range filter (single query value) - Should reflect the range value from the URL
+    Given the page endpoint for path "/filters" returns fixture "/search-listing/filters/page" with status 200
+    And the search network request is stubbed with fixture "/search-listing/filters/response" and status 200
+
+    When I visit the page "/filters?dateRangeFilter=from:2024-10-01&dateRangeFilter=to:2025-06-28"
+    And the search network request should be called with the "/search-listing/filters/request-date-range" fixture
+    Then the filters toggle should show 1 applied filters
+
+    When I toggle the search listing filters section
+    Then the search listing date range field labelled "Date range example" should have the values
+      | from       | to         |
+      | 2024-10-01 | 2025-06-28 |
+
+  @mockserver
+  Example: Date range filter (query range matches start and end date) - Should correctly query search API
+    Given the page endpoint for path "/filters" returns fixture "/search-listing/events/page" with status 200
+    And the search network request is stubbed with fixture "/search-listing/events/response" and status 200
+
+    When I visit the page "/filters?dateRangeFilter=from:2024-10-01&dateRangeFilter=to:2025-06-28"
+    And the search network request should be called with the "/search-listing/events/request-date-range" fixture
+    Then the filters toggle should show 1 applied filters
+
+    When I toggle the search listing filters section
+    Then the search listing date range field labelled "Date range example" should have the values
+      | from       | to         |
+      | 2024-10-01 | 2025-06-28 |
+
+  @mockserver
+  Example: Date range filter (query range matches start date) - Should correctly query search API
+    Given the page endpoint for path "/filters" returns fixture "/search-listing/events/page" with status 200
+    And the search network request is stubbed with fixture "/search-listing/events/response" and status 200
+
+    When I visit the page "/filters?dateRangeFilter=from:2024-10-01"
+    And the search network request should be called with the "/search-listing/events/request-date-range-start" fixture
+    Then the filters toggle should show 1 applied filters
+
+    When I toggle the search listing filters section
+    Then the search listing date range field labelled "Date range example" should have the values
+      | from       | to |
+      | 2024-10-01 |    |
+
+  @mockserver
+  Example: Date range filter (query range matches end date) - Should correctly query search API
+    Given the page endpoint for path "/filters" returns fixture "/search-listing/events/page" with status 200
+    And the search network request is stubbed with fixture "/search-listing/events/response" and status 200
+
+    When I visit the page "/filters?dateRangeFilter=to:2025-06-28"
+    And the search network request should be called with the "/search-listing/events/request-date-range-end" fixture
+    Then the filters toggle should show 1 applied filters
+
+    When I toggle the search listing filters section
+    Then the search listing date range field labelled "Date range example" should have the values
+      | from | to         |
+      |      | 2025-06-28 |
+
   @mockserver
   Example: Custom function filters - Should reflect an array from the URL
     Given the page endpoint for path "/filters" returns fixture "/search-listing/filters/page" with status 200
@@ -131,11 +187,11 @@ Feature: Search listing - Filter
     And the search network request is stubbed with fixture "/search-listing/filters/response" and status 200
     And the current date is "Fri, 02 Feb 2050 03:04:05 GMT"
 
-    When I visit the page "/filters?q=test123&page=2&functionFilter=open&termsFilter=Purple&termFilter=Green&rawFilter=Birds&checkboxFilter=Archived&checkboxFilterGroup=Weekdays"
+    When I visit the page "/filters?q=test123&page=2&functionFilter=open&termsFilter=Purple&termFilter=Green&rawFilter=Birds&checkboxFilter=Archived&checkboxFilterGroup=Weekdays&dateRangeFilter=from:2024-10-01&dateRangeFilter=to:2025-06-28"
     Then the search listing page should have 2 results
     And the search network request should be called with the "/search-listing/filters/request-clear-filled" fixture
 
-    Then the filters toggle should show 6 applied filters
+    Then the filters toggle should show 7 applied filters
     Then the URL should reflect that the current page number is 2
     Then the URL should reflect that the current search term is "test123"
 
@@ -149,6 +205,9 @@ Feature: Search listing - Filter
       | functionFilter      | open     |
       | checkboxFilter      | Archived |
       | checkboxFilterGroup | Weekdays |
+    And the URL should reflect that the current active filters are as follows:
+      | dateRangeFilter | from:2024-10-01 |
+      | dateRangeFilter | to:2025-06-28   |
 
     Then the search listing dropdown field labelled "Raw filter example" should have the value "Birds"
     Then the search listing dropdown field labelled "Term filter example" should have the value "Green"
@@ -169,6 +228,7 @@ Feature: Search listing - Filter
       | functionFilter      |
       | checkboxFilter      |
       | checkboxFilterGroup |
+      | dateRangeFilter     |
 
     Then the search input should have the value ""
     Then the search listing dropdown field labelled "Raw filter example" should have the value "Select a pet"
@@ -177,6 +237,9 @@ Feature: Search listing - Filter
     Then the search listing dropdown field labelled "Custom function filter example" should have the value "Select a status"
     And the search listing checkbox field labelled "Show archived content" should not be checked
     And the search listing checkbox group labelled "Checkbox group" should not have any options checked
+    And the search listing date range field labelled "Date range example" should have the values
+      | from | to |
+      |      |    |
 
   @mockserver
   Example: Should update the URL when the filters are applied
@@ -373,6 +436,19 @@ Feature: Search listing - Filter
     And I click the search listing dropdown field labelled "Terms dependent grandchild example"
     Then the selected dropdown field should allow "multi" selection
 
+  @mockserver
+  Example: Date range filter query can be customised with user options
+    Given the page endpoint for path "/filters" returns fixture "/search-listing/filters/page-date-range" with status 200
+    And the search network request is stubbed with fixture "/search-listing/filters/response" and status 200
+
+    When I visit the page "/filters?dateRangeFilter=from:2024/10/01"
+    And the search network request should be called with the "/search-listing/filters/request-date-range-custom" fixture
+
+    When I toggle the search listing filters section
+    Then the search listing date range field labelled "Date range example" should have the values
+      | from       | to |
+      | 2024-10-01 |    |
+
   @mockserver
   Example: Should hide the search form when hideSearchForm is set
     Given the page endpoint for path "/no-search-form" returns fixture "/search-listing/filters/page-no-search-form" with status 200

examples/nuxt-app/test/fixtures/landingpage/custom-collection/alt-form-theme-default.json

@@ -180,6 +180,23 @@
                 }
               ]
             }
+          },
+          {
+            "id": "dateRangeFilter",
+            "component": "TideSearchFilterDateRange",
+            "filter": {
+              "type": "range",
+              "value": "changed",
+              "multiple": false,
+              "countAsSingle": true,
+              "valueIsObject": true
+            },
+            "props": {
+              "id": "dateRangeFilter",
+              "label": "Date range example",
+              "min": "2024-07-01",
+              "max": "2084-06-30"
+            }
           }
         ],
         "resultsConfig": {

examples/nuxt-app/test/fixtures/landingpage/custom-collection/alt-form-theme-reverse.json

@@ -180,6 +180,23 @@
                 }
               ]
             }
+          },
+          {
+            "id": "dateRangeFilter",
+            "component": "TideSearchFilterDateRange",
+            "filter": {
+              "type": "range",
+              "value": "changed",
+              "multiple": false,
+              "countAsSingle": true,
+              "valueIsObject": true
+            },
+            "props": {
+              "id": "dateRangeFilter",
+              "label": "Date range example",
+              "min": "2024-07-01",
+              "max": "2084-06-30"
+            }
           }
         ],
         "resultsConfig": {

examples/nuxt-app/test/fixtures/landingpage/custom-collection/form-theme-default.json

@@ -180,6 +180,23 @@
                 }
               ]
             }
+          },
+          {
+            "id": "dateRangeFilter",
+            "component": "TideSearchFilterDateRange",
+            "filter": {
+              "type": "range",
+              "value": "changed",
+              "multiple": false,
+              "countAsSingle": true,
+              "valueIsObject": true
+            },
+            "props": {
+              "id": "dateRangeFilter",
+              "label": "Date range example",
+              "min": "2024-07-01",
+              "max": "2084-06-30"
+            }
           }
         ],
         "resultsConfig": {

examples/nuxt-app/test/fixtures/landingpage/custom-collection/form-theme-reverse.json

@@ -180,6 +180,23 @@
                 }
               ]
             }
+          },
+          {
+            "id": "dateRangeFilter",
+            "component": "TideSearchFilterDateRange",
+            "filter": {
+              "type": "range",
+              "value": "changed",
+              "multiple": false,
+              "countAsSingle": true,
+              "valueIsObject": true
+            },
+            "props": {
+              "id": "dateRangeFilter",
+              "label": "Date range example",
+              "min": "2024-07-01",
+              "max": "2084-06-30"
+            }
           }
         ],
         "resultsConfig": {

examples/nuxt-app/test/fixtures/search-listing/events/page.json

@@ -114,6 +114,24 @@
           "label": "Event date",
           "type": "RplFormDate"
         }
+      },
+      {
+        "id": "dateRangeFilter",
+        "component": "TideSearchFilterDateRange",
+        "filter": {
+          "type": "range",
+          "value": {
+            "start": "field_event_date_start_value",
+            "end": "field_event_date_end_value"
+          },
+          "multiple": false,
+          "countAsSingle": true,
+          "valueIsObject": true
+        },
+        "props": {
+          "id": "dateRangeFilter",
+          "label": "Date range example"
+        }
       }
     ]
   },

examples/nuxt-app/test/fixtures/search-listing/events/request-date-range-end.json

@@ -0,0 +1,42 @@
+{
+  "query": {
+    "bool": {
+      "must": [
+        {
+          "match_all": {}
+        }
+      ],
+      "filter": [
+        {
+          "terms": {
+            "type": [
+              "event"
+            ]
+          }
+        },
+        {
+          "terms": {
+            "field_node_site": [
+              4
+            ]
+          }
+        },
+        {
+          "range": {
+            "field_event_date_start_value": {
+              "lte": "2025-06-28",
+              "time_zone": "Australia/Melbourne"
+            }
+          }
+        }
+      ]
+    }
+  },
+  "size": 9,
+  "from": 0,
+  "sort": [
+    {
+      "field_event_date_end_value": "asc"
+    }
+  ]
+}

examples/nuxt-app/test/fixtures/search-listing/events/request-date-range-start.json

@@ -0,0 +1,42 @@
+{
+  "query": {
+    "bool": {
+      "must": [
+        {
+          "match_all": {}
+        }
+      ],
+      "filter": [
+        {
+          "terms": {
+            "type": [
+              "event"
+            ]
+          }
+        },
+        {
+          "terms": {
+            "field_node_site": [
+              4
+            ]
+          }
+        },
+        {
+          "range": {
+            "field_event_date_end_value": {
+              "gte": "2024-10-01",
+              "time_zone": "Australia/Melbourne"
+            }
+          }
+        }
+      ]
+    }
+  },
+  "size": 9,
+  "from": 0,
+  "sort": [
+    {
+      "field_event_date_end_value": "asc"
+    }
+  ]
+}