mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
[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:
parent
bb3000346f
commit
780800453a
@ -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) |
|
||||
| [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) |
|
||||
| [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
|
||||
|
||||
|
47
docs/core/pipes/date-time.pipe.md
Normal file
47
docs/core/pipes/date-time.pipe.md
Normal 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>
|
||||
```
|
@ -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 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)
|
||||
|
||||
<!--v620 end-->
|
||||
|
||||
|
70
lib/core/src/lib/pipes/date-time.pipe.spec.ts
Normal file
70
lib/core/src/lib/pipes/date-time.pipe.spec.ts
Normal 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);
|
||||
});
|
||||
});
|
38
lib/core/src/lib/pipes/date-time.pipe.ts
Normal file
38
lib/core/src/lib/pipes/date-time.pipe.ts
Normal 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;
|
||||
}
|
||||
}
|
@ -35,6 +35,7 @@ import { MomentDatePipe } from './moment-date.pipe';
|
||||
import { MomentDateTimePipe } from './moment-datetime.pipe';
|
||||
import { FilterStringPipe } from './filter-string.pipe';
|
||||
import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-prop.pipe';
|
||||
import { DateTimePipe } from './date-time.pipe';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@ -56,6 +57,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
|
||||
LocalizedRolePipe,
|
||||
MomentDatePipe,
|
||||
MomentDateTimePipe,
|
||||
DateTimePipe,
|
||||
FilterStringPipe,
|
||||
FilterOutArrayObjectsByPropPipe
|
||||
],
|
||||
@ -73,6 +75,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
|
||||
LocalizedRolePipe,
|
||||
MomentDatePipe,
|
||||
MomentDateTimePipe,
|
||||
DateTimePipe,
|
||||
FilterStringPipe,
|
||||
FilterOutArrayObjectsByPropPipe
|
||||
],
|
||||
@ -91,6 +94,7 @@ import { FilterOutArrayObjectsByPropPipe } from './filter-out-every-object-by-pr
|
||||
LocalizedRolePipe,
|
||||
MomentDatePipe,
|
||||
MomentDateTimePipe,
|
||||
DateTimePipe,
|
||||
FilterStringPipe,
|
||||
FilterOutArrayObjectsByPropPipe
|
||||
]
|
||||
|
@ -30,5 +30,6 @@ export * from './localized-role.pipe';
|
||||
export * from './pipe.module';
|
||||
export * from './moment-date.pipe';
|
||||
export * from './moment-datetime.pipe';
|
||||
export * from './date-time.pipe';
|
||||
export * from './filter-string.pipe';
|
||||
export * from './filter-out-every-object-by-prop.pipe';
|
||||
|
Loading…
x
Reference in New Issue
Block a user