[ACS-5858] Migrated adfMomentDateTime Pipe to date-fns equivalent (#8856)

* [ACS-5858] created adfDateTimePipe and added unit tests

* [ACS-5858] added revised unit tests

* [ACS-5858] linting fixes

* [ACS-5858] addressed review comments

* [ACS-5858] addressed review comments
This commit is contained in:
SheenaMalhotra182 2023-08-31 14:48:37 +05:30 committed by GitHub
parent bb3000346f
commit 780800453a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 162 additions and 0 deletions

View File

@ -183,6 +183,7 @@ for more information about installing and using the source code.
| [Text Highlight pipe](core/pipes/text-highlight.pipe.md) | Adds highlighting to words or sections of text that match a search string. | [Source](../lib/core/src/lib/pipes/text-highlight.pipe.ts) | | [Text Highlight pipe](core/pipes/text-highlight.pipe.md) | Adds highlighting to words or sections of text that match a search string. | [Source](../lib/core/src/lib/pipes/text-highlight.pipe.ts) |
| [Time Ago pipe](core/pipes/time-ago.pipe.md) | Converts a recent past date into a number of days ago. | [Source](../lib/core/src/lib/pipes/time-ago.pipe.ts) | | [Time Ago pipe](core/pipes/time-ago.pipe.md) | Converts a recent past date into a number of days ago. | [Source](../lib/core/src/lib/pipes/time-ago.pipe.ts) |
| [User Initial pipe](core/pipes/user-initial.pipe.md) | Takes the name fields of a UserProcessModel object and extracts and formats the initials. | [Source](../lib/core/src/lib/pipes/user-initial.pipe.ts) | | [User Initial pipe](core/pipes/user-initial.pipe.md) | Takes the name fields of a UserProcessModel object and extracts and formats the initials. | [Source](../lib/core/src/lib/pipes/user-initial.pipe.ts) |
| [Date Time pipe](core/pipes/date-time.pipe.md) | Converts a given input value into a Date object and adjusts it according to the specified format and timezone offset. | [Source](../lib/core/src/lib/pipes/date-time.pipe.ts) |
### Services ### Services

View File

@ -0,0 +1,47 @@
---
Title: Date Time Pipe
Added: v6.2.0
Status: Active
Last reviewed: 2023-08-30
---
# [Date Time Pipe](../../../lib/core/src/lib/pipes/date-time.pipe.ts "Defined in date-time.pipe.ts")
Converts a given input value into a Date object and adjusts it according to the specified format and timezone offset.
## Basic Usage
<!-- {% raw %} -->
```HTML
<div>
Adjusted Date: {{ inputValue | adfDateTime: 'your-date-format' }}
</div>
```
<!-- {% endraw %} -->
| Name | Type | Description |
| ---- | ---- | ----------- |
| value | string, Date, number | The input value to be converted to a Date object |
| dateFormat | string | The format to use for parsing the input string value |
| returns | Date | The adjusted Date object, accounted with timezone offset |
## Details
The pipe transforms the input value into a Date object, adjusting it for the timezone offset as necessary.
## Input Types
If the input value is of type string, it is parsed using the specified date format and converted to a Date object.
If the input value is a Date object, it is used as is.
If the input value is a number, it is treated as a Unix timestamp and converted to a Date object.
## Timezone Adjustment
The pipe calculates the timezone offset of the input value and adjusts it accordingly. This ensures that the resulting Date object is adjusted to the correct timezone.
## Example
```HTML
<div>
Date: {{ '2023-08-30T12:00:00' | adfDateTime: `yyyy-MM-dd'T'HH:mm:ss` }}
</div>
```

View File

@ -52,6 +52,7 @@ backend services have been tested with each released version of ADF.
- [Search Date Range Advanced Tabbed Component](content-services/components/search-date-range-advanced-tabbed.component.md) - [Search Date Range Advanced Tabbed Component](content-services/components/search-date-range-advanced-tabbed.component.md)
- [Search Filter Tabbed Component](content-services/components/search-filter-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) - [Search Facet Chip Tabbed Component](content-services/components/search-facet-chip-tabbed.md)
- [Date Time Pipe](core/pipes/date-time.pipe.md)
<!--v620 end--> <!--v620 end-->

View File

@ -0,0 +1,70 @@
/*!
* @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 { TestBed } from '@angular/core/testing';
import { CoreTestingModule } from '../testing/core.testing.module';
import { TranslateModule } from '@ngx-translate/core';
import { DateTimePipe } from './date-time.pipe';
import { addMinutes, isValid } from 'date-fns';
describe('DateTimePipe', () => {
let pipe: DateTimePipe;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [TranslateModule.forRoot(), CoreTestingModule],
providers: [DateTimePipe]
});
pipe = new DateTimePipe();
});
it('should transform string input to date format', () => {
const value = '2023-08-24 12:00:00';
const dateFormat = 'yyyy-MM-dd HH:mm:ss';
const transformedDate = pipe.transform(value, dateFormat);
expect(transformedDate instanceof Date).toBe(true);
expect(isValid(transformedDate)).toBe(true);
const expectedDate = new Date(value);
expect(transformedDate).toEqual(addMinutes(new Date(expectedDate), new Date().getTimezoneOffset()));
});
it('should transform Date input', () => {
const value = new Date(2023, 7, 24, 12, 0, 0);
const dateFormat = 'yyyy-MM-dd HH:mm:ss';
const transformedDate = pipe.transform(value, dateFormat);
expect(transformedDate instanceof Date).toBe(true);
expect(isValid(transformedDate)).toBe(true);
expect(transformedDate).toEqual(value);
});
it('should transform number input to date format', () => {
const value = 1693373300; // 30 August 2023 10:58:20
const dateFormat = 'yyyy-MM-dd HH:mm:ss';
const transformedDate = pipe.transform(value, dateFormat);
expect(transformedDate instanceof Date).toBe(true);
expect(isValid(transformedDate)).toBe(true);
const originalDate = new Date(2023, 7, 30, 10, 58, 20);
const timeZoneOffsetMinutes = -330; // 5 hours * 60 minutes/hour + 30 minutes
const expectedDate = addMinutes(originalDate, timeZoneOffsetMinutes);
expect(transformedDate).toEqual(expectedDate);
});
});

View File

@ -0,0 +1,38 @@
/*!
* @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 { Pipe, PipeTransform } from '@angular/core';
import { addMinutes, fromUnixTime, parse } from 'date-fns';
@Pipe({ name: 'adfDateTime' })
export class DateTimePipe implements PipeTransform {
transform(value: string | Date | number, dateFormat: string): Date {
let parsedValue: Date;
if (typeof value === 'string') {
parsedValue = parse(value, dateFormat, new Date());
} else if (value instanceof Date) {
parsedValue = value;
} else {
parsedValue = fromUnixTime(value);
}
const offsetMinutes = parsedValue.getTimezoneOffset();
const adjustedDate = addMinutes(parsedValue, offsetMinutes);
return adjustedDate;
}
}

View File

@ -35,6 +35,7 @@ import { MomentDatePipe } from './moment-date.pipe';
import { MomentDateTimePipe } from './moment-datetime.pipe'; import { MomentDateTimePipe } from './moment-datetime.pipe';
import { FilterStringPipe } from './filter-string.pipe'; import { FilterStringPipe } from './filter-string.pipe';
import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-prop.pipe'; import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-prop.pipe';
import { DateTimePipe } from './date-time.pipe';
@NgModule({ @NgModule({
imports: [ imports: [
@ -56,6 +57,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
LocalizedRolePipe, LocalizedRolePipe,
MomentDatePipe, MomentDatePipe,
MomentDateTimePipe, MomentDateTimePipe,
DateTimePipe,
FilterStringPipe, FilterStringPipe,
FilterOutArrayObjectsByPropPipe FilterOutArrayObjectsByPropPipe
], ],
@ -73,6 +75,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
LocalizedRolePipe, LocalizedRolePipe,
MomentDatePipe, MomentDatePipe,
MomentDateTimePipe, MomentDateTimePipe,
DateTimePipe,
FilterStringPipe, FilterStringPipe,
FilterOutArrayObjectsByPropPipe FilterOutArrayObjectsByPropPipe
], ],
@ -91,6 +94,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
LocalizedRolePipe, LocalizedRolePipe,
MomentDatePipe, MomentDatePipe,
MomentDateTimePipe, MomentDateTimePipe,
DateTimePipe,
FilterStringPipe, FilterStringPipe,
FilterOutArrayObjectsByPropPipe FilterOutArrayObjectsByPropPipe
] ]

View File

@ -30,5 +30,6 @@ export * from './localized-role.pipe';
export * from './pipe.module'; export * from './pipe.module';
export * from './moment-date.pipe'; export * from './moment-date.pipe';
export * from './moment-datetime.pipe'; export * from './moment-datetime.pipe';
export * from './date-time.pipe';
export * from './filter-string.pipe'; export * from './filter-string.pipe';
export * from './filter-out-every-object-by-prop.pipe'; export * from './filter-out-every-object-by-prop.pipe';