diff --git a/demo-shell/src/app.config.json b/demo-shell/src/app.config.json index 69aa469585..5008c44944 100644 --- a/demo-shell/src/app.config.json +++ b/demo-shell/src/app.config.json @@ -310,25 +310,12 @@ } } }, - { - "id": "createdDateRange", - "name": "Created Date (range)", - "enabled": true, - "component": { - "selector": "date-range", - "settings": { - "field": "cm:created", - "dateFormat": "DD-MMM-YY", - "maxDate": "today" - } - } - }, { "id": "createdModifiedDateRange", "name": "Date", "enabled": true, "component": { - "selector": "date-range-advanced", + "selector": "date-range", "settings": { "dateFormat": "dd-MMM-yy", "maxDate": "today", @@ -746,15 +733,17 @@ { "id": "createdDateRange", "name": "SEARCH.SEARCH_HEADER.FILTERS.DATE.TITLE", - "columnKey": "createdAt", "enabled": true, "component": { "selector": "date-range", "settings": { "allowUpdateOnChange": false, + "dateFormat": "dd-MMM-yy", + "maxDate": "today", "field": "cm:created", - "dateFormat": "DD-MMM-YY", - "maxDate": "today" + "displayedLabelsByField": { + "cm:created": "Created Date" + } } } } diff --git a/docs/README.md b/docs/README.md index 392baec262..ba6be556e1 100644 --- a/docs/README.md +++ b/docs/README.md @@ -290,10 +290,9 @@ for more information about installing and using the source code. | [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) | | [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) | | [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) | -| [Search Date Range Advanced Component](content-services/components/search-date-range-advanced.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anyytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts) | | [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) | -| [Search date range component](content-services/components/search-date-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts) | -| [Search date range advanced tabbed component](content-services/components/search-date-range-advanced-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts) | +| [Search Date Range Component](content-services/components/search-date-range.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts) | +| [Search Date Range Tabbed component](content-services/components/search-date-range-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Date Range component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts) | | [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) | | [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) | | [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) | diff --git a/docs/content-services/components/search-check-list.component.md b/docs/content-services/components/search-check-list.component.md index 8bab674223..7f7af61d20 100644 --- a/docs/content-services/components/search-check-list.component.md +++ b/docs/content-services/components/search-check-list.component.md @@ -76,7 +76,7 @@ items in the list. - [Search Configuration Guide](../../user-guide/search-configuration-guide.md) - [Search filter chips component](search-filter-chips.component.md) - [Search filter component](search-filter.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-chip-autocomplete-input.component.md b/docs/content-services/components/search-chip-autocomplete-input.component.md index 7c08e82aca..e2a638762a 100644 --- a/docs/content-services/components/search-chip-autocomplete-input.component.md +++ b/docs/content-services/components/search-chip-autocomplete-input.component.md @@ -50,7 +50,7 @@ Represents an input with autocomplete options. - [Search Filter Autocomplete Chips component](search-filter-autocomplete-chips.component.md) - [Search Logical Filter component](search-logical-filter.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-date-range-advanced.component.md b/docs/content-services/components/search-date-range-advanced.component.md deleted file mode 100644 index 231365e3f2..0000000000 --- a/docs/content-services/components/search-date-range-advanced.component.md +++ /dev/null @@ -1,47 +0,0 @@ ---- -Title: Search date range advanced component -Added: v6.2.0 -Status: Active -Last reviewed: 2023-07-10 ---- - -# [Search date range advanced component](../../../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts "Defined in search-date-range-advanced.component.ts") - -Represents an advanced date range component for -the [SearchAdvancedDateRangeTabbedComponent](search-date-range-advanced-tabbed.component.md). - -![Date Range Advanced Widget](../../docassets/images/search-date-range-advanced.png) - -## Basic usage - -```html - - -``` - -## Class Members - -### Properties - -| Name | Type | Description | -|--------------|-------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| -| field | string | Field to apply the query to. Required value | -| maxDate | string | A fixed date (default format: dd-MMM-yy) or the string `"today"` that will set the maximum searchable date. Default is today. | -| dateFormat | string | Date format. Dates used by the datepicker are Javascript Date objects, using [date-fns](https://date-fns.org/v2.30.0/docs/format) for formatting, so you can use any date format supported by the library. Default is 'dd-MMM-yy (sample date - 07-Jun-23) | -| initialValue | SearchDateRangeAdvanced | Initial value for the component | - -### Events - -| Name | Type | Description | -|---------------------|------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------| -| changed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`>` | Emitted whenever a change is made in the component values. Emits the changes being made in the component. | -| valid | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted whenever a change is made in the component values. Emits a flag indicating whether the current state of the component is valid or not. | - -## Details - -This component lets the user choose a variety of options to perform date related operations. - -- Anytime - No date related data will be returned. This option is selected by default -- In the last - Allows user to perform date related operations over a period of time. The user can select the length of the period from current time, -as well as its unit. Currently, 3 units are supported - Days, Weeks, and Months. -- Between - Allows the user to select a range of dates to perform operations on. diff --git a/docs/content-services/components/search-date-range-advanced-tabbed.component.md b/docs/content-services/components/search-date-range-tabbed.component.md similarity index 81% rename from docs/content-services/components/search-date-range-advanced-tabbed.component.md rename to docs/content-services/components/search-date-range-tabbed.component.md index de189e4d5d..60a5e737d4 100644 --- a/docs/content-services/components/search-date-range-advanced-tabbed.component.md +++ b/docs/content-services/components/search-date-range-tabbed.component.md @@ -1,16 +1,15 @@ --- -Title: Search date range advanced tabbed component +Title: Search date range tabbed component Added: v6.2.0 Status: Active Last reviewed: 2023-07-10 --- -# [Search date range advanced tabbed component](../../../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts "Defined in search-date-range-advanced-tabbed.component.ts") +# [Search date range tabbed component](../../../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts "Defined in search-date-range-tabbed.component.ts") -Represents a tabbed advanced date range [search widget](../../../lib/content-services/src/lib/search/models/search-widget.interface.ts) for -the [Search Filter component](search-filter.component.md). +Represents a tabbed date range [search widget](../../../lib/content-services/src/lib/search/models/search-widget.interface.ts) for the [Search Filter component](search-filter.component.md). -![Date Range Advanced Widget](../../docassets/images/search-date-range-advanced-tabbed.png) +![Date Range Tabbed Widget](../../docassets/images/search-date-range-tabbed.png) ## Basic usage @@ -23,7 +22,7 @@ the [Search Filter component](search-filter.component.md). "name": "Date", "enabled": true, "component": { - "selector": "date-range-advanced", + "selector": "date-range", "settings": { "dateFormat": "dd-MMM-yy", "maxDate": "today", @@ -51,7 +50,7 @@ the [Search Filter component](search-filter.component.md). ## Details -This component creates a tabbed layout where each tab consists of the [SearchDateRangeAdvanced](./search-date-range-advanced-tabbed.component.md) component, which allows user to create a query containing multiple date related queries in one go. +This component creates a tabbed layout where each tab consists of the [SearchDateRange](./search-date-range.component.md) component, which allows user to create a query containing multiple date related queries in one go. See the [Search filter component](search-filter.component.md) for full details of how to use widgets in a search query. @@ -70,7 +69,7 @@ in the `dateFormat` and in the `maxDate` setting: "name": "Date", "enabled": true, "component": { - "selector": "date-range-advanced", + "selector": "date-range", "settings": { "dateFormat": "dd-MMM-yy", "maxDate": "02-May-23", @@ -87,7 +86,7 @@ in the `dateFormat` and in the `maxDate` setting: } ``` -The [SearchDateRangeAdvanced](./search-date-range-advanced-tabbed.component.md) component allows 3 different kinds of date related operations to be performed. +The [SearchDateRange](./search-date-range.component.md) component allows 3 different kinds of date related operations to be performed. Based on what information is provided to that component, this component will create different kinds of queries - - Anytime - No date filters are applied on the `field`. This option is selected by default @@ -105,7 +104,6 @@ The queries generated by this filter when using the 'In the last' or 'Between' o - [Search Query Builder service](../services/search-query-builder.service.md) - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-date-range.component.md b/docs/content-services/components/search-date-range.component.md index 2b8a3f2179..537b56f1c2 100644 --- a/docs/content-services/components/search-date-range.component.md +++ b/docs/content-services/components/search-date-range.component.md @@ -1,88 +1,49 @@ --- Title: Search date range component -Added: v2.4.0 +Added: v6.2.0 Status: Active -Last reviewed: 2018-06-11 +Last reviewed: 2023-07-10 --- -# [Search date range component](../../../lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts "Defined in search-date-range.component.ts") +# [Search date range component](../../../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts "Defined in search-date-range.component.ts") -Implements a [search widget](../../../lib/content-services/src/lib/search/search-widget.interface.ts) for the [Search Filter component](search-filter.component.md). +Represents a date range component for the [SearchDateRangeTabbedComponent](search-date-range-tabbed.component.md). ![Date Range Widget](../../docassets/images/search-date-range.png) +NOTE: As of v6.5.0, the settings configuration for the original SearchDateRangeComponent have changed. If you have been using this component since +before that release, please ensure that your component configuration is updated according to the new settings listed below. + ## Basic usage -```json -{ - "search": { - "categories": [ - { - "id": "createdDateRange", - "name": "Created Date (range)", - "enabled": true, - "component": { - "selector": "date-range", - "settings": { - "field": "cm:created" - } - } - } - ] - } -} +```html + + ``` -### Settings +## Class Members -| Name | Type | Description | -| ---- | ---- | ----------- | -| field | string | Field to apply the query to. Required value | -| dateFormat | string | Date format. Dates used by the datepicker are [Moment.js](https://momentjs.com/docs/#/parsing/string-format/) instances, so you can use any date format supported by Moment. Default is 'DD/MM/YYYY'. | -| maxDate | string | A fixed date or the string `"today"` that will set the maximum searchable date. Default is no maximum. | -| hideDefaultAction | boolean | Show/hide the [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) actions. By default is false. | +### Properties + +| Name | Type | Description | +|--------------|-----------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| +| field | string | Field to apply the query to. Required value | +| maxDate | string | A fixed date (default format: dd-MMM-yy) or the string `"today"` that will set the maximum searchable date. Default is today. | +| dateFormat | string | Date format. Dates used by the datepicker are Javascript Date objects, using [date-fns](https://date-fns.org/v2.30.0/docs/format) for formatting, so you can use any date format supported by the library. Default is 'dd-MMM-yy (sample date - 07-Jun-23) | +| initialValue | SearchDateRange | Initial value for the component | + +### Events + +| Name | Type | Description | +|---------------------|----------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------| +| changed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`>` | Emitted whenever a change is made in the component values. Emits the changes being made in the component. | +| valid | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted whenever a change is made in the component values. Emits a flag indicating whether the current state of the component is valid or not. | ## Details -This component lets the user select a range between two dates based on the particular `field`. -See the [Search filter component](search-filter.component.md) for full details of how to use widgets -in a search query. +This component lets the user choose a variety of options to perform date related operations. -### Custom date format - -You can set the date range picker to work with any date format your app requires. You can use -any date format supported by [Moment.js](https://momentjs.com/docs/#/parsing/string-format/) -in the `dateFormat` and in the `maxDate` setting: - -```json -{ - "search": { - "categories": [ - { - "id": "createdDateRange", - "name": "Created Date (range)", - "enabled": true, - "component": { - "selector": "date-range", - "settings": { - "field": "cm:created", - "dateFormat": "DD-MMM-YY", - "maxDate": "02-Mar-20" - } - } - } - ] - } -} -``` - -## See also - -- [Search Configuration Guide](../../user-guide/search-configuration-guide.md) -- [Search filter chips component](search-filter-chips.component.md) -- [Search filter component](search-filter.component.md) -- [Search check list component](search-check-list.component.md) -- [Search number range component](search-number-range.component.md) -- [Search radio component](search-radio.component.md) -- [Search slider component](search-slider.component.md) -- [Search text component](search-text.component.md) +- Anytime - No date related data will be returned. This option is selected by default +- In the last - Allows user to perform date related operations over a period of time. The user can select the length of the period from current time, +as well as its unit. Currently, 3 units are supported - Days, Weeks, and Months. +- Between - Allows the user to select a range of dates to perform operations on. diff --git a/docs/content-services/components/search-filter-autocomplete-chips.component.md b/docs/content-services/components/search-filter-autocomplete-chips.component.md index ea41f1ade3..a6136cc6e8 100644 --- a/docs/content-services/components/search-filter-autocomplete-chips.component.md +++ b/docs/content-services/components/search-filter-autocomplete-chips.component.md @@ -59,7 +59,7 @@ See the [Search Chip Autocomplete Input component](search-chip-autocomplete-inpu - [Search Chip Autocomplete Input component](search-chip-autocomplete-input.component.md) - [Search Chip Input component](search-chip-input.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-filter-chips.component.md b/docs/content-services/components/search-filter-chips.component.md index a9c7c1c0a9..a7cb4d467d 100644 --- a/docs/content-services/components/search-filter-chips.component.md +++ b/docs/content-services/components/search-filter-chips.component.md @@ -70,7 +70,7 @@ here is the [example configuration](https://github.com/Alfresco/alfresco-ng2-com - [Search Query Builder service](../services/search-query-builder.service.md) - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-filter-tabbed.component.md b/docs/content-services/components/search-filter-tabbed.component.md index 404ade1398..28b6d67286 100644 --- a/docs/content-services/components/search-filter-tabbed.component.md +++ b/docs/content-services/components/search-filter-tabbed.component.md @@ -34,7 +34,7 @@ with the name input property being assigned the value of whatever name should be - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) - [Search date range component](search-date-range.component.md) -- [Search date range advanced component](search-date-range-advanced.component.md) +- [Search date range component](search-date-range.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-filter.component.md b/docs/content-services/components/search-filter.component.md index 86d457d310..f7a79322e1 100644 --- a/docs/content-services/components/search-filter.component.md +++ b/docs/content-services/components/search-filter.component.md @@ -36,8 +36,8 @@ to build and execute the query. - [Search Sorting Picker Component](search-sorting-picker.component.md) - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search date range component](search-date-range.component.md) -- [Search date range advanced component](search-date-range-advanced.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-logical-filter.component.md b/docs/content-services/components/search-logical-filter.component.md index a5c79ae7da..05b69b526b 100644 --- a/docs/content-services/components/search-logical-filter.component.md +++ b/docs/content-services/components/search-logical-filter.component.md @@ -52,7 +52,7 @@ This component lets the user provide logical conditions to apply to each `field` - [Search Query Builder service](../services/search-query-builder.service.md) - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-number-range.component.md b/docs/content-services/components/search-number-range.component.md index 7cc9f17467..e2a5562f4c 100644 --- a/docs/content-services/components/search-number-range.component.md +++ b/docs/content-services/components/search-number-range.component.md @@ -75,7 +75,7 @@ cm:content.size:[0 TO 100] - [Search filter chips component](search-filter-chips.component.md) - [Search filter component](search-filter.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-properties.component.md b/docs/content-services/components/search-properties.component.md index 24865a5be6..274a083c47 100644 --- a/docs/content-services/components/search-properties.component.md +++ b/docs/content-services/components/search-properties.component.md @@ -54,7 +54,7 @@ Allows to search by file size and type. - [Search Query Builder service](../services/search-query-builder.service.md) - [Search Widget Interface](../interfaces/search-widget.interface.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/components/search-radio.component.md b/docs/content-services/components/search-radio.component.md index 0903ac3913..bd193a051e 100644 --- a/docs/content-services/components/search-radio.component.md +++ b/docs/content-services/components/search-radio.component.md @@ -66,7 +66,7 @@ buttons as appropriate. - [Search filter chips component](search-filter-chips.component.md) - [Search filter component](search-filter.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search slider component](search-slider.component.md) - [Search text component](search-text.component.md) diff --git a/docs/content-services/components/search-slider.component.md b/docs/content-services/components/search-slider.component.md index d23e4914bc..d66b9d0c91 100644 --- a/docs/content-services/components/search-slider.component.md +++ b/docs/content-services/components/search-slider.component.md @@ -73,7 +73,7 @@ or zero and the corresponsing query fragment is removed from the query. - [Search filter chips component](search-filter-chips.component.md) - [Search filter component](search-filter.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search text component](search-text.component.md) diff --git a/docs/content-services/components/search-text.component.md b/docs/content-services/components/search-text.component.md index 219cdcde7d..3b58a1f581 100644 --- a/docs/content-services/components/search-text.component.md +++ b/docs/content-services/components/search-text.component.md @@ -63,7 +63,7 @@ details of how to use widgets in a search query. - [Search filter chips component](search-filter-chips.component.md) - [Search filter component](search-filter.component.md) - [Search check list component](search-check-list.component.md) -- [Search date range component](search-date-range.component.md) +- [Search date range tabbed component](search-date-range-tabbed.component.md) - [Search number range component](search-number-range.component.md) - [Search radio component](search-radio.component.md) - [Search slider component](search-slider.component.md) diff --git a/docs/content-services/interfaces/search-widget.interface.md b/docs/content-services/interfaces/search-widget.interface.md index 86dc9feeaa..3156516e20 100644 --- a/docs/content-services/interfaces/search-widget.interface.md +++ b/docs/content-services/interfaces/search-widget.interface.md @@ -186,7 +186,7 @@ and pass custom attributes, if your component supports them: - [Search filter component](../components/search-filter.component.md) - [Search check list component](../components/search-check-list.component.md) -- [Search date range component](../components/search-date-range.component.md) +- [Search date range tabbed component](../components/search-date-range-tabbed.component.md) - [Search number range component](../components/search-number-range.component.md) - [Search radio component](../components/search-radio.component.md) - [Search slider component](../components/search-slider.component.md) diff --git a/docs/content-services/services/search-query-builder.service.md b/docs/content-services/services/search-query-builder.service.md index 67d0e719ec..8b0e6e1cea 100644 --- a/docs/content-services/services/search-query-builder.service.md +++ b/docs/content-services/services/search-query-builder.service.md @@ -139,7 +139,7 @@ constructor(queryBuilder: SearchQueryBuilderService) { - [Search Form Component](../components/search-form.component.md) - [Search Widget interface](../interfaces/search-widget.interface.md) - [Search check list component](../components/search-check-list.component.md) -- [Search date range component](../components/search-date-range.component.md) +- [Search date range tabbed component](../components/search-date-range-tabbed.component.md) - [Search number range component](../components/search-number-range.component.md) - [Search radio component](../components/search-radio.component.md) - [Search slider component](../components/search-slider.component.md) diff --git a/docs/docassets/images/search-date-range-advanced.png b/docs/docassets/images/search-date-range-advanced.png deleted file mode 100644 index 90d17bca04..0000000000 Binary files a/docs/docassets/images/search-date-range-advanced.png and /dev/null differ diff --git a/docs/docassets/images/search-date-range-advanced-tabbed.png b/docs/docassets/images/search-date-range-tabbed.png similarity index 100% rename from docs/docassets/images/search-date-range-advanced-tabbed.png rename to docs/docassets/images/search-date-range-tabbed.png diff --git a/docs/docassets/images/search-date-range.png b/docs/docassets/images/search-date-range.png index 6325cc98f8..90d17bca04 100644 Binary files a/docs/docassets/images/search-date-range.png and b/docs/docassets/images/search-date-range.png differ diff --git a/docs/user-guide/search-configuration-guide.md b/docs/user-guide/search-configuration-guide.md index fc19870b2f..aef85fbc0e 100644 --- a/docs/user-guide/search-configuration-guide.md +++ b/docs/user-guide/search-configuration-guide.md @@ -294,10 +294,10 @@ The Search Filter supports a number of widgets out of the box, each implemented by an ADF component. The `selector` property specifies which [widget](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) is used for a category: -| [`Widget`](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) name | Selector | Description | -| ------------------------------------------------------------------------------- | -------- | ----------- | +| [`Widget`](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) name | Selector | Description | +|----------------------------------------------------------------------------------------------| -------- |------------------------------------------------------------------------------| | [Check List](../content-services/components/search-check-list.component.md) | `check-list` | Toggles individual query fragments for the search | -| [Date Range](../content-services/components/search-date-range.component.md) | `date-range` | Specifies a range f dates that a field may contain | +| [Date Range](../content-services/components/search-date-range.component.md) | `date-range` | Specifies a varities of options for selecting dates that a field may contain | | [Number Range](../content-services/components/search-number-range.component.md) | `number-range` | Specifies a range of numeric values that a field may contain | | [Radio List](../content-services/components/search-radio.component.md) | `radio` | Selects one query fragment from a list of options | | [Slider](../content-services/components/search-slider.component.md) | `slider` | Selects a single numeric value in a given range that a field may contain | @@ -589,7 +589,7 @@ then be added in each node entry response. An example partial response is shown - [Search Form Component](../content-services/components/search-form.component.md) - [Search Widget interface](../interfaces/search-widget.interface.md) - [Search check list component](../content-services/components/search-check-list.component.md) -- [Search date range component](../content-services/components/search-date-range.component.md) +- [Search date range tabbed component](../content-services/components/search-date-range-tabbed.component.md) - [Search number range component](../content-services/components/search-number-range.component.md) - [Search radio component](../content-services/components/search-radio.component.md) - [Search slider component](../content-services/components/search-slider.component.md) diff --git a/docs/versionIndex.md b/docs/versionIndex.md index 17441938d3..5eec057894 100644 --- a/docs/versionIndex.md +++ b/docs/versionIndex.md @@ -57,8 +57,8 @@ backend services have been tested with each released version of ADF. - [Search Properties component](content-services/components/search-properties.component.md) -- [Search Date Range Advanced Component](content-services/components/search-date-range-advanced.component.md) -- [Search Date Range Advanced Tabbed Component](content-services/components/search-date-range-advanced-tabbed.component.md) +- [Search Date Range Component](content-services/components/search-date-range.component.md) +- [Search Date Range Tabbed Component](content-services/components/search-date-range-tabbed.component.md) - [Search Filter Tabbed Component](content-services/components/search-filter-tabbed.component.md) - [Search Facet Chip Tabbed Component](content-services/components/search-facet-chip-tabbed.md) - [Date Time Pipe](core/pipes/date-time.pipe.md) diff --git a/e2e/search/components/search-date-range.e2e.ts b/e2e/search/components/search-date-range.e2e.ts deleted file mode 100644 index 0acac3afab..0000000000 --- a/e2e/search/components/search-date-range.e2e.ts +++ /dev/null @@ -1,107 +0,0 @@ -/*! - * @license - * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { BrowserActions, DataTableComponentPage, LoginPage } from '@alfresco/adf-testing'; -import { browser, ElementFinder } from 'protractor'; -import { SearchBarPage } from '../pages/search-bar.page'; -import { SearchFiltersPage } from '../pages/search-filters.page'; -import { SearchResultsPage } from '../pages/search-results.page'; -import { format, parse, addDays } from 'date-fns'; - -describe('Search Date Range Filter', () => { - const loginPage = new LoginPage(); - const searchBarPage = new SearchBarPage(); - const searchFilters = new SearchFiltersPage(); - const dateRangeFilter = searchFilters.createdDateRangeFilterPage(); - const searchResults = new SearchResultsPage(); - const dataTable = new DataTableComponentPage(); - - beforeAll(async () => { - await loginPage.loginWithProfile('admin'); - - await searchBarPage.checkSearchIconIsVisible(); - await searchBarPage.clickOnSearchIcon(); - await searchBarPage.enterTextAndPressEnter('*'); - await searchResults.dataTable.waitTillContentLoaded(); - }); - - beforeEach(async () => { - await searchFilters.checkCreatedRangeFilterIsDisplayed(); - await searchFilters.clickCreatedRangeFilterHeader(); - await searchFilters.checkCreatedRangeFilterIsExpanded(); - }); - - afterEach(async () => { - await browser.refresh(); - }); - - it('[C277119] FROM and TO dates should depend on each other', async () => { - await dateRangeFilter.checkFromDateToggleIsDisplayed(); - const fromDatePicker = await dateRangeFilter.openFromDatePicker(); - await fromDatePicker.checkDatesAfterDateAreDisabled(new Date()); - await fromDatePicker.closeDatePicker(); - - await dateRangeFilter.checkToDateToggleIsDisplayed(); - let datePickerTo = await dateRangeFilter.openToDatePicker(); - - await datePickerTo.checkDatesAfterDateAreDisabled(new Date()); - await datePickerTo.closeDatePicker(); - - await dateRangeFilter.checkFromDateToggleIsDisplayed(); - const datePickerFrom = await dateRangeFilter.openFromDatePicker(); - await datePickerFrom.selectTodayDate(); - await datePickerFrom.checkDatePickerIsNotDisplayed(); - - await dateRangeFilter.checkToDateToggleIsDisplayed(); - datePickerTo = await dateRangeFilter.openToDatePicker(); - await datePickerTo.checkDatesBeforeDateAreDisabled(new Date()); - await datePickerTo.checkDatesAfterDateAreDisabled(new Date()); - }); - - it('[C277107] Should be able to apply a date range', async () => { - await dateRangeFilter.checkFromDateToggleIsDisplayed(); - const datePickerToday = await dateRangeFilter.openFromDatePicker(); - await datePickerToday.selectTodayDate(); - await datePickerToday.checkDatePickerIsNotDisplayed(); - let fromDate = await dateRangeFilter.getFromDate(); - fromDate = format(parse(fromDate, 'd-MMM-yy', new Date()), 'dd-MM-yy'); - - await dateRangeFilter.checkApplyButtonIsDisabled(); - - await dateRangeFilter.checkToDateToggleIsDisplayed(); - const toDatePicker = await dateRangeFilter.openToDatePicker(); - - await toDatePicker.selectTodayDate(); - await toDatePicker.checkDatePickerIsNotDisplayed(); - let toDate = await dateRangeFilter.getToDate(); - toDate = format(addDays(parse(toDate, 'dd-MMM-yy', new Date()), 1), 'dd-MM-yy'); - - await dateRangeFilter.checkApplyButtonIsEnabled(); - await dateRangeFilter.clickApplyButton(); - - await searchResults.sortByCreated('ASC'); - - const results = (await dataTable.geCellElementDetail('Created')) as ElementFinder[]; - for (const currentResult of results) { - const currentDate = await BrowserActions.getAttribute(currentResult, 'title'); - const currentDateFormatted = parse(currentDate, 'MMM dd, yyyy, h:mm:ss a', new Date()); - - await expect(currentDateFormatted <= parse(toDate, 'dd-MM-yy', new Date())).toBe(true); - await expect(currentDateFormatted >= parse(fromDate, 'dd-MM-yy', new Date())).toBe(true); - } - }); -}); diff --git a/e2e/search/components/search-radio.e2e.ts b/e2e/search/components/search-radio.e2e.ts index 5d7e2e1725..a5cff1f475 100644 --- a/e2e/search/components/search-radio.e2e.ts +++ b/e2e/search/components/search-radio.e2e.ts @@ -155,7 +155,7 @@ describe('Search Radio Component', () => { await searchFiltersPage.clickTypeFilterHeader(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16); await navigationBarPage.navigateToContentServices(); @@ -170,7 +170,7 @@ describe('Search Radio Component', () => { await searchFiltersPage.clickTypeFilterHeader(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16); await navigationBarPage.navigateToContentServices(); jsonFile.categories[5].component.settings.pageSize = 9; @@ -184,7 +184,7 @@ describe('Search Radio Component', () => { await searchFiltersPage.clickTypeFilterHeader(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(12); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(15); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed(); @@ -213,21 +213,21 @@ describe('Search Radio Component', () => { await searchFiltersPage.clickTypeFilterHeader(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed(); await searchFiltersPage.typeFiltersPage().clickShowMoreButton(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().clickShowLessButton(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed(); @@ -244,21 +244,21 @@ describe('Search Radio Component', () => { await searchFiltersPage.clickTypeFilterHeader(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed(); await searchFiltersPage.typeFiltersPage().clickShowMoreButton(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().clickShowLessButton(); - await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8); + await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11); await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed(); await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed(); diff --git a/e2e/search/pages/search-filters.page.ts b/e2e/search/pages/search-filters.page.ts index dab086f950..a0d3f66491 100644 --- a/e2e/search/pages/search-filters.page.ts +++ b/e2e/search/pages/search-filters.page.ts @@ -17,7 +17,6 @@ import { BrowserVisibility, - DateRangeFilterPage, NumberRangeFilterPage, SearchCategoriesPage, SearchCheckListPage, @@ -36,7 +35,6 @@ export class SearchFiltersPage { fileSizeFilter = $('[data-automation-id="expansion-panel-SEARCH.FACET_FIELDS.SIZE"]'); nameFilter = $('[data-automation-id="expansion-panel-Name"]'); checkListFilter = $('[data-automation-id="expansion-panel-Check List"]'); - createdDateRangeFilter = $('[data-automation-id="expansion-panel-Created Date (range)"]'); typeFilter = $('[data-automation-id="expansion-panel-Type"]'); sizeRangeFilter = $('[data-automation-id="expansion-panel-Content Size (range)"]'); sizeSliderFilter = $('[data-automation-id="expansion-panel-Content Size"]'); @@ -56,10 +54,6 @@ export class SearchFiltersPage { return SearchCategoriesPage.numberRangeFilter(this.sizeRangeFilter); } - createdDateRangeFilterPage(): DateRangeFilterPage { - return SearchCategoriesPage.dateRangeFilter(this.createdDateRangeFilter); - } - textFiltersPage(): SearchTextPage { return SearchCategoriesPage.textFiltersPage(this.nameFilter); } @@ -156,18 +150,6 @@ export class SearchFiltersPage { await this.searchCategoriesPage.checkFilterIsExpanded(this.checkListFilter); } - async checkCreatedRangeFilterIsDisplayed(): Promise { - await this.searchCategoriesPage.checkFilterIsDisplayed(this.createdDateRangeFilter); - } - - async clickCreatedRangeFilterHeader(): Promise { - await this.searchCategoriesPage.clickFilterHeader(this.createdDateRangeFilter); - } - - async checkCreatedRangeFilterIsExpanded(): Promise { - await this.searchCategoriesPage.checkFilterIsExpanded(this.createdDateRangeFilter); - } - async checkTypeFilterIsDisplayed(): Promise { await this.searchCategoriesPage.checkFilterIsDisplayed(this.typeFilter); } diff --git a/e2e/search/search.config.ts b/e2e/search/search.config.ts index 323641551c..bdc4dce6cc 100644 --- a/e2e/search/search.config.ts +++ b/e2e/search/search.config.ts @@ -155,7 +155,10 @@ export class SearchConfiguration { selector: 'date-range', settings: { field: 'cm:created', - dateFormat: 'DD-MMM-YY' + dateFormat: 'DD-MMM-YY', + displayedLabelsByField: { + 'cm:created': 'Created Date' + } } } }, @@ -182,7 +185,7 @@ export class SearchConfiguration { name: 'Date', enabled: true, component: { - selector: 'date-range-advanced', + selector: 'date-range', settings: { dateFormat: 'dd-MMM-yy', maxDate: 'today', diff --git a/lib/content-services/src/lib/i18n/en.json b/lib/content-services/src/lib/i18n/en.json index 2d6e5b5bd6..def0dce4cc 100644 --- a/lib/content-services/src/lib/i18n/en.json +++ b/lib/content-services/src/lib/i18n/en.json @@ -319,9 +319,7 @@ "FROM": "From", "TO": "To", "FROM-DATE": "From", - "TO-DATE": "To", - "SELECT-FROM-DATE": "Select From Date", - "SELECT-TO-DATE": "Select To Date" + "TO-DATE": "To" }, "VALIDATION": { "REQUIRED-VALUE": "Required value", @@ -378,14 +376,14 @@ } }, "UNKNOWN_CONFIGURATION": "Unknown Configuration", - "SEARCH_HEADER" : { - "TITLE":"Filter", + "SEARCH_HEADER": { + "TITLE": "Filter", "TYPE": "Type", "FILTER_BY": "Filter by {{ category }}", "CLEAR": "Clear", "APPLY": "Apply", - "FILTERS" : { - "NAME" : { + "FILTERS": { + "NAME": { "TITLE": "Name", "PLACEHOLDER": "Enter the name" }, @@ -395,14 +393,14 @@ "DOCUMENT": "Document" }, "SIZE": { - "TITLE" : "Content Size (range)", + "TITLE": "Content Size (range)", "SMALL": "Small", "MEDIUM": "Medium", "LARGE": "Large", "HUGE": "Huge" }, - "DATE" :{ - "TITLE" : "Created Date (range)" + "DATE": { + "TITLE": "Created Date (range)" } } }, @@ -493,15 +491,15 @@ "ADD_TAG_TOOLTIP": "Add tag" }, "CONTENT_TYPE": { - "DIALOG" :{ - "TITLE" : "Change content type", + "DIALOG": { + "TITLE": "Change content type", "DESCRIPTION": "Making this change to the content type will permanently add some properties and stored metadata to the document.", "CONFIRM": "Are you sure you want to change the content type?", "CANCEL": "CANCEL", "APPLY": "SAVE CHANGES", "VIEW_DETAILS": "View details", - "PROPERTY" :{ - "NAME" : "Name", + "PROPERTY": { + "NAME": "Name", "DESCRIPTION": "Description", "DATA_TYPE": "Data type" } @@ -524,7 +522,7 @@ "LINK-WITH-EXPIRY-SETTINGS": "New link has been generated with expiry settings", "EXPIRES": "Expires on", "LINK-EXPIRY-DATE": "Link Expiry Date", - "EXPIRATION-LABEL" : "Expiration Date", + "EXPIRATION-LABEL": "Expiration Date", "EXPIRATION-PLACEHOLDER": "MM/DD/YYYY", "CLIPBOARD-MESSAGE": "Link copied to the clipboard", "CLOSE": "Close", @@ -666,19 +664,19 @@ "ARIA_LABEL": "Open {{ name }}" } }, - "ADF-ASPECT-LIST" : { + "ADF-ASPECT-LIST": { "PROPERTY_NAME": "Property Name", "DESCRIPTION": "Description", "DATA_TYPE": "Data Type", - "DIALOG" : { - "TITLE" : "Customize Properties", - "DESCRIPTION": "Manage the properties associated with selected file(s). Choose from property aspects listed below, to expose and apply additional metadata and functionality", - "RESET": "Reset", - "CLEAR": "Clear", - "CANCEL": "Cancel", - "APPLY": "Apply", - "OVER-TABLE-MESSAGE" : "Select property aspects", - "SELECTED": "Selected" + "DIALOG": { + "TITLE": "Customize Properties", + "DESCRIPTION": "Manage the properties associated with selected file(s). Choose from property aspects listed below, to expose and apply additional metadata and functionality", + "RESET": "Reset", + "CLEAR": "Clear", + "CANCEL": "Cancel", + "APPLY": "Apply", + "OVER-TABLE-MESSAGE": "Select property aspects", + "SELECTED": "Selected" } }, "NODE_COUNTER": { diff --git a/lib/content-services/src/lib/mock/search-filter-mock.ts b/lib/content-services/src/lib/mock/search-filter-mock.ts index 7baef06f3f..d16cbb9471 100644 --- a/lib/content-services/src/lib/mock/search-filter-mock.ts +++ b/lib/content-services/src/lib/mock/search-filter-mock.ts @@ -375,7 +375,10 @@ export const searchFilter = { selector: 'date-range', settings: { field: 'cm:created', - dateFormat: 'DD-MMM-YY' + dateFormat: 'DD-MMM-YY', + displayedLabelsByField: { + 'cm:created': 'Created Date (range)' + } } } }, diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.html b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.html similarity index 85% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.html rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.html index 45047255aa..e60cb73b47 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.html +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.html @@ -1,6 +1,6 @@ - - + diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.spec.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts similarity index 84% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.spec.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts index c57141917e..d1af0e0688 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts @@ -19,12 +19,12 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { TranslateModule } from '@ngx-translate/core'; import { ContentTestingModule } from '../../../testing/content.testing.module'; import { Component, EventEmitter, Input, Output } from '@angular/core'; -import { SearchDateRangeAdvanced } from './search-date-range-advanced/search-date-range-advanced'; +import { SearchDateRange } from './search-date-range/search-date-range'; import { SearchFilterTabbedComponent } from '../search-filter-tabbed/search-filter-tabbed.component'; -import { SearchDateRangeAdvancedComponent } from './search-date-range-advanced/search-date-range-advanced.component'; -import { SearchDateRangeAdvancedTabbedComponent } from './search-date-range-advanced-tabbed.component'; -import { DateRangeType } from './search-date-range-advanced/date-range-type'; -import { InLastDateType } from './search-date-range-advanced/in-last-date-type'; +import { SearchDateRangeComponent } from './search-date-range/search-date-range.component'; +import { SearchDateRangeTabbedComponent } from './search-date-range-tabbed.component'; +import { DateRangeType } from './search-date-range/date-range-type'; +import { InLastDateType } from './search-date-range/in-last-date-type'; import { endOfDay, endOfToday, @@ -44,10 +44,10 @@ import { export class MockSearchFilterTabbedComponent {} @Component({ - selector: 'adf-search-date-range-advanced', + selector: 'adf-search-date-range', template: `` }) -export class MockSearchDateRangeAdvancedComponent { +export class MockSearchDateRangeComponent { @Input() dateFormat: string; @Input() @@ -55,39 +55,39 @@ export class MockSearchDateRangeAdvancedComponent { @Input() field: string; @Input() - initialValue: SearchDateRangeAdvanced; + initialValue: SearchDateRange; @Output() - changed = new EventEmitter>(); + changed = new EventEmitter>(); @Output() valid = new EventEmitter(); } -describe('SearchDateRangeAdvancedTabbedComponent', () => { - let component: SearchDateRangeAdvancedTabbedComponent; - let fixture: ComponentFixture; - let betweenMockData: SearchDateRangeAdvanced; - let inLastMockData: SearchDateRangeAdvanced; - let anyMockDate: SearchDateRangeAdvanced; +describe('SearchDateRangeTabbedComponent', () => { + let component: SearchDateRangeTabbedComponent; + let fixture: ComponentFixture; + let betweenMockData: SearchDateRange; + let inLastMockData: SearchDateRange; + let anyMockDate: SearchDateRange; beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchDateRangeAdvancedTabbedComponent, SearchFilterTabbedComponent, SearchDateRangeAdvancedComponent], + declarations: [SearchDateRangeTabbedComponent, SearchFilterTabbedComponent, SearchDateRangeComponent], imports: [ TranslateModule.forRoot(), ContentTestingModule ], providers: [ { provide: SearchFilterTabbedComponent, useClass: MockSearchFilterTabbedComponent }, - { provide: SearchDateRangeAdvancedComponent, useClass: MockSearchDateRangeAdvancedComponent } + { provide: SearchDateRangeComponent, useClass: MockSearchDateRangeComponent } ] }); - fixture = TestBed.createComponent(SearchDateRangeAdvancedTabbedComponent); + fixture = TestBed.createComponent(SearchDateRangeTabbedComponent); component = fixture.componentInstance; - component.id = 'dateRangeAdvanced'; + component.id = 'dateRange'; component.context = { queryFragments: { - dateRangeAdvanced: '' + dateRange: '' }, update: jasmine.createSpy('update') } as any; @@ -219,7 +219,7 @@ describe('SearchDateRangeAdvancedTabbedComponent', () => { const inLastStartDate = startOfWeek(subWeeks(new Date(), 5)); const query = `createdDate:['${formatISO(startOfDay(betweenMockData.betweenStartDate))}' TO '${formatISO(endOfDay(betweenMockData.betweenEndDate))}']` + ` AND modifiedDate:['${formatISO(startOfDay(inLastStartDate))}' TO '${formatISO(endOfToday())}']`; - expect(component.context.queryFragments['dateRangeAdvanced']).toEqual(query); + expect(component.context.queryFragments['dateRange']).toEqual(query); expect(component.context.update).toHaveBeenCalled(); }); @@ -230,7 +230,7 @@ describe('SearchDateRangeAdvancedTabbedComponent', () => { expect(component.combinedQuery).toBe(''); expect(component.combinedDisplayValue).toBe(''); expect(component.displayValue$.next).toHaveBeenCalledWith(''); - expect(component.context.queryFragments['dateRangeAdvanced']).toEqual(''); + expect(component.context.queryFragments['dateRange']).toEqual(''); expect(component.context.update).toHaveBeenCalled(); }); }); diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts similarity index 83% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts index 2e20e2b610..62fb962ac2 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts @@ -17,12 +17,12 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { Subject } from 'rxjs'; -import { SearchDateRangeAdvanced } from './search-date-range-advanced/search-date-range-advanced'; -import { DateRangeType } from './search-date-range-advanced/date-range-type'; +import { DateRangeType } from './search-date-range/date-range-type'; +import { SearchDateRange } from './search-date-range/search-date-range'; import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; -import { InLastDateType } from './search-date-range-advanced/in-last-date-type'; +import { InLastDateType } from './search-date-range/in-last-date-type'; import { TranslationService } from '@alfresco/adf-core'; import { endOfDay, @@ -38,14 +38,14 @@ import { } from 'date-fns'; @Component({ - selector: 'adf-search-date-range-advanced-tabbed', - templateUrl: './search-date-range-advanced-tabbed.component.html', + selector: 'adf-search-date-range-tabbed', + templateUrl: './search-date-range-tabbed.component.html', encapsulation: ViewEncapsulation.None }) -export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnInit { +export class SearchDateRangeTabbedComponent implements SearchWidget, OnInit { displayValue$ = new Subject(); id: string; - startValue: SearchDateRangeAdvanced = { + startValue: SearchDateRange = { dateRangeType: DateRangeType.ANY, inLastValueType: InLastDateType.DAYS, inLastValue: undefined, @@ -59,7 +59,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI combinedQuery: string; combinedDisplayValue: string; - private value: { [key: string]: Partial } = {}; + private value: { [key: string]: Partial } = {}; private queryMapByField: Map = new Map(); private displayValueMapByField: Map = new Map(); @@ -69,7 +69,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI this.fields = this.settings?.field.split(',').map(field => field.trim()); } - getCurrentValue(): { [key: string]: Partial } { + getCurrentValue(): { [key: string]: Partial } { return this.value; } @@ -86,7 +86,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI this.submitValues(); } - setValue(value: { [key: string]: SearchDateRangeAdvanced }) { + setValue(value: { [key: string]: SearchDateRange }) { this.value = value; } @@ -97,13 +97,13 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI this.context.update(); } } - onDateRangedValueChanged(value: Partial, field: string) { + onDateRangedValueChanged(value: Partial, field: string) { this.value[field] = value; this.updateQuery(value, field); this.updateDisplayValue(value, field); } - private generateQuery(value: Partial, field: string): string { + private generateQuery(value: Partial, field: string): string { let query = ''; let startDate: Date; let endDate: Date; @@ -136,7 +136,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI return query; } - private generateDisplayValue(value: Partial): string { + private generateDisplayValue(value: Partial): string { let displayValue = ''; if (value.dateRangeType === DateRangeType.IN_LAST && value.inLastValue) { displayValue = this.translateService.instant(`SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.${value.inLastValueType}`, { @@ -148,7 +148,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI return displayValue; } - private updateQuery(value: Partial, field: string) { + private updateQuery(value: Partial, field: string) { this.combinedQuery = ''; this.queryMapByField.set(field, this.generateQuery(value, field)); this.queryMapByField.forEach((query: string) => { @@ -158,7 +158,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI }); } - private updateDisplayValue(value: Partial, field: string) { + private updateDisplayValue(value: Partial, field: string) { this.combinedDisplayValue = ''; this.displayValueMapByField.set(field, this.generateDisplayValue(value)); this.displayValueMapByField.forEach((displayValue: string, fieldForDisplayLabel: string) => { diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/date-range-type.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/date-range-type.ts similarity index 100% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/date-range-type.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/date-range-type.ts diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/in-last-date-type.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/in-last-date-type.ts similarity index 100% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/in-last-date-type.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/in-last-date-type.ts diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.html b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.html similarity index 67% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.html rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.html index 55ff6bee57..97895d6307 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.html +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.html @@ -1,41 +1,41 @@
- + {{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.ANYTIME' | translate }} - + {{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }} {{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.IN_LAST' | translate }} - - {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.DAYS' | translate }} - {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.WEEKS' | translate }} - {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }} + + {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.DAYS' | translate }} + {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.WEEKS' | translate }} + {{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }} - + {{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }} + data-automation-id="date-range-between-start-input" [formControl]="betweenStartDateFormControl" (change)="dateChanged($event, betweenStartDateFormControl)"> + data-automation-id="date-range-between-end-input" [formControl]="betweenEndDateFormControl" (change)="dateChanged($event, betweenEndDateFormControl)"> - + {{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.START_DATE.INVALID_FORMAT' | translate }} diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.scss b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.scss similarity index 93% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.scss rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.scss index cc2c68873b..0d5b6f35e0 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.scss +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.scss @@ -1,4 +1,4 @@ -adf-search-date-range-advanced { +adf-search-date-range { .adf-search-date-range-container { margin-top: 20px; padding: 10px; diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.spec.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts similarity index 81% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.spec.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts index fa570f6c6b..a29356ef9b 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts @@ -19,29 +19,29 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { TranslateModule } from '@ngx-translate/core'; import { ContentTestingModule } from '../../../../testing/content.testing.module'; -import { SearchDateRangeAdvancedComponent } from './search-date-range-advanced.component'; +import { SearchDateRangeComponent } from './search-date-range.component'; import { addDays, endOfToday, format, parse, startOfYesterday, subDays } from 'date-fns'; import { Validators } from '@angular/forms'; -describe('SearchDateRangeAdvancedComponent', () => { - let component: SearchDateRangeAdvancedComponent; - let fixture: ComponentFixture; +describe('SearchDateRangeComponent', () => { + let component: SearchDateRangeComponent; + let fixture: ComponentFixture; const startDateSampleValue = parse('05-Jun-23', 'dd-MMM-yy', new Date()); const endDateSampleValue = parse('07-Jun-23', 'dd-MMM-yy', new Date()); beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchDateRangeAdvancedComponent], + declarations: [SearchDateRangeComponent], imports: [ TranslateModule.forRoot(), ContentTestingModule ] }); - fixture = TestBed.createComponent(SearchDateRangeAdvancedComponent); + fixture = TestBed.createComponent(SearchDateRangeComponent); component = fixture.componentInstance; - component.field = 'test-field'; + component.field = 'test-field'; component.dateFormat = 'dd-MMM-yy'; component.maxDate = 'today'; component.form.setValue({ @@ -64,7 +64,7 @@ describe('SearchDateRangeAdvancedComponent', () => { }; const selectDropdownOption = (itemId: string) => { - const matSelect = fixture.debugElement.query(By.css('[data-automation-id="date-range-advanced-in-last-dropdown"]')).nativeElement; + const matSelect = fixture.debugElement.query(By.css('[data-automation-id="date-range-in-last-dropdown"]')).nativeElement; matSelect.click(); fixture.detectChanges(); const matOption = fixture.debugElement.query(By.css(`[data-automation-id="${itemId}"]`)).nativeElement; @@ -131,20 +131,20 @@ describe('SearchDateRangeAdvancedComponent', () => { it('should not be able to set zero or negative values in In the last input field', () => { component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST); fixture.detectChanges(); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '-5'); - let inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-advanced-in-last-input"]').value; + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '-5'); + let inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-in-last-input"]').value; expect(inLastInputFieldValue).toBe('5'); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '0'); - inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-advanced-in-last-input"]').value; + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '0'); + inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-in-last-input"]').value; expect(inLastInputFieldValue).toBe(''); }); it('should give an invalid date error when manually setting a start date and an end date that are not in the correct format', () => { component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN); fixture.detectChanges(); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-start-input', 'invalid-date-input', 'change'); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', 'invalid-date-input', 'change'); + enterValueInInputFieldAndTriggerEvent('date-range-between-start-input', 'invalid-date-input', 'change'); + enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', 'invalid-date-input', 'change'); expect(component.form.controls.betweenStartDate.errors.invalidDate).toBeTrue(); expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue(); }); @@ -154,7 +154,7 @@ describe('SearchDateRangeAdvancedComponent', () => { fixture.detectChanges(); component.form.controls.betweenEndDate.setValue(new Date()); const startDate = format(addDays(component.form.controls.betweenEndDate.value, 3), component.dateFormat); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-start-input', startDate, 'change'); + enterValueInInputFieldAndTriggerEvent('date-range-between-start-input', startDate, 'change'); expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue(); }); @@ -163,7 +163,7 @@ describe('SearchDateRangeAdvancedComponent', () => { fixture.detectChanges(); component.form.controls.betweenStartDate.setValue(new Date()); const endDate = format(subDays(component.form.controls.betweenStartDate.value, 3), component.dateFormat); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', endDate, 'change'); + enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', endDate, 'change'); expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue(); }); @@ -171,16 +171,28 @@ describe('SearchDateRangeAdvancedComponent', () => { component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN); fixture.detectChanges(); const endDate = format(addDays(component.convertedMaxDate, 3), component.dateFormat); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', endDate, 'change'); + enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', endDate, 'change'); expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue(); }); + it('should not be able to select a date after the max date when selecting the BETWEEN option', async () => { + component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN); + component.maxDate = 'today'; + fixture.detectChanges(); + getElementBySelector('[data-automation-id="date-range-between-datepicker-toggle"]').click(); + fixture.detectChanges(); + + const afterDate = format(addDays(new Date(), 1), 'MMM d, yyyy'); + const afterDateItem = document.querySelector(`.mat-calendar-body-cell[aria-label="${afterDate}"]`); + expect(afterDateItem.getAttribute('aria-disabled')).toBeTruthy(); + }); + it('should emit valid as false when form is invalid', () => { spyOn(component.valid, 'emit'); component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST); fixture.detectChanges(); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', ''); - selectDropdownOption('date-range-advanced-in-last-option-weeks'); + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', ''); + selectDropdownOption('date-range-in-last-option-weeks'); expect(component.valid.emit).toHaveBeenCalledWith(false); component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN); @@ -192,8 +204,8 @@ describe('SearchDateRangeAdvancedComponent', () => { spyOn(component.valid, 'emit'); component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST); fixture.detectChanges(); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '5'); - selectDropdownOption('date-range-advanced-in-last-option-weeks'); + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '5'); + selectDropdownOption('date-range-in-last-option-weeks'); expect(component.valid.emit).toHaveBeenCalledWith(true); component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN); @@ -213,10 +225,10 @@ describe('SearchDateRangeAdvancedComponent', () => { betweenStartDate: undefined, betweenEndDate: undefined }; - let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-in-last"] .mat-radio-input'); + let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-in-last"] .mat-radio-input'); dateRangeTypeRadioButton.click(); - selectDropdownOption('date-range-advanced-in-last-option-weeks'); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', ''); + selectDropdownOption('date-range-in-last-option-weeks'); + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', ''); expect(component.changed.emit).not.toHaveBeenCalledWith(value); component.form.patchValue({ @@ -234,7 +246,7 @@ describe('SearchDateRangeAdvancedComponent', () => { betweenStartDate: '', betweenEndDate: '' }; - dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-between"] .mat-radio-input'); + dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-between"] .mat-radio-input'); dateRangeTypeRadioButton.click(); fixture.detectChanges(); expect(component.changed.emit).not.toHaveBeenCalledWith(value); @@ -249,10 +261,10 @@ describe('SearchDateRangeAdvancedComponent', () => { betweenStartDate: null, betweenEndDate: null }; - let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-in-last"] .mat-radio-input'); + let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-in-last"] .mat-radio-input'); dateRangeTypeRadioButton.click(); - selectDropdownOption('date-range-advanced-in-last-option-weeks'); - enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '5'); + selectDropdownOption('date-range-in-last-option-weeks'); + enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '5'); fixture.detectChanges(); expect(component.changed.emit).toHaveBeenCalledWith(value); @@ -271,7 +283,7 @@ describe('SearchDateRangeAdvancedComponent', () => { betweenStartDate: startDateSampleValue, betweenEndDate: endDateSampleValue }; - dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-between"] .mat-radio-input'); + dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-between"] .mat-radio-input'); dateRangeTypeRadioButton.click(); component.betweenStartDateFormControl.setValue(startDateSampleValue); component.betweenEndDateFormControl.setValue(endDateSampleValue); diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts similarity index 92% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts index d0792a9c19..e5a0ad85b3 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts @@ -22,7 +22,7 @@ import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE, MatDateFormats } from ' import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns-adapter'; import { InLastDateType } from './in-last-date-type'; import { DateRangeType } from './date-range-type'; -import { SearchDateRangeAdvanced } from './search-date-range-advanced'; +import { SearchDateRange } from './search-date-range'; import { FormBuilder, UntypedFormControl, Validators } from '@angular/forms'; import { takeUntil } from 'rxjs/operators'; import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alfresco/adf-core'; @@ -30,17 +30,17 @@ import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alf const DEFAULT_DATE_DISPLAY_FORMAT = 'dd-MMM-yy'; @Component({ - selector: 'adf-search-date-range-advanced', - templateUrl: './search-date-range-advanced.component.html', - styleUrls: ['./search-date-range-advanced.component.scss'], + selector: 'adf-search-date-range', + templateUrl: './search-date-range.component.html', + styleUrls: ['./search-date-range.component.scss'], providers: [ { provide: DateAdapter, useClass: DateFnsAdapter, deps: [ MAT_DATE_LOCALE ] }, { provide: MAT_DATE_FORMATS, useValue: MAT_DATE_FNS_FORMATS } ], encapsulation: ViewEncapsulation.None, - host: {class: 'adf-search-date-range-advanced'} + host: {class: 'adf-search-date-range'} }) -export class SearchDateRangeAdvancedComponent implements OnInit, OnDestroy { +export class SearchDateRangeComponent implements OnInit, OnDestroy { @Input() dateFormat = DEFAULT_DATE_DISPLAY_FORMAT; @Input() @@ -48,18 +48,18 @@ export class SearchDateRangeAdvancedComponent implements OnInit, OnDestroy { @Input() field: string; @Input() - set initialValue(value: SearchDateRangeAdvanced) { + set initialValue(value: SearchDateRange) { if (value) { this.form.patchValue(value); } } @Output() - changed = new EventEmitter>(); + changed = new EventEmitter>(); @Output() valid = new EventEmitter(); - form = this.formBuilder.group({ + form = this.formBuilder.group({ dateRangeType: DateRangeType.ANY, inLastValueType: InLastDateType.DAYS, inLastValue: undefined, diff --git a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.ts similarity index 95% rename from lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.ts rename to lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.ts index a51e0d96b2..f26ad9fb32 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.ts @@ -18,7 +18,7 @@ import { DateRangeType } from './date-range-type'; import { InLastDateType } from './in-last-date-type'; -export interface SearchDateRangeAdvanced { +export interface SearchDateRange { dateRangeType: DateRangeType; inLastValueType?: InLastDateType; inLastValue?: string; diff --git a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.html b/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.html deleted file mode 100644 index 844af86d45..0000000000 --- a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.html +++ /dev/null @@ -1,49 +0,0 @@ -
- - {{ 'SEARCH.FILTER.RANGE.SELECT-FROM-DATE' | translate }} - - - - - {{ getFromValidationMessage() | translate: { requiredFormat: datePickerFormat } }} - - - - - {{ 'SEARCH.FILTER.RANGE.SELECT-TO-DATE' | translate }} - - - - - {{ getToValidationMessage() | translate: { requiredFormat: datePickerFormat } }} - - - -
- - -
-
diff --git a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.scss b/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.scss deleted file mode 100644 index aa124f9143..0000000000 --- a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.scss +++ /dev/null @@ -1,5 +0,0 @@ -.adf-search-date-range > form { - display: inline-flex; - flex-direction: column; - width: 100%; -} diff --git a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.spec.ts b/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.spec.ts deleted file mode 100644 index 806b555640..0000000000 --- a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.spec.ts +++ /dev/null @@ -1,267 +0,0 @@ -/*! - * @license - * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { SearchDateRangeComponent } from './search-date-range.component'; -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { ContentTestingModule } from '../../../testing/content.testing.module'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatDatepickerInputEvent } from '@angular/material/datepicker'; -import { startOfDay, endOfDay, isValid, addDays, format } from 'date-fns'; - -describe('SearchDateRangeComponent', () => { - let fixture: ComponentFixture; - let component: SearchDateRangeComponent; - - const dateFormatFixture = 'dd-MMM-yy'; - const fromDate = new Date('2016-10-16'); - const toDate = new Date('2017-10-16'); - - beforeEach(() => { - TestBed.configureTestingModule({ - imports: [TranslateModule.forRoot(), ContentTestingModule] - }); - fixture = TestBed.createComponent(SearchDateRangeComponent); - component = fixture.componentInstance; - }); - - afterEach(() => fixture.destroy()); - - const getFromInput = () => fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]'); - const getToInput = () => fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-to-input"]'); - - it('should setup form elements on init', () => { - fixture.detectChanges(); - - expect(component.from).toBeDefined(); - expect(component.to).toBeDefined(); - expect(component.form).toBeDefined(); - }); - - it('should setup form control with formatted valid date on change', () => { - component.settings = { field: 'cm:created', dateFormat: dateFormatFixture }; - fixture.detectChanges(); - - const date = new Date('20-feb-18'); - expect(isValid(date)).toBeTrue(); - - component.onChangedHandler({ value: date } as MatDatepickerInputEvent, component.from); - expect(component.from.value.toString()).toEqual(date.toString()); - }); - - it('should NOT setup form control with invalid date on change', () => { - component.settings = { field: 'cm:created', dateFormat: dateFormatFixture }; - fixture.detectChanges(); - - const date = new Date('20.f.18'); - expect(isValid(date)).toBeFalse(); - - component.onChangedHandler({ value: date } as MatDatepickerInputEvent, component.from); - expect(component.from.value).not.toEqual(date); - }); - - it('should reset form', () => { - fixture.detectChanges(); - component.form.setValue({ from: fromDate, to: toDate }); - - expect(component.from.value).toEqual(fromDate); - expect(component.to.value).toEqual(toDate); - - component.reset(); - - expect(component.from.value).toBeNull(); - expect(component.to.value).toBeNull(); - expect(component.form.value).toEqual({ from: null, to: null }); - }); - - it('should reset fromMaxDate on reset', () => { - fixture.detectChanges(); - component.fromMaxDate = fromDate; - component.reset(); - - expect(component.fromMaxDate).toEqual(undefined); - }); - - it('should update query builder on reset', () => { - const context: any = { - queryFragments: { - createdDateRange: 'query' - }, - update: () => {} - }; - - component.id = 'createdDateRange'; - component.context = context; - - spyOn(context, 'update').and.stub(); - - fixture.detectChanges(); - component.reset(); - - expect(context.queryFragments.createdDateRange).toEqual(''); - expect(context.update).toHaveBeenCalled(); - }); - - it('should update query builder on value changes', () => { - const context: any = { - queryFragments: {}, - update: () => {} - }; - - component.id = 'createdDateRange'; - component.context = context; - component.settings = { field: 'cm:created' }; - - spyOn(context, 'update').and.stub(); - - fixture.detectChanges(); - component.apply( - { - from: fromDate, - to: toDate - }, - true - ); - - const startDate = startOfDay(fromDate).toISOString(); - const endDate = endOfDay(toDate).toISOString(); - - const expectedQuery = `cm:created:['${startDate}' TO '${endDate}']`; - - expect(context.queryFragments[component.id]).toEqual(expectedQuery); - expect(context.update).toHaveBeenCalled(); - }); - - it('should show date-format error when Invalid found', async () => { - fixture.detectChanges(); - - const input = getFromInput(); - input.value = '10-f-18'; - input.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE'); - }); - - it('should hide date-format error when correcting input', async () => { - fixture.detectChanges(); - - const input = getFromInput(); - input.value = '10-f-18'; - input.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE'); - - input.value = '10-10-2018'; - input.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual(''); - }); - - it('should show error for max date constraint', async () => { - component.settings = { field: 'cm:created', maxDate: 'today' }; - fixture.detectChanges(); - - const input = getFromInput(); - input.value = format(addDays(new Date(), 1), 'dd-MM-yyyy'); - input.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE'); - }); - - it('should show error for required constraint', async () => { - fixture.detectChanges(); - - const fromInput = getFromInput(); - fromInput.value = ''; - fromInput.dispatchEvent(new Event('input')); - - const toInput = getToInput(); - toInput.value = ''; - toInput.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.REQUIRED-VALUE'); - expect(component.getToValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.REQUIRED-VALUE'); - }); - - it('should show error for incorrect date range', async () => { - fixture.detectChanges(); - - const fromInput = getFromInput(); - fromInput.value = '11-10-2018'; - fromInput.dispatchEvent(new Event('input')); - - const toInput = getToInput(); - toInput.value = '10-10-2018'; - toInput.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual(''); - expect(component.getToValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.NO-DAYS'); - }); - - it('should not show date-format error when valid found', async () => { - fixture.detectChanges(); - - const input = getFromInput(); - input.value = '10-10-2018'; - input.dispatchEvent(new Event('input')); - - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.getFromValidationMessage()).toEqual(''); - }); - - it('should have no maximum date by default', async () => { - fixture.detectChanges(); - await fixture.whenStable(); - - expect(component.maxDate).toBeUndefined(); - }); - - it('should be able to set a fixed maximum date', async () => { - component.settings = { field: 'cm:created', dateFormat: dateFormatFixture, maxDate: '10-Mar-20' }; - fixture.detectChanges(); - - const expected = endOfDay(new Date(2020, 2, 10)); - expect(component.maxDate).toEqual(expected); - }); - - it('should be able to set the maximum date to today', async () => { - component.settings = { field: 'cm:created', dateFormat: dateFormatFixture, maxDate: 'today' }; - fixture.detectChanges(); - const today = endOfDay(new Date()); - - expect(component.maxDate).toEqual(today); - }); -}); diff --git a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts b/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts deleted file mode 100644 index 7c06504e56..0000000000 --- a/lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts +++ /dev/null @@ -1,240 +0,0 @@ -/*! - * @license - * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { Component, OnInit, ViewEncapsulation } from '@angular/core'; -import { FormControl, FormGroup, Validators } from '@angular/forms'; -import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core'; -import { ADF_DATE_FORMATS, AdfDateFnsAdapter } from '@alfresco/adf-core'; -import { SearchWidget } from '../../models/search-widget.interface'; -import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; -import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; -import { LiveErrorStateMatcher } from '../../forms/live-error-state-matcher'; -import { Subject } from 'rxjs'; -import { MatDatepickerInputEvent } from '@angular/material/datepicker'; -import { startOfDay, endOfDay, isBefore, isValid as isValidDate } from 'date-fns'; - -export interface DateRangeValue { - from: string; - to: string; -} - -const DEFAULT_FORMAT_DATE: string = 'DD/MM/YYYY'; - -interface DateRangeForm { - from: FormControl; - to: FormControl; -} - -@Component({ - selector: 'adf-search-date-range', - templateUrl: './search-date-range.component.html', - styleUrls: ['./search-date-range.component.scss'], - providers: [ - { provide: MAT_DATE_FORMATS, useValue: ADF_DATE_FORMATS }, - { provide: DateAdapter, useClass: AdfDateFnsAdapter } - ], - encapsulation: ViewEncapsulation.None, - host: { class: 'adf-search-date-range' } -}) -export class SearchDateRangeComponent implements SearchWidget, OnInit { - from: FormControl; - to: FormControl; - - form: FormGroup; - matcher = new LiveErrorStateMatcher(); - - id: string; - settings?: SearchWidgetSettings; - context?: SearchQueryBuilderService; - datePickerFormat: string; - maxDate: Date; - fromMaxDate: Date; - isActive = false; - startValue: any; - enableChangeUpdate: boolean; - displayValue$ = new Subject(); - - constructor(private dateAdapter: DateAdapter) {} - - getFromValidationMessage(): string { - return this.from.hasError('invalidOnChange') || this.hasParseError(this.from) - ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' - : this.from.hasError('matDatepickerMax') - ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' - : this.from.hasError('required') - ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' - : ''; - } - - getToValidationMessage(): string { - return this.to.hasError('invalidOnChange') || this.hasParseError(this.to) - ? 'SEARCH.FILTER.VALIDATION.INVALID-DATE' - : this.to.hasError('matDatepickerMin') - ? 'SEARCH.FILTER.VALIDATION.NO-DAYS' - : this.to.hasError('matDatepickerMax') - ? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE' - : this.to.hasError('required') - ? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE' - : ''; - } - - ngOnInit() { - this.datePickerFormat = this.settings?.dateFormat ? this.settings.dateFormat : DEFAULT_FORMAT_DATE; - - const customDateAdapter = this.dateAdapter as AdfDateFnsAdapter; - customDateAdapter.displayFormat = this.datePickerFormat; - - const validators = Validators.compose([Validators.required]); - - if (this.settings?.maxDate) { - if (this.settings.maxDate === 'today') { - this.maxDate = endOfDay(this.dateAdapter.today()); - } else { - this.maxDate = endOfDay(this.dateAdapter.parse(this.settings.maxDate, this.datePickerFormat)); - } - } - - if (this.startValue) { - const splitValue = this.startValue.split('||'); - const fromValue = this.dateAdapter.parse(splitValue[0], this.datePickerFormat); - const toValue = this.dateAdapter.parse(splitValue[1], this.datePickerFormat); - this.from = new FormControl(fromValue, validators); - this.to = new FormControl(toValue, validators); - } else { - this.from = new FormControl(null, validators); - this.to = new FormControl(null, validators); - } - - this.form = new FormGroup({ - from: this.from, - to: this.to - }); - - this.setFromMaxDate(); - this.enableChangeUpdate = this.settings?.allowUpdateOnChange ?? true; - } - - apply(model: Partial<{ from: Date; to: Date }>, isValid: boolean) { - if (isValid && this.id && this.context && this.settings && this.settings.field) { - this.isActive = true; - - const start = startOfDay(model.from).toISOString(); - const end = endOfDay(model.to).toISOString(); - - this.context.queryFragments[this.id] = `${this.settings.field}:['${start}' TO '${end}']`; - - this.updateDisplayValue(); - this.context.update(); - } - } - - submitValues() { - this.apply(this.form.value, this.form.valid); - } - - hasValidValue(): boolean { - return this.form.valid; - } - - getCurrentValue(): DateRangeValue { - return { - from: this.dateAdapter.format(this.form.value.from, this.datePickerFormat), - to: this.dateAdapter.format(this.form.value.from, this.datePickerFormat) - }; - } - - updateDisplayValue(): void { - if (this.form.invalid || this.form.pristine) { - this.displayValue$.next(''); - } else { - this.displayValue$.next( - `${this.dateAdapter.format(this.form.value.from, this.datePickerFormat)} - ${this.dateAdapter.format( - this.form.value.to, - this.datePickerFormat - )}` - ); - } - } - - setValue(parsedDate: string) { - const splitValue = parsedDate.split('||'); - const fromValue = this.dateAdapter.parse(splitValue[0], this.datePickerFormat); - const toValue = this.dateAdapter.parse(splitValue[1], this.datePickerFormat); - this.from.setValue(fromValue); - this.from.markAsDirty(); - this.from.markAsTouched(); - this.to.setValue(toValue); - this.to.markAsDirty(); - this.to.markAsTouched(); - this.submitValues(); - } - - clear() { - this.isActive = false; - this.form.reset({ - from: null, - to: null - }); - - if (this.id && this.context) { - this.context.queryFragments[this.id] = ''; - if (this.enableChangeUpdate) { - this.updateQuery(); - } - } - - this.setFromMaxDate(); - } - - reset() { - this.clear(); - this.updateQuery(); - } - - private updateQuery() { - if (this.id && this.context) { - this.updateDisplayValue(); - this.context.update(); - } - } - - onChangedHandler(event: MatDatepickerInputEvent, formControl: FormControl) { - const inputValue = event.value; - - if (isValidDate(inputValue)) { - formControl.setValue(inputValue); - } else if (inputValue) { - formControl.setErrors({ - invalidOnChange: true - }); - } - - this.setFromMaxDate(); - } - - hasParseError(formControl: FormControl): boolean { - return formControl.hasError('matDatepickerParse') && formControl.getError('matDatepickerParse').text; - } - - forcePlaceholder(event: any) { - event.srcElement.click(); - } - - setFromMaxDate() { - this.fromMaxDate = !this.to.value || (this.maxDate && isBefore(this.maxDate, this.to.value)) ? this.maxDate : this.to.value; - } -} diff --git a/lib/content-services/src/lib/search/public-api.ts b/lib/content-services/src/lib/search/public-api.ts index 6e2b1b9089..953706c176 100644 --- a/lib/content-services/src/lib/search/public-api.ts +++ b/lib/content-services/src/lib/search/public-api.ts @@ -47,7 +47,6 @@ export * from './components/search.component'; export * from './components/search-panel/search-panel.component'; export * from './components/search-check-list/search-check-list.component'; export * from './components/search-chip-list/search-chip-list.component'; -export * from './components/search-date-range/search-date-range.component'; export * from './components/search-filter/search-filter.component'; export * from './components/search-filter-container/search-filter-container.component'; export * from './components/search-number-range/search-number-range.component'; @@ -63,7 +62,8 @@ export * from './components/search-filter-chips/search-filter-chips.component'; export * from './components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component'; export * from './components/search-facet-field/search-facet-field.component'; export * from './components/search-logical-filter/search-logical-filter.component'; -export * from './components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component'; +export * from './components/search-date-range-tabbed/search-date-range/search-date-range.component'; +export * from './components/search-date-range-tabbed/search-date-range-tabbed.component'; export * from './components/search-filter-tabbed/search-filter-tabbed.component'; export * from './components/reset-search.directive'; export * from './components/search-chip-autocomplete-input/search-chip-autocomplete-input.component'; diff --git a/lib/content-services/src/lib/search/search.module.ts b/lib/content-services/src/lib/search/search.module.ts index ffc3b52cb2..ce75e0ca48 100644 --- a/lib/content-services/src/lib/search/search.module.ts +++ b/lib/content-services/src/lib/search/search.module.ts @@ -37,7 +37,6 @@ import { SearchSliderComponent } from './components/search-slider/search-slider. import { SearchNumberRangeComponent } from './components/search-number-range/search-number-range.component'; import { SearchPanelComponent } from './components/search-panel/search-panel.component'; import { SearchCheckListComponent } from './components/search-check-list/search-check-list.component'; -import { SearchDateRangeComponent } from './components/search-date-range/search-date-range.component'; import { SearchSortingPickerComponent } from './components/search-sorting-picker/search-sorting-picker.component'; import { SEARCH_QUERY_SERVICE_TOKEN } from './search-query-service.token'; import { SearchQueryBuilderService } from './services/search-query-builder.service'; @@ -53,8 +52,8 @@ import { SearchLogicalFilterComponent } from './components/search-logical-filter import { ResetSearchDirective } from './components/reset-search.directive'; import { SearchPropertiesComponent } from './components/search-properties/search-properties.component'; import { SearchFilterTabbedComponent } from './components/search-filter-tabbed/search-filter-tabbed.component'; -import { SearchDateRangeAdvancedComponent } from './components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component'; -import { SearchDateRangeAdvancedTabbedComponent } from './components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component'; +import { SearchDateRangeComponent } from './components/search-date-range-tabbed/search-date-range/search-date-range.component'; +import { SearchDateRangeTabbedComponent } from './components/search-date-range-tabbed/search-date-range-tabbed.component'; import { SearchFilterTabDirective } from './components/search-filter-tabbed/search-filter-tab.directive'; import { SearchFacetChipTabbedComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component'; import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component'; @@ -84,7 +83,6 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch SearchNumberRangeComponent, SearchPanelComponent, SearchCheckListComponent, - SearchDateRangeComponent, SearchDatetimeRangeComponent, SearchSortingPickerComponent, SearchFilterContainerComponent, @@ -98,8 +96,8 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch ResetSearchDirective, SearchPropertiesComponent, SearchFilterTabbedComponent, - SearchDateRangeAdvancedComponent, - SearchDateRangeAdvancedTabbedComponent, + SearchDateRangeComponent, + SearchDateRangeTabbedComponent, SearchFilterTabDirective, SearchFacetChipTabbedComponent, SearchFacetTabbedContentComponent @@ -119,7 +117,6 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch SearchNumberRangeComponent, SearchPanelComponent, SearchCheckListComponent, - SearchDateRangeComponent, SearchDatetimeRangeComponent, SearchSortingPickerComponent, SearchFilterContainerComponent, @@ -129,7 +126,8 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch SearchFacetFieldComponent, SearchLogicalFilterComponent, SearchFilterTabbedComponent, - SearchDateRangeAdvancedComponent, + SearchDateRangeComponent, + SearchDateRangeTabbedComponent, ResetSearchDirective, SearchFacetChipTabbedComponent, SearchFacetTabbedContentComponent diff --git a/lib/content-services/src/lib/search/services/search-filter.service.ts b/lib/content-services/src/lib/search/services/search-filter.service.ts index 491bf471bf..3693e91499 100644 --- a/lib/content-services/src/lib/search/services/search-filter.service.ts +++ b/lib/content-services/src/lib/search/services/search-filter.service.ts @@ -21,14 +21,11 @@ import { SearchRadioComponent } from '../components/search-radio/search-radio.co import { SearchSliderComponent } from '../components/search-slider/search-slider.component'; import { SearchNumberRangeComponent } from '../components/search-number-range/search-number-range.component'; import { SearchCheckListComponent } from '../components/search-check-list/search-check-list.component'; -import { SearchDateRangeComponent } from '../components/search-date-range/search-date-range.component'; import { SearchDatetimeRangeComponent } from '../components/search-datetime-range/search-datetime-range.component'; import { SearchLogicalFilterComponent } from '../components/search-logical-filter/search-logical-filter.component'; import { SearchFilterAutocompleteChipsComponent } from '../components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component'; import { SearchPropertiesComponent } from '../components/search-properties/search-properties.component'; -import { - SearchDateRangeAdvancedTabbedComponent -} from '../components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component'; +import { SearchDateRangeTabbedComponent } from '../components/search-date-range-tabbed/search-date-range-tabbed.component'; @Injectable({ providedIn: 'root' @@ -45,11 +42,10 @@ export class SearchFilterService { properties: SearchPropertiesComponent, 'number-range': SearchNumberRangeComponent, 'check-list': SearchCheckListComponent, - 'date-range': SearchDateRangeComponent, 'datetime-range': SearchDatetimeRangeComponent, 'logical-filter': SearchLogicalFilterComponent, 'autocomplete-chips': SearchFilterAutocompleteChipsComponent, - 'date-range-advanced': SearchDateRangeAdvancedTabbedComponent + 'date-range': SearchDateRangeTabbedComponent }; } diff --git a/lib/testing/src/lib/protractor/content-services/pages/search/date-range-filter.page.ts b/lib/testing/src/lib/protractor/content-services/pages/search/date-range-filter.page.ts deleted file mode 100644 index 0290b58733..0000000000 --- a/lib/testing/src/lib/protractor/content-services/pages/search/date-range-filter.page.ts +++ /dev/null @@ -1,141 +0,0 @@ -/*! - * @license - * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { protractor, ElementFinder, $ } from 'protractor'; -import { DatePickerCalendarPage } from '../../../core/pages/material/date-picker-calendar.page'; -import { BrowserVisibility } from '../../../core/utils/browser-visibility'; -import { BrowserActions } from '../../../core/utils/browser-actions'; - -export class DateRangeFilterPage { - fromField = '[data-automation-id="date-range-from-input"]'; - fromDateToggle = '[data-automation-id="date-range-from-date-toggle"]'; - toField = '[data-automation-id="date-range-to-input"]'; - toDateToggle = '[data-automation-id="date-range-to-date-toggle"]'; - applyButton = '[data-automation-id="date-range-apply-btn"]'; - clearButton = '[data-automation-id="date-range-clear-btn"]'; - fromErrorMessage = '[data-automation-id="date-range-from-error"]'; - toErrorMessage = '[data-automation-id="date-range-to-error"]'; - filter: ElementFinder; - - constructor(filter: ElementFinder) { - this.filter = filter; - } - - async getFromDate(): Promise { - return BrowserActions.getInputValue(this.filter.$(this.fromField)); - } - - async putFromDate(date): Promise { - await this.checkFromFieldIsDisplayed(); - await BrowserActions.clearSendKeys(this.filter.$(this.fromField), date); - await this.filter.$(this.fromField).sendKeys(protractor.Key.ENTER); - } - - async getFromCalendarSelectedDate(): Promise { - const datePicker = await this.openFromDatePicker(); - const selectedDate = await datePicker.getSelectedDate(); - await datePicker.closeDatePicker(); - return selectedDate; - } - - async openFromDatePicker(): Promise { - await BrowserActions.click(this.filter.$(this.fromDateToggle)); - - const datePicker = new DatePickerCalendarPage(); - await datePicker.checkDatePickerIsDisplayed(); - return datePicker; - } - - async openToDatePicker(): Promise { - await BrowserActions.click(this.filter.$(this.toDateToggle)); - const datePicker = new DatePickerCalendarPage(); - await datePicker.checkDatePickerIsDisplayed(); - return datePicker; - } - - async clickFromField(): Promise { - await BrowserActions.click(this.filter.$(this.fromField)); - } - - async checkFromErrorMessageIsDisplayed(msg: string): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromErrorMessage)); - const text = await BrowserActions.getText(this.filter.$(this.fromErrorMessage)); - await expect(text).toEqual(msg); - } - - async checkFromErrorMessageIsNotDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsNotVisible(this.filter.$(this.fromErrorMessage)); - } - - async checkFromFieldIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromField)); - } - - async checkFromDateToggleIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromDateToggle)); - } - - async getToDate(): Promise { - return BrowserActions.getInputValue(this.filter.$(this.toField)); - } - - async putToDate(date): Promise { - await this.checkToFieldIsDisplayed(); - await BrowserActions.clearSendKeys($(this.toField), date); - await this.filter.$(this.toField).sendKeys(protractor.Key.ENTER); - } - - async clickToField(): Promise { - await BrowserActions.click(this.filter.$(this.toField)); - } - - async checkToErrorMessageIsDisplayed(msg): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toErrorMessage)); - const text = await BrowserActions.getText(this.filter.$(this.toErrorMessage)); - await expect(text).toEqual(msg); - } - - async checkToFieldIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toField)); - } - - async checkToDateToggleIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toDateToggle)); - } - - async clickApplyButton(): Promise { - await BrowserActions.click(this.filter.$(this.applyButton)); - } - - async checkApplyButtonIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.applyButton)); - } - - async checkApplyButtonIsEnabled(): Promise { - const isEnabled = await this.filter.$(this.applyButton).isEnabled(); - await expect(isEnabled).toBe(true); - } - - async checkApplyButtonIsDisabled(): Promise { - const isEnabled = await this.filter.$(this.applyButton).isEnabled(); - await expect(isEnabled).toBe(false); - } - - async checkClearButtonIsDisplayed(): Promise { - await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.clearButton)); - } -} diff --git a/lib/testing/src/lib/protractor/content-services/pages/search/public-api.ts b/lib/testing/src/lib/protractor/content-services/pages/search/public-api.ts index f8d39165d5..a204757827 100644 --- a/lib/testing/src/lib/protractor/content-services/pages/search/public-api.ts +++ b/lib/testing/src/lib/protractor/content-services/pages/search/public-api.ts @@ -16,7 +16,6 @@ */ export * from './search-categories.page'; -export * from './date-range-filter.page'; export * from './number-range-filter.page'; export * from './search-check-list.page'; export * from './search-radio.page'; diff --git a/lib/testing/src/lib/protractor/content-services/pages/search/search-categories.page.ts b/lib/testing/src/lib/protractor/content-services/pages/search/search-categories.page.ts index d411f17e10..b4320d71f5 100644 --- a/lib/testing/src/lib/protractor/content-services/pages/search/search-categories.page.ts +++ b/lib/testing/src/lib/protractor/content-services/pages/search/search-categories.page.ts @@ -19,7 +19,6 @@ import { ElementFinder } from 'protractor'; import { SearchTextPage } from './search-text.page'; import { SearchCheckListPage } from './search-check-list.page'; import { SearchRadioPage } from './search-radio.page'; -import { DateRangeFilterPage } from './date-range-filter.page'; import { NumberRangeFilterPage } from './number-range-filter.page'; import { SearchSliderPage } from './search-slider.page'; import { BrowserActions } from '../../../core/utils/browser-actions'; @@ -39,10 +38,6 @@ export class SearchCategoriesPage { return new SearchRadioPage(filter); } - static dateRangeFilter(filter: ElementFinder): DateRangeFilterPage { - return new DateRangeFilterPage(filter); - } - static numberRangeFilter(filter: ElementFinder): NumberRangeFilterPage { return new NumberRangeFilterPage(filter); }