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 b25e5b16fe fix: Avoid flickering of data explorer tables in live
refresh mode (#3832)
b25e5b16fe is described below
commit b25e5b16fe95dfeeaa0f546c9cb87fa295ab7593
Author: Dominik Riemer <[email protected]>
AuthorDate: Tue Oct 14 10:44:35 2025 +0200
fix: Avoid flickering of data explorer tables in live refresh mode (#3832)
---
.../data-explorer-chart-container.component.html | 36 ++++++++++------------
.../data-explorer-chart-container.component.scss | 9 ------
.../charts/table/table-widget.component.ts | 5 +--
.../data-explorer-chart-view.component.html | 1 +
4 files changed, 19 insertions(+), 32 deletions(-)
diff --git
a/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.html
b/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.html
index ff99e58676..b5e72d37e5 100644
---
a/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.html
+++
b/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.html
@@ -42,25 +42,23 @@
</div>
@if (!kioskMode) {
<div fxFlex="100" fxLayout="row" fxLayoutAlign="end center">
- <mat-spinner
- [diameter]="20"
- color="primary"
- class="mr-10"
- *ngIf="timerActive"
- >
- </mat-spinner>
- <div
- class="time-counter"
- *ngIf="editMode"
- [ngStyle]="{
- background:
-
configuredWidget.baseAppearanceConfig.textColor,
- color: configuredWidget.baseAppearanceConfig
- .backgroundColor
- }"
- >
- {{ loadingTime }}s
- </div>
+ @if (editMode) {
+ <mat-spinner
+ [diameter]="20"
+ color="primary"
+ class="mr-10"
+ *ngIf="timerActive"
+ >
+ </mat-spinner>
+ <sp-label
+ size="small"
+ [labelBackground]="
+ configuredWidget.baseAppearanceConfig.textColor
+ "
+ [labelText]="loadingTime + 's'"
+ class="mr-10"
+ ></sp-label>
+ }
<button
mat-icon-button
[matMenuTriggerFor]="menu"
diff --git
a/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.scss
b/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.scss
index 5d555a60cb..875f5fed06 100644
---
a/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.scss
+++
b/ui/src/app/data-explorer-shared/components/chart-container/data-explorer-chart-container.component.scss
@@ -77,15 +77,6 @@
background: rgba(0, 0, 0, 0.35);
}
-.time-counter {
- border-radius: 10px;
- padding-left: 10px;
- padding-right: 10px;
- width: 65px;
- margin-right: 10px;
- text-align: center;
-}
-
.h-0 {
height: 0px;
}
diff --git
a/ui/src/app/data-explorer-shared/components/charts/table/table-widget.component.ts
b/ui/src/app/data-explorer-shared/components/charts/table/table-widget.component.ts
index b51126c288..a125322eee 100644
---
a/ui/src/app/data-explorer-shared/components/charts/table/table-widget.component.ts
+++
b/ui/src/app/data-explorer-shared/components/charts/table/table-widget.component.ts
@@ -144,10 +144,7 @@ export class TableWidgetComponent
onResize(width: number, height: number) {}
- beforeDataFetched() {
- this.setShownComponents(false, false, true, false);
- this.dataSource.data = [];
- }
+ beforeDataFetched() {}
onDataReceived(spQueryResults: SpQueryResult[]) {
this.regenerateColumnNames();
diff --git
a/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.html
b/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.html
index 91f9f7b542..b040d32a82 100644
---
a/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.html
+++
b/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.html
@@ -75,6 +75,7 @@
dataView.dataConfig?.sourceConfigs?.length > 0
"
[dataViewMode]="true"
+ [editMode]="editMode"
[configuredWidget]="dataView"
[gridsterItemComponent]="gridsterItemComponent"
[timeSettings]="timeSettings"
