Skip to content

Commit 0ffce9b

Browse files
mjabascal10mjabascal10
committed
FIX: Add custom pipe for formatting timezones with offsets.
1 parent 47dcc76 commit 0ffce9b

File tree

4 files changed

+24
-50
lines changed

4 files changed

+24
-50
lines changed

‎frontend/src/app/shared/components/utm/config/app-config-sections/app-config-sections.component.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,10 +103,12 @@ <h6 class="font-weight-semibold mb-2">{{section.section | titlecase}}</h6>
103103
[loadingText]="'Loading Timezones...'"
104104
[loading]="!timezones"
105105
groupBy="zone"
106-
bindLabel="label"
107106
bindValue="timezone"
108107
[(ngModel)]="conf.confParamValue"
109108
id="timezoneSetting">
109+
<ng-template ng-option-tmp ng-label-tmp let-item="item">
110+
({{ item.timezone | timezoneOffset }}) {{ item.label }}
111+
</ng-template>
110112

111113
</ng-select>
112114

‎frontend/src/app/shared/constants/date-timezone-date.const.ts‎

Lines changed: 1 addition & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export const DEFAULT_DATE_SETTING_DATE = 'medium';
66
export const DATE_SETTING_TIMEZONE_SHORT = 'utmstack.time.zone';
77
export const DATE_SETTING_FORMAT_SHORT = 'utmstack.time.dateformat';
88

9-
/*export const TIMEZONES: Array<{ label: string; timezone: string, zone: string }> = [
9+
export const TIMEZONES: Array<{ label: string; timezone: string, zone: string }> = [
1010
{label: 'UTC', timezone: 'UTC', zone: 'UTC'},
1111
{label: 'Eastern Standard Time (New York)', timezone: 'America/New_York', zone: 'America'},
1212
{label: 'Pacific Standard Time (Los Angeles)', timezone: 'America/Los_Angeles', zone: 'America'},
@@ -35,40 +35,8 @@ export const DATE_SETTING_FORMAT_SHORT = 'utmstack.time.dateformat';
3535
{label: 'Jerusalem (IST)', timezone: 'Asia/Jerusalem', zone: 'Asia'},
3636
{label: 'Buenos Aires (ART)', timezone: 'America/Argentina/Buenos_Aires', zone: 'America'},
3737
{label: 'São Paulo (BRT)', timezone: 'America/Sao_Paulo', zone: 'America'},
38-
];*/
39-
40-
export const TIMEZONES: Array<{ label: string; timezone: string, zone: string }> = [
41-
{label: getOffset('UTC'), timezone: 'UTC', zone: 'UTC'},
42-
{label: getOffset('America/New_York'), timezone: 'America/New_York', zone: 'America'},
43-
{label: getOffset('America/Los_Angeles'), timezone: 'America/Los_Angeles', zone: 'America'},
44-
{label: getOffset('America/Chicago'), timezone: 'America/Chicago', zone: 'America'},
45-
{label: getOffset('America/Denver'), timezone: 'America/Denver', zone: 'America'},
46-
{label: getOffset('America/Halifax'), timezone: 'America/Halifax', zone: 'America'},
47-
{label: getOffset('America/Anchorage'), timezone: 'America/Anchorage', zone: 'America'},
48-
{label: getOffset('Pacific/Honolulu'), timezone: 'Pacific/Honolulu', zone: 'Pacific'},
49-
{label: getOffset('Europe/London'), timezone: 'Europe/London', zone: 'Europe'},
50-
{label: getOffset('Europe/Paris'), timezone: 'Europe/Paris', zone: 'Europe'},
51-
{label: getOffset('Europe/Berlin'), timezone: 'Europe/Berlin', zone: 'Europe'},
52-
{label: getOffset('Europe/Madrid'), timezone: 'Europe/Madrid', zone: 'Europe'},
53-
{label: getOffset('Europe/Rome'), timezone: 'Europe/Rome', zone: 'Europe'},
54-
{label: getOffset('Europe/Moscow'), timezone: 'Europe/Moscow', zone: 'Europe'},
55-
{label: getOffset('Europe/Istanbul'), timezone: 'Europe/Istanbul', zone: 'Europe'},
56-
{label: getOffset('Australia/Sydney'), timezone: 'Australia/Sydney', zone: 'Australia'},
57-
{label: getOffset('Australia/Melbourne'), timezone: 'Australia/Melbourne', zone: 'Australia'},
58-
{label: getOffset('Australia/Perth'), timezone: 'Australia/Perth', zone: 'Australia'},
59-
{label: getOffset('Asia/Shanghai'), timezone: 'Asia/Shanghai', zone: 'Asia'},
60-
{label: getOffset('Asia/Tokyo'), timezone: 'Asia/Tokyo', zone: 'Asia'},
61-
{label: getOffset('Asia/Seoul'), timezone: 'Asia/Seoul', zone: 'Asia'},
62-
{label: getOffset('Asia/Singapore'), timezone: 'Asia/Singapore', zone: 'Asia'},
63-
{label: getOffset('Asia/Hong_Kong'), timezone: 'Asia/Hong_Kong', zone: 'Asia'},
64-
{label: getOffset('Asia/Kolkata'), timezone: 'Asia/Kolkata', zone: 'Asia'},
65-
{label: getOffset('Asia/Dubai'), timezone: 'Asia/Dubai', zone: 'Asia'},
66-
{label: getOffset('Asia/Jerusalem'), timezone: 'Asia/Jerusalem', zone: 'Asia'},
67-
{label: getOffset('America/Argentina/Buenos_Aires'), timezone: 'America/Argentina/Buenos_Aires', zone: 'America'},
68-
{label: getOffset('America/Sao_Paulo'), timezone: 'America/Sao_Paulo', zone: 'America'},
6938
];
7039

