[DATALAB-2087]: Fixed issues connected with localization
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/index.ts b/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/index.ts
new file mode 100644
index 0000000..8bd4f7f
--- /dev/null
+++ b/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/index.ts
@@ -0,0 +1,30 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you 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 { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {LongDatePipe} from './long-date.pipe';
+
+@NgModule({
+ imports: [CommonModule],
+ declarations: [LongDatePipe],
+ exports: [LongDatePipe]
+})
+
+export class LongDatePipeModule { }
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/long-date.pipe.ts b/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/long-date.pipe.ts
new file mode 100644
index 0000000..ba64e45
--- /dev/null
+++ b/services/self-service/src/main/resources/webapp/src/app/core/pipes/long-date-pipe/long-date.pipe.ts
@@ -0,0 +1,34 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you 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 {LocalizationService} from '../../services/localization.service';
+import {formatDate} from '@angular/common';
+
+@Pipe({ name: 'longDate' })
+
+export class LongDatePipe implements PipeTransform {
+ constructor(private localizationService: LocalizationService) { }
+
+ transform(value: any, format: string = 'full') {
+ if (!value) { return ; }
+
+ return formatDate(value, format, (this.localizationService.locale === 'en') ? 'en' : 'en-GB');
+ }
+}
diff --git a/services/self-service/src/main/resources/webapp/src/app/core/services/localization.service.ts b/services/self-service/src/main/resources/webapp/src/app/core/services/localization.service.ts
index ab19752..7aa9a0a 100644
--- a/services/self-service/src/main/resources/webapp/src/app/core/services/localization.service.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/core/services/localization.service.ts
@@ -48,9 +48,15 @@
if (culture.indexOf('-') !== -1 && culture !== 'en-GB') {
culture = culture.substr(0, culture.indexOf('-'));
}
- /* webpackInclude: /(uk|sv)\.js$/ */
+
import(
`@angular/common/locales/${culture}.js`
).then(module => registerLocaleData(module.default));
+
+ if (culture !== 'en' && culture !== 'en-GB') {
+ import(
+ `@angular/common/locales/en-GB.js`
+ ).then(module => registerLocaleData(module.default));
+ }
}
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting.module.ts b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting.module.ts
index 65d7ea9..055e555 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting.module.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/reporting.module.ts
@@ -29,6 +29,7 @@
import { ReportingGridComponent } from './reporting-grid/reporting-grid.component';
import { ToolbarComponent } from './toolbar/toolbar.component';
import {LocalCurrencyModule} from '../../core/pipes/local-currency-pipe';
+import {LocalDatePipeModule} from '../../core/pipes/local-date-pipe';
@NgModule({
imports: [
@@ -39,7 +40,8 @@
LineBreaksPipeModule,
NgDateRangePickerModule,
MaterialModule,
- LocalCurrencyModule
+ LocalCurrencyModule,
+ LocalDatePipeModule
],
declarations: [
ReportingComponent,
diff --git a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/toolbar/toolbar.component.html b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/toolbar/toolbar.component.html
index d7da74b..ca883aa 100644
--- a/services/self-service/src/main/resources/webapp/src/app/reports/reporting/toolbar/toolbar.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/reports/reporting/toolbar/toolbar.component.html
@@ -24,8 +24,8 @@
</span><strong>{{ reportData.tag_resource_id }}</strong></div>
<div class="report-period info_color" *ngIf="availablePeriodFrom && availablePeriodTo">
<span>Available reporting period from:</span>
- <strong>{{ availablePeriodFrom.join('/') | date }} </strong>
- to: <strong>{{ availablePeriodTo.join('/') | date }}</strong>
+ <strong>{{ availablePeriodFrom.join('/') | localDate }} </strong>
+ to: <strong>{{ availablePeriodTo.join('/') | localDate }}</strong>
</div>
</div>
</div>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.html
index 0872a25..c9b048f 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.html
@@ -98,7 +98,9 @@
<div *ngIf="resource.status === 'running'">
<div class="row-wrap">
- <p class="time_info">Up time {{upTimeInHours}} hour(s) since {{upTimeSince || "not specified."}}</p>
+ <p class="time_info">Up time {{upTimeInHours}} hour(s) since {{resource.up_time ? (resource.up_time | longDate) : "not specified."
+ }}
+ </p>
</div>
<div class="m-top-10">
<p *ngFor="let item of resource.computational_url" class="ellipsis flex" (mouseleave)="hideCopyIcon()">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.ts
index 4d2e6dd..6d72f49 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/cluster-details.component.ts
@@ -44,7 +44,6 @@
@ViewChild('configurationNode', { static: false }) configuration;
upTimeInHours: number;
- upTimeSince: string = '';
tooltip: boolean = false;
config: Array<{}> = [];
public configurationForm: FormGroup;
@@ -71,8 +70,6 @@
this.upTimeInHours = (this.resource.up_time) ? DateUtils.diffBetweenDatesInHours(this.resource.up_time) : 0;
- this.upTimeSince = (this.resource.up_time) ?
- new Date(this.resource.up_time).toString().substr(0, new Date(this.resource.up_time).toString().indexOf('(')) : '';
this.initFormModel();
if (this.resource.image === 'docker.datalab-dataengine') this.getClusterConfiguration();
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/index.ts b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/index.ts
index 88bfff6..1cc87c8 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/index.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/computational/cluster-details/index.ts
@@ -23,11 +23,12 @@
import { MaterialModule } from '../../../shared/material.module';
import { DetailComputationalResourcesComponent } from './cluster-details.component';
+import {LongDatePipeModule} from '../../../core/pipes/long-date-pipe';
export * from './cluster-details.component';
@NgModule({
- imports: [CommonModule, FormsModule, ReactiveFormsModule, MaterialModule],
+ imports: [CommonModule, FormsModule, ReactiveFormsModule, MaterialModule, LongDatePipeModule],
declarations: [DetailComputationalResourcesComponent],
entryComponents: [DetailComputationalResourcesComponent],
exports: [DetailComputationalResourcesComponent],
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
index a667058..9258d03 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.html
@@ -80,7 +80,7 @@
<div class="detail-info" *ngIf="!notebook.error_message">
<p>Edge Node IP Address {{notebook.node_ip}}</p>
<p *ngIf="notebook.status === 'running'">Up time {{upTimeInHours}} hour(s) since
- {{upTimeSince || "not specified."}}</p>
+ {{notebook.time ? (notebook.time | longDate ) : "not specified."}}</p>
<p *ngIf="notebook.url?.length">Open following URL(s) in your browser to access this box:</p>
<div class="links_block">
<ng-container *ngFor="let item of notebook.url">
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
index 22c4bfa..4800faa 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/detail-dialog.component.ts
@@ -42,7 +42,6 @@
private isCopied: boolean = true;
notebook: any;
upTimeInHours: number;
- upTimeSince: string = '';
tooltip: boolean = false;
config: Array<{}> = [];
bucketStatus: object = {};
@@ -50,7 +49,6 @@
isCopyIconVissible: {bucket} = {bucket: false};
public configurationForm: FormGroup;
-
@ViewChild('configurationNode', { static: false }) configuration;
@@ -73,8 +71,6 @@
this.tooltip = false;
this.upTimeInHours = (this.notebook.time) ? DateUtils.diffBetweenDatesInHours(this.notebook.time) : 0;
- this.upTimeSince = (this.notebook.time) ?
- new Date(this.notebook.time).toString().substr(0, new Date(this.notebook.time).toString().indexOf('(')) : '';
this.initFormModel();
this.getClusterConfiguration();
if (this.notebook.edgeNodeStatus === 'terminated' ||
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/index.ts b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/index.ts
index f46a7e5..24ec7c5 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/index.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/exploratory/detail-dialog/index.ts
@@ -23,17 +23,19 @@
import { MaterialModule } from '../../../shared/material.module';
import { DetailDialogComponent } from './detail-dialog.component';
import { DirectivesModule } from '../../../core/directives';
+import {LongDatePipeModule} from '../../../core/pipes/long-date-pipe';
export * from './detail-dialog.component';
@NgModule({
- imports: [
- CommonModule,
- FormsModule,
- ReactiveFormsModule,
- MaterialModule,
- DirectivesModule
- ],
+ imports: [
+ CommonModule,
+ FormsModule,
+ ReactiveFormsModule,
+ MaterialModule,
+ DirectivesModule,
+ LongDatePipeModule
+ ],
declarations: [DetailDialogComponent],
entryComponents: [DetailDialogComponent],
exports: [DetailDialogComponent]
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/index.ts b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/index.ts
index 39a9732..6bbc5a0 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/index.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/index.ts
@@ -32,24 +32,26 @@
import { AmiCreateDialogModule } from '../exploratory/ami-create-dialog';
import { SchedulerModule } from '../scheduler';
import { UnderscorelessPipeModule } from '../../core/pipes/underscoreless-pipe';
+import {LocalCurrencyModule} from '../../core/pipes/local-currency-pipe';
@NgModule({
- imports: [
- CommonModule,
- RouterModule,
- ComputationalResourcesModule,
- ConfirmationDialogModule,
- BubbleModule,
- DetailDialogModule,
- ComputationalResourceCreateDialogModule,
- FormControlsModule,
- CostDetailsDialogModule,
- InstallLibrariesModule,
- SchedulerModule,
- AmiCreateDialogModule,
- UnderscorelessPipeModule,
- MaterialModule
- ],
+ imports: [
+ CommonModule,
+ RouterModule,
+ ComputationalResourcesModule,
+ ConfirmationDialogModule,
+ BubbleModule,
+ DetailDialogModule,
+ ComputationalResourceCreateDialogModule,
+ FormControlsModule,
+ CostDetailsDialogModule,
+ InstallLibrariesModule,
+ SchedulerModule,
+ AmiCreateDialogModule,
+ UnderscorelessPipeModule,
+ MaterialModule,
+ LocalCurrencyModule
+ ],
declarations: [ResourcesGridComponent],
exports: [ResourcesGridComponent]
})
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
index 3a6306c..6fd6cab 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/resources-grid/resources-grid.component.html
@@ -147,7 +147,7 @@
</computational-resources-list>
</td>
<td *ngIf="healthStatus?.billingEnabled" class="cost-col">
- <span class="total_cost">{{ element.billing.report_lines.length ? element.cost : 'N/A' }} {{ element.currency_code || '' }}</span>
+ <span class="total_cost">{{ element.billing.report_lines.length ? (element.cost | localcurrency) : 'N/A' }}</span>
<span (click)="element.billing && printCostDetails(element)" class="currency_details"
[ngClass]="{ 'not-allowed' : !element.billing.report_lines.length }">
<i class="material-icons">help_outline</i>
