This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/streampipes.git
The following commit(s) were added to refs/heads/dev by this push:
new 88c01a9b0a fix: Time selector menu for widgets in dashboard (#3342)
88c01a9b0a is described below
commit 88c01a9b0a00b543c6b2802797bfe070624310e3
Author: Marcel Früholz <[email protected]>
AuthorDate: Tue Nov 19 17:02:32 2024 +0100
fix: Time selector menu for widgets in dashboard (#3342)
---
.../time-selector/time-range-selector.component.ts | 17 +++++------------
.../src/lib/services/time-selection.service.ts | 9 +++++++++
.../data-explorer-dashboard-widget.component.html | 3 +++
.../widget/data-explorer-dashboard-widget.component.ts | 12 +++++++++++-
4 files changed, 28 insertions(+), 13 deletions(-)
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/components/time-selector/time-range-selector.component.ts
b/ui/projects/streampipes/shared-ui/src/lib/components/time-selector/time-range-selector.component.ts
index 5bf8a69018..465ae91373 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/components/time-selector/time-range-selector.component.ts
+++
b/ui/projects/streampipes/shared-ui/src/lib/components/time-selector/time-range-selector.component.ts
@@ -75,13 +75,7 @@ export class TimeRangeSelectorComponent implements OnInit,
OnChanges {
quickSelections: QuickTimeSelection[];
@Input()
- labels: TimeSelectorLabel = {
- quickSelectionLabel: 'Quick Selection',
- customLabel: 'Custom',
- maxDayRangeErrorLabel:
- 'Maximum of ${this.maxDayRange} days can be displayed. Please
select a smaller range.',
- timeRangeSelectorTooltip: 'Modify time range',
- };
+ labels: TimeSelectorLabel;
simpleTimeString: string = '';
timeString: TimeString;
@@ -96,15 +90,14 @@ export class TimeRangeSelectorComponent implements OnInit,
OnChanges {
constructor(private timeSelectionService: TimeSelectionService) {}
ngOnInit() {
- if (!this.quickSelections) {
- this.quickSelections =
- this.timeSelectionService.defaultQuickTimeSelections;
- }
+ this.quickSelections ??=
+ this.timeSelectionService.defaultQuickTimeSelections;
+ this.labels ??= this.timeSelectionService.defaultLabels;
this.createDateString();
}
ngOnChanges(changes: SimpleChanges) {
- if (changes.timeSettings) {
+ if (changes.timeSettings && this.quickSelections !== undefined) {
this.createDateString();
}
}
diff --git
a/ui/projects/streampipes/shared-ui/src/lib/services/time-selection.service.ts
b/ui/projects/streampipes/shared-ui/src/lib/services/time-selection.service.ts
index a635ab1c54..bc23977e7f 100644
---
a/ui/projects/streampipes/shared-ui/src/lib/services/time-selection.service.ts
+++
b/ui/projects/streampipes/shared-ui/src/lib/services/time-selection.service.ts
@@ -38,6 +38,7 @@ import {
subWeeks,
subYears,
} from 'date-fns';
+import { TimeSelectorLabel } from
'../components/time-selector/time-selector.model';
@Injectable({ providedIn: 'root' })
export class TimeSelectionService {
@@ -50,6 +51,14 @@ export class TimeSelectionService {
525600: TimeSelectionConstants.LAST_YEAR,
};
+ defaultLabels: TimeSelectorLabel = {
+ quickSelectionLabel: 'Quick Selection',
+ customLabel: 'Custom',
+ maxDayRangeErrorLabel:
+ 'Maximum of ${this.maxDayRange} days can be displayed. Please
select a smaller range.',
+ timeRangeSelectorTooltip: 'Modify time range',
+ };
+
defaultQuickTimeSelections: QuickTimeSelection[] = [
{
label: 'Last 15 min',
diff --git
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
index ea476a9846..54e23fe4f9 100644
---
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
+++
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.html
@@ -126,7 +126,10 @@
</button>
<mat-menu #optMenu="matMenu" class="large-menu">
<sp-time-selector-menu
+ *ngIf="quickSelections"
[timeSettings]="clonedTimeSettings"
+ [quickSelections]="quickSelections"
+ [labels]="labels"
(timeSettingsEmitter)="modifyWidgetTimeSettings($event)"
class="w-100"
>
diff --git
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.ts
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.ts
index 32c1d53801..f9e4ea6ec1 100644
---
a/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.ts
+++
b/ui/src/app/data-explorer/components/widget/data-explorer-dashboard-widget.component.ts
@@ -34,6 +34,7 @@ import {
DashboardItem,
DataExplorerWidgetModel,
DataLakeMeasure,
+ QuickTimeSelection,
SpLogMessage,
TimeSettings,
} from '@streampipes/platform-services';
@@ -49,6 +50,7 @@ import { BaseWidgetData } from
'../../models/dataview-dashboard.model';
import { DataExplorerDashboardService } from
'../../services/data-explorer-dashboard.service';
import { MatMenuTrigger } from '@angular/material/menu';
import { TimeSelectionService } from '@streampipes/shared-ui';
+import { TimeSelectorLabel } from
'projects/streampipes/shared-ui/src/lib/components/time-selector/time-selector.model';
@Component({
selector: 'sp-data-explorer-dashboard-widget',
@@ -104,6 +106,8 @@ export class DataExplorerDashboardWidgetComponent
timerActive = false;
loadingTime = 0;
+ quickSelections: QuickTimeSelection[];
+ labels: TimeSelectorLabel;
clonedTimeSettings: TimeSettings;
timeSettingsModified: boolean = false;
@@ -137,6 +141,9 @@ export class DataExplorerDashboardWidgetComponent
}
ngOnInit(): void {
+ this.quickSelections =
+ this.timeSelectionService.defaultQuickTimeSelections;
+ this.labels = this.timeSelectionService.defaultLabels;
this.authSubscription = this.currentUserService.user$.subscribe(
user => {
this.hasDataExplorerWritePrivileges = this.authService.hasRole(
@@ -225,7 +232,10 @@ export class DataExplorerDashboardWidgetComponent
getTimeSettings(): TimeSettings {
if (this.globalTimeEnabled) {
return this.timeSettings;
- } else if (this.dashboardItem.timeSettings !== undefined) {
+ } else if (
+ this.dashboardItem.timeSettings !== undefined &&
+ this.dashboardItem.timeSettings !== null
+ ) {
return this.dashboardItem.timeSettings as TimeSettings;
} else {
return this.configuredWidget.timeSettings as TimeSettings;