71-
7240
export const DATE_FORMATS: Array<{ label: string; format: string; equivalentTo: string }> = [
7341
{label: 'Short', format: 'short', equivalentTo: 'M/d/yy, h:mm a'},
7442
{label: 'Medium', format: 'medium', equivalentTo: 'MMM d, y, h:mm:ss a'},
@@ -100,17 +68,3 @@ export function getDateInfo(
10068
return formatObj ? formatObj : null;
10169
}
10270

103-
// Helper function to get the UTC offset
104-
function getOffset(timezone: string): string {
105-
const now = new Date();
106-
const options = {
107-
timeZone: timezone,
108-
timeZoneName: 'shortOffset' // Esto devuelve el offset en formato GMT±X
109-
};
110-
const formatter = new Intl.DateTimeFormat('en-US', options);
111-
const parts = formatter.formatToParts(now);
112-
113-
// Buscamos la parte que contiene el GMT±X
114-
const gmtPart = parts.find(part => part.type === 'timeZoneName');
115-
return gmtPart ? gmtPart.value : '';
116-
}

‎frontend/src/app/shared/pipes/timezone-offset.pipe.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Pipe, PipeTransform } from '@angular/core';
2+
import * as moment from 'moment-timezone';
3+
4+
@Pipe({
5+
name: 'timezoneOffset'
6+
})
7+
export class TimezoneOffsetPipe implements PipeTransform {
8+
9+
transform(timezone: string): string {
10+
console.log(timezone);
11+
const offset = moment.tz(timezone).format('Z'); // Obtener offset como +02:00
12+
return `GMT${offset}`; // Concatenar con 'GMT'
13+
}
14+
15+
}

‎frontend/src/app/shared/utm-shared.module.ts‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -217,6 +217,7 @@ import {SafePipe} from './pipes/safe.pipe';
217217
import {HighlightPipe} from './pipes/text/highlight.pipe';
218218
import {UtmNotifier} from './websocket/utm-notifier';
219219
import {UtmCollectorDetailComponent} from './components/utm/util/utm-collector-detail/utm-collector-detail.component';
220+
import {TimezoneOffsetPipe} from './pipes/timezone-offset.pipe';
220221

221222

222223
@NgModule({
@@ -356,7 +357,8 @@ import {UtmCollectorDetailComponent} from './components/utm/util/utm-collector-d
356357
ZoomDirective,
357358
IrVariableCreateComponent,
358359
IncidentVariableSelectComponent,
359-
EmailSettingNotificactionComponent
360+
EmailSettingNotificactionComponent,
361+
TimezoneOffsetPipe
360362
],
361363
exports: [
362364
IndexPatternCreateComponent,
@@ -449,7 +451,8 @@ import {UtmCollectorDetailComponent} from './components/utm/util/utm-collector-d
449451
UtmVersionInfoComponent,
450452
IrVariableCreateComponent,
451453
IncidentVariableSelectComponent,
452-
EmailSettingNotificactionComponent
454+
EmailSettingNotificactionComponent,
455+
TimezoneOffsetPipe
453456
],
454457
entryComponents: [
455458
LoginComponent,

0 commit comments

Comments
 (0)