This is an automated email from the ASF dual-hosted git repository.
zehnder 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 55e44c6bff Moved Add Assets for Charts from PopUp during Save to
Button in Edit Mode (#3853)
55e44c6bff is described below
commit 55e44c6bffa6037edf62a8a653853184430e03fe
Author: Jacqueline Höllig <[email protected]>
AuthorDate: Mon Oct 20 16:37:06 2025 +0200
Moved Add Assets for Charts from PopUp during Save to Button in Edit Mode
(#3853)
Co-authored-by: Philipp Zehnder <[email protected]>
Co-authored-by: Dominik Riemer <[email protected]>
---
ui/cypress/support/utils/connect/ConnectBtns.ts | 2 +-
.../support/utils/dataExplorer/DataExplorerBtns.ts | 16 +++-
.../utils/dataExplorer/DataExplorerUtils.ts | 36 ++++----
ui/cypress/tests/connect/editAdapter.smoke.spec.ts | 4 +-
.../dataExplorer/addAssetsToDataView.smoke.spec.ts | 14 ++-
.../tests/dataExplorer/dataViewAssets.spec.ts | 60 -------------
.../tests/dataExplorer/timeOrderDataView.spec.ts | 4 +-
ui/deployment/i18n/de.json | 2 +-
.../adapter-started-dialog.component.ts | 26 +-----
.../data-explorer-chart-view.component.html | 1 +
.../data-explorer-chart-view.component.ts | 99 ++++++++++++++++----
...data-explorer-chart-view-toolbar.component.html | 11 +++
.../data-explorer-chart-view-toolbar.component.ts | 3 +
.../dialog/asset-dialog.component.html | 100 ++++++++++-----------
.../data-explorer/dialog/asset-dialog.component.ts | 76 +++++-----------
.../save-pipeline-settings.component.ts | 3 +
16 files changed, 225 insertions(+), 232 deletions(-)
diff --git a/ui/cypress/support/utils/connect/ConnectBtns.ts
b/ui/cypress/support/utils/connect/ConnectBtns.ts
index 8ae843d54e..8319dab829 100644
--- a/ui/cypress/support/utils/connect/ConnectBtns.ts
+++ b/ui/cypress/support/utils/connect/ConnectBtns.ts
@@ -31,7 +31,7 @@ export class ConnectBtns {
}
public static editAdapter() {
- return cy.dataCy('edit-adapter');
+ return cy.dataCy('edit-adapter', { timeout: 10000 });
}
public static stopAdapter() {
diff --git a/ui/cypress/support/utils/dataExplorer/DataExplorerBtns.ts
b/ui/cypress/support/utils/dataExplorer/DataExplorerBtns.ts
index 429c785b04..e18474ac40 100644
--- a/ui/cypress/support/utils/dataExplorer/DataExplorerBtns.ts
+++ b/ui/cypress/support/utils/dataExplorer/DataExplorerBtns.ts
@@ -18,7 +18,7 @@
import { GeneralUtils } from '../GeneralUtils';
-export class DataLakeBtns {
+export class DataExplorerBtns {
public static refreshDataLakeMeasures() {
return cy.dataCy('refresh-data-lake-measures');
}
@@ -30,7 +30,21 @@ export class DataLakeBtns {
public static saveDashboard() {
return cy.dataCy('save-data-view').click();
}
+ public static saveChartsToAssetBtn() {
+ return cy
+ .dataCy('add-to-Asset-data-view-btn', { timeout: 10000 })
+ .should('exist')
+ .click();
+ }
+ public static chartAssetCheckboxBtn() {
+ return cy.dataCy('sp-show-chart-asset-checkbox');
+ }
+ public static confirmAssetSelectionBtn() {
+ return cy
+ .dataCy('asset-dialog-confirm-delete', { timeout: 10000 })
+ .click();
+ }
public static editDataViewButton(widgetName: string) {
GeneralUtils.openMenuForRow(widgetName);
return cy
diff --git a/ui/cypress/support/utils/dataExplorer/DataExplorerUtils.ts
b/ui/cypress/support/utils/dataExplorer/DataExplorerUtils.ts
index db51364d14..67f49c96c3 100644
--- a/ui/cypress/support/utils/dataExplorer/DataExplorerUtils.ts
+++ b/ui/cypress/support/utils/dataExplorer/DataExplorerUtils.ts
@@ -26,6 +26,7 @@ import { ConnectBtns } from '../connect/ConnectBtns';
import { AdapterBuilder } from '../../builder/AdapterBuilder';
import { differenceInMonths } from 'date-fns';
import { GeneralUtils } from '../GeneralUtils';
+import { DataExplorerBtns } from './DataExplorerBtns';
export class DataExplorerUtils {
public static goToDatalake() {
@@ -125,7 +126,6 @@ export class DataExplorerUtils {
cy.get('mat-tree.asset-tree', { timeout: 10000 }).should('exist');
assetNameList.forEach(assetName => {
- console.log(assetName);
cy.get('mat-tree.asset-tree')
.find('.mat-tree-node')
.contains(assetName)
@@ -254,15 +254,6 @@ export class DataExplorerUtils {
cy.dataCy('save-data-view-btn', { timeout: 10000 }).click({
force: true,
});
- cy.dataCy('asset-dialog-cancel-delete', { timeout: 10000 }).click({
- force: true,
- });
- }
-
- public static saveToAddAssets() {
- cy.dataCy('save-data-view-btn', { timeout: 10000 }).click({
- force: true,
- });
}
public static saveDashboardConfiguration() {
@@ -273,6 +264,18 @@ export class DataExplorerUtils {
return cy.dataCy('empty-dashboard');
}
+ public static addChartsToAsset(assetNameList = []) {
+ DataExplorerBtns.saveChartsToAssetBtn();
+
+ cy.dataCy('sp-show-chart-asset-checkbox').then($checkbox => {
+ if (!$checkbox.is(':checked')) {
+ cy.wrap($checkbox).click({ force: true });
+ }
+ });
+ this.addToAsset(assetNameList);
+ DataExplorerBtns.confirmAssetSelectionBtn();
+ }
+
public static addToAsset(assetNameList = []) {
cy.get('mat-tree.asset-tree', { timeout: 10000 }).should('exist');
@@ -284,12 +287,6 @@ export class DataExplorerUtils {
});
}
- public static saveAssetLinkFromChart() {
- cy.dataCy('asset-dialog-confirm-delete', { timeout: 10000 }).click({
- force: true,
- });
- }
-
public static deleteDashboard(dashboardName: string) {
GeneralUtils.openMenuForRow(dashboardName);
cy.dataCy('delete-dashboard-' + dashboardName, {
@@ -663,8 +660,9 @@ export class DataExplorerUtils {
// Create Diagram
DataExplorerUtils.addDataViewAndTableWidget('NewWidget', 'Persist');
//Save
- DataExplorerUtils.saveToAddAssets();
- DataExplorerUtils.addToAsset(assetNames);
- DataExplorerUtils.saveAssetLinkFromChart();
+ DataExplorerUtils.addChartsToAsset(assetNames);
+ DataExplorerUtils.saveDataViewConfiguration();
+ //Necessary for the background task to finish otherwise it steps back
to charts from the following task
+ cy.wait(500);
}
}
diff --git a/ui/cypress/tests/connect/editAdapter.smoke.spec.ts
b/ui/cypress/tests/connect/editAdapter.smoke.spec.ts
index 3348b683fe..a6967c768a 100644
--- a/ui/cypress/tests/connect/editAdapter.smoke.spec.ts
+++ b/ui/cypress/tests/connect/editAdapter.smoke.spec.ts
@@ -21,7 +21,7 @@ import { ConnectBtns } from
'../../support/utils/connect/ConnectBtns';
import { AdapterBuilder } from '../../support/builder/AdapterBuilder';
import { ConnectEventSchemaUtils } from
'../../support/utils/connect/ConnectEventSchemaUtils';
import { DataExplorerUtils } from
'../../support/utils/dataExplorer/DataExplorerUtils';
-import { DataLakeBtns } from
'../../support/utils/dataExplorer/DataExplorerBtns';
+import { DataExplorerBtns } from
'../../support/utils/dataExplorer/DataExplorerBtns';
describe('Test Edit Adapter', () => {
beforeEach('Setup Test', () => {
@@ -110,7 +110,7 @@ describe('Test Edit Adapter', () => {
cy.wait(3000);
- DataLakeBtns.refreshDataLakeMeasures().click();
+ DataExplorerBtns.refreshDataLakeMeasures().click();
DataExplorerUtils.waitForCountingResults();
diff --git a/ui/cypress/tests/dataExplorer/addAssetsToDataView.smoke.spec.ts
b/ui/cypress/tests/dataExplorer/addAssetsToDataView.smoke.spec.ts
index beb3d5f5c6..30b407d8b7 100644
--- a/ui/cypress/tests/dataExplorer/addAssetsToDataView.smoke.spec.ts
+++ b/ui/cypress/tests/dataExplorer/addAssetsToDataView.smoke.spec.ts
@@ -34,6 +34,8 @@ describe('Creates a new adapter with a linked asset', () => {
it('Add Assets during Chart generation', () => {
DataExplorerUtils.createDataViewWithAssets([assetName1, assetName2]);
+ AssetUtils.goToAssets();
+ AssetUtils.checkAmountOfAssets(3);
//Test
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName1, 1);
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
@@ -41,6 +43,8 @@ describe('Creates a new adapter with a linked asset', () => {
it('Edit Assets during Chart generation', () => {
DataExplorerUtils.createDataViewWithAssets([assetName1, assetName2]);
+ AssetUtils.goToAssets();
+ AssetUtils.checkAmountOfAssets(3);
//Test
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName1, 1);
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
@@ -49,11 +53,13 @@ describe('Creates a new adapter with a linked asset', () =>
{
DataExplorerUtils.goToDatalake();
DataExplorerUtils.editDataView('NewWidget');
DataExplorerUtils.renameWidget('Rename');
+ DataExplorerUtils.addChartsToAsset([assetName1, assetName3]);
+ DataExplorerUtils.saveDataViewConfiguration();
+ //Neceassary for Background Task to finish
+ cy.wait(500);
- DataExplorerUtils.saveToAddAssets();
- DataExplorerUtils.addToAsset([assetName1, assetName3]);
- DataExplorerUtils.saveAssetLinkFromChart();
-
+ AssetUtils.goToAssets();
+ AssetUtils.checkAmountOfAssets(3);
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName3, 1);
AssetUtils.checkResourceNamingByAssetName(assetName2, 'Rename');
diff --git a/ui/cypress/tests/dataExplorer/dataViewAssets.spec.ts
b/ui/cypress/tests/dataExplorer/dataViewAssets.spec.ts
deleted file mode 100644
index 8cf59a59b9..0000000000
--- a/ui/cypress/tests/dataExplorer/dataViewAssets.spec.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-/*
- * 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 { AssetUtils } from '../../support/utils/asset/AssetUtils';
-import { DataExplorerUtils } from
'../../support/utils/dataExplorer/DataExplorerUtils';
-
-describe('Creates a new adapter with a linked asset', () => {
- const assetName1 = 'TestAsset1';
- const assetName2 = 'TestAsset2';
- const assetName3 = 'TestAsset3';
-
- beforeEach('Setup Test', () => {
- cy.initStreamPipesTest();
- AssetUtils.goToAssets();
- AssetUtils.addAndSaveAsset(assetName3);
- AssetUtils.addAndSaveAsset(assetName2);
- AssetUtils.addAndSaveAsset(assetName1);
- });
-
- it('Add Assets during Chart generation', () => {
- DataExplorerUtils.createDataViewWithAssets([assetName1, assetName2]);
- //Test
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName1, 1);
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
- });
-
- it('Edit Assets during Chart generation', () => {
- DataExplorerUtils.createDataViewWithAssets([assetName1, assetName2]);
- //Test
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName1, 1);
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
-
- // Go To Chart and Edit
- DataExplorerUtils.goToDatalake();
- DataExplorerUtils.editDataView('NewWidget');
- DataExplorerUtils.renameWidget('Rename');
-
- DataExplorerUtils.saveToAddAssets();
- DataExplorerUtils.addToAsset([assetName1, assetName3]);
-
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName2, 1);
- AssetUtils.checkAmountOfLinkedResourcesByAssetName(assetName3, 1);
- AssetUtils.checkResourceNamingByAssetName(assetName2, 'Rename');
- });
-});
diff --git a/ui/cypress/tests/dataExplorer/timeOrderDataView.spec.ts
b/ui/cypress/tests/dataExplorer/timeOrderDataView.spec.ts
index a02c8a7a8f..be5995cdf0 100644
--- a/ui/cypress/tests/dataExplorer/timeOrderDataView.spec.ts
+++ b/ui/cypress/tests/dataExplorer/timeOrderDataView.spec.ts
@@ -17,7 +17,7 @@
*/
import { DataExplorerUtils } from
'../../support/utils/dataExplorer/DataExplorerUtils';
-import { DataLakeBtns } from
'../../support/utils/dataExplorer/DataExplorerBtns';
+import { DataExplorerBtns } from
'../../support/utils/dataExplorer/DataExplorerBtns';
import { DataExplorerWidget } from '../../support/model/DataExplorerWidget';
describe('Test Time Order in Data Explorer', () => {
@@ -53,7 +53,7 @@ describe('Test Time Order in Data Explorer', () => {
// Save and leave view, edit view again and check ascending order
DataExplorerUtils.saveDataViewConfiguration();
- DataLakeBtns.editDataViewButton('New chart');
+ DataExplorerBtns.editDataViewButton('New chart');
DataExplorerUtils.clickOrderBy('ascending');
DataExplorerUtils.openVisualizationConfig();
DataExplorerUtils.selectVisualizationType(DataExplorerWidget.TABLE);
diff --git a/ui/deployment/i18n/de.json b/ui/deployment/i18n/de.json
index b1e35cb7c7..441185ec7b 100644
--- a/ui/deployment/i18n/de.json
+++ b/ui/deployment/i18n/de.json
@@ -32,7 +32,7 @@
"Stop pipeline": "Pipeline stoppen",
"Name": "Name",
"Last modified": "Zuletzt geändert",
- "Show": "anzeigen",
+ "Show": "Anzeigen",
"Edit": "Bearbeiten",
"Manage permissions": "Berechtigungen verwalten",
"Delete": "Löschen",
diff --git
a/ui/src/app/connect/dialog/adapter-started/adapter-started-dialog.component.ts
b/ui/src/app/connect/dialog/adapter-started/adapter-started-dialog.component.ts
index d93ce246ee..01e28d48d0 100644
---
a/ui/src/app/connect/dialog/adapter-started/adapter-started-dialog.component.ts
+++
b/ui/src/app/connect/dialog/adapter-started/adapter-started-dialog.component.ts
@@ -298,7 +298,7 @@ export class AdapterStartedDialog implements OnInit {
await this.saveAssets(linkageData);
- this.setSuccessMessage(linkageData);
+ this.setSuccessMessage();
} catch (err) {
console.error('Error in addToAsset:', err);
}
@@ -359,33 +359,15 @@ export class AdapterStartedDialog implements OnInit {
);
}
- private setSuccessMessage(linkageData: LinkageData[]): void {
- const assetTypesList = this.formatWithAnd(
- linkageData.map(data => data.type),
- );
+ private setSuccessMessage(): void {
if (this.selectedAssets.length > 0) {
- const assetIdsList = this.formatWithAnd(
- this.selectedAssets.map(asset => asset.assetName),
- );
-
this.addToAssetText = this.translateService.instant(
- 'Your {{assetTypes}} were successfully added to {{assetIds}}.',
- {
- assetTypes: assetTypesList,
- assetIds: assetIdsList,
- },
+ 'Your Assets were successfully added.',
);
}
if (this.deselectedAssets && this.deselectedAssets.length > 0) {
- const assetIdsRemovedList = this.formatWithAnd(
- this.deselectedAssets.map(asset => asset.assetName),
- );
this.deletedFromAssetText = this.translateService.instant(
- 'Your {{assetTypes}} were successfully deleted from
{{assetIds}}.',
- {
- assetTypes: assetTypesList,
- assetIds: assetIdsRemovedList,
- },
+ 'Your Assets were successfully deleted.',
);
}
}
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 b040d32a82..09317421bc 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
@@ -36,6 +36,7 @@
(updateDateRangeEmitter)="updateDateRange($event)"
(saveDataViewEmitter)="saveDataView()"
(discardDataViewEmitter)="discardChanges()"
+ (addToAssetEmitter)="addAssetDialog()"
fxFlex="100"
>
</sp-data-explorer-data-view-toolbar>
diff --git
a/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.ts
b/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.ts
index e86cb7090f..f1328a847a 100644
---
a/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.ts
+++
b/ui/src/app/data-explorer/components/chart-view/data-explorer-chart-view.component.ts
@@ -25,8 +25,10 @@ import {
} from '@angular/core';
import {
ChartService,
+ DashboardConfig,
DataExplorerWidgetModel,
DataLakeMeasure,
+ LinkageData,
TimeSettings,
} from '@streampipes/platform-services';
import {
@@ -36,7 +38,10 @@ import {
RouterStateSnapshot,
} from '@angular/router';
import {
+ AssetSaveService,
ConfirmDialogComponent,
+ DialogService,
+ PanelType,
TimeSelectionService,
} from '@streampipes/shared-ui';
import { DataExplorerRoutingService } from
'../../../data-explorer-shared/services/data-explorer-routing.service';
@@ -70,6 +75,10 @@ export class DataExplorerChartViewComponent
drawerWidth = 450;
panelWidth = '100%';
+ selectedAssets = [];
+ deselectedAssets = [];
+ originalAssets = [];
+
resizeEchartsService = inject(ResizeEchartsService);
private dataExplorerSharedService = inject(DataExplorerSharedService);
@@ -81,6 +90,9 @@ export class DataExplorerChartViewComponent
private dataViewService = inject(ChartService);
private timeSelectionService = inject(TimeSelectionService);
private translateService = inject(TranslateService);
+ private dialogService = inject(DialogService);
+
+ private assetSaveService = inject(AssetSaveService);
observableGenerator =
this.dataExplorerSharedService.defaultObservableGenerator();
@@ -183,26 +195,48 @@ export class DataExplorerChartViewComponent
? this.dataViewService.updateChart(this.dataView)
: this.dataViewService.saveChart(this.dataView);
observable.subscribe(data => {
- const dialogRef = this.dialog.open(AssetDialogComponent, {
- width: '500px',
- data: {
- title: this.translateService.instant(
- 'Do you want to link the chart to an Asset?',
- ),
- subtitle: this.translateService.instant(
- 'Update asset links or close.',
- ),
- cancelTitle: this.translateService.instant('Close'),
- okTitle: this.translateService.instant('Update'),
- confirmAndCancel: true,
- editMode: this.editMode,
- dataInput: data,
- },
- });
+ if (
+ this.selectedAssets.length > 0 ||
+ this.deselectedAssets.length > 0 ||
+ this.originalAssets.length > 0
+ ) {
+ this.saveToAssets(data);
+ }
this.routingService.navigateToDataViewOverview(true);
});
}
+ addAssetDialog(): void {
+ const dialogRef = this.dialogService.open(AssetDialogComponent, {
+ panelType: PanelType.STANDARD_PANEL,
+ width: '500px',
+ title: this.translateService.instant(
+ 'Do you want to link the chart to an Asset?',
+ ),
+ data: {
+ subtitle: this.translateService.instant(
+ 'Update asset links or close.',
+ ),
+ cancelTitle: this.translateService.instant('Close'),
+ okTitle: this.translateService.instant('Update'),
+ confirmAndCancel: true,
+ editMode: this.editMode,
+ selectedAssets: this.selectedAssets,
+ deselectedAssets: this.deselectedAssets,
+ originalAssets: this.originalAssets,
+ dataViewId: this.route.snapshot.params.id,
+ },
+ });
+
+ dialogRef.afterClosed().subscribe(result => {
+ if (result) {
+ this.selectedAssets = result.selectedAssets;
+ this.deselectedAssets = result.deselectedAssets;
+ this.originalAssets = result.originalAssets;
+ }
+ });
+ }
+
confirmLeaveDialog(
_route: ActivatedRouteSnapshot,
_state: RouterStateSnapshot,
@@ -280,4 +314,37 @@ export class DataExplorerChartViewComponent
);
}, 100);
}
+
+ private async saveAssets(
+ linkageData: LinkageData[],
+ data: DashboardConfig,
+ ): Promise<void> {
+ await this.assetSaveService.saveSelectedAssets(
+ this.selectedAssets,
+ linkageData,
+ this.deselectedAssets,
+ this.originalAssets,
+ );
+ //this.dialogRef.close(true);
+ }
+
+ saveToAssets(data: DataExplorerWidgetModel): void {
+ let linkageData: LinkageData[];
+ try {
+ linkageData = this.createLinkageData(data);
+
+ this.saveAssets(linkageData, data);
+ } catch (err) {
+ console.error('Error in addToAsset:', err);
+ }
+ }
+ private createLinkageData(data: DataExplorerWidgetModel): LinkageData[] {
+ return [
+ {
+ type: 'chart',
+ id: data.elementId,
+ name: data.baseAppearanceConfig.widgetTitle,
+ },
+ ];
+ }
}
diff --git
a/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.html
b/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.html
index 836bc62a00..680c07a36f 100644
---
a/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.html
+++
b/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.html
@@ -67,6 +67,16 @@
<mat-icon>save</mat-icon>
{{ 'Save' | translate }}
</button>
+ <button
+ mat-flat-button
+ [matTooltip]="'Add to Asset' | translate"
+ class="edit-menu-btn"
+ (click)="addToAssetEmitter.emit()"
+ data-cy="add-to-Asset-data-view-btn"
+ >
+ <mat-icon>precision_manufacturing</mat-icon>
+ {{ 'Add To Asset' | translate }}
+ </button>
<button
mat-flat-button
[matTooltip]="'Discard' | translate"
@@ -88,6 +98,7 @@
>
<mat-icon>get_app</mat-icon>
</button>
+
<span fxFlex></span>
<div
class="data-explorer-options-item"
diff --git
a/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.ts
b/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.ts
index b89d3502c7..085271665e 100644
---
a/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.ts
+++
b/ui/src/app/data-explorer/components/chart-view/toolbar/data-explorer-chart-view-toolbar.component.ts
@@ -43,6 +43,9 @@ export class DataExplorerChartViewToolbarComponent {
@Output()
saveDataViewEmitter: EventEmitter<void> = new EventEmitter();
+ @Output()
+ addToAssetEmitter: EventEmitter<void> = new EventEmitter();
+
@Output()
discardDataViewEmitter: EventEmitter<void> = new EventEmitter();
diff --git a/ui/src/app/data-explorer/dialog/asset-dialog.component.html
b/ui/src/app/data-explorer/dialog/asset-dialog.component.html
index 4f99200ef6..901e46bbab 100644
--- a/ui/src/app/data-explorer/dialog/asset-dialog.component.html
+++ b/ui/src/app/data-explorer/dialog/asset-dialog.component.html
@@ -16,54 +16,54 @@
~
-->
-<div fxFlex="100" fxLayout="column">
- <mat-dialog-content>
- <div>
- <h4>{{ data.title }}</h4>
- <mat-checkbox
- [(ngModel)]="addToAssets"
- color="accent"
- data-cy="sp-show-chart-asset-checkbox"
- >
- Add Chart to Assets
- </mat-checkbox>
- @if (addToAssets) {
- <div class="mt-10">
- <sp-asset-link-configuration
- [isEdit]="data.editMode"
- [itemId]="data.dataInput.elementId"
- (selectedAssetsChange)="onSelectedAssetsChange($event)"
- (deselectedAssetsChange)="
- onDeselectedAssetsChange($event)
- "
- (originalAssetsEmitter)="
- onOriginalAssetsEmitted($event)
- "
- >
- </sp-asset-link-configuration>
- </div>
- }
- </div>
- </mat-dialog-content>
- <mat-dialog-actions>
- <div fxFlex="100" fxLayoutAlign="end center" class="footer">
- <button
- mat-button
- (click)="onCancel()"
- *ngIf="data.confirmAndCancel"
- data-cy="asset-dialog-cancel-delete"
- >
- {{ data.cancelTitle }}
- </button>
- <button
- mat-flat-button
- color="accent"
- (click)="saveToAssets()"
- cdkFocusInitial
- data-cy="asset-dialog-confirm-delete"
- >
- {{ data.okTitle }}
- </button>
- </div>
- </mat-dialog-actions>
+<div class="sp-dialog-container" fxLayout="column" fxLayoutGap="16px">
+ <!-- Content Section -->
+ <div class="sp-dialog-content p-15" fxLayout="column" fxLayoutGap="10px">
+ <mat-checkbox
+ [(ngModel)]="addToAssets"
+ color="accent"
+ data-cy="sp-show-chart-asset-checkbox"
+ >
+ Add Chart to Assets
+ </mat-checkbox>
+
+ @if (addToAssets) {
+ <div class="mt-10">
+ <sp-asset-link-configuration
+ [isEdit]="editMode"
+ [itemId]="dataViewId"
+ (selectedAssetsChange)="onSelectedAssetsChange($event)"
+ (deselectedAssetsChange)="onDeselectedAssetsChange($event)"
+ (originalAssetsEmitter)="onOriginalAssetsEmitted($event)"
+ ></sp-asset-link-configuration>
+ </div>
+ }
+ </div>
+
+ <!-- Divider -->
+ <mat-divider></mat-divider>
+
+ <div
+ class="sp-dialog-actions actions-align-left"
+ fxLayout="row"
+ fxLayoutAlign="end center"
+ fxLayoutGap="8px"
+ >
+ <button
+ mat-flat-button
+ color="accent"
+ (click)="onAddAsset()"
+ cdkFocusInitial
+ data-cy="asset-dialog-confirm-delete"
+ >
+ {{ okTitle }}
+ </button>
+ <button
+ mat-button
+ (click)="onCancel()"
+ data-cy="asset-dialog-cancel-delete"
+ >
+ {{ cancelTitle }}
+ </button>
+ </div>
</div>
diff --git a/ui/src/app/data-explorer/dialog/asset-dialog.component.ts
b/ui/src/app/data-explorer/dialog/asset-dialog.component.ts
index f48e41b492..11f127203f 100644
--- a/ui/src/app/data-explorer/dialog/asset-dialog.component.ts
+++ b/ui/src/app/data-explorer/dialog/asset-dialog.component.ts
@@ -16,41 +16,31 @@
*
*/
-import {
- Component,
- EventEmitter,
- inject,
- Inject,
- Input,
- Output,
-} from '@angular/core';
+import { Component, inject, Inject, Input, OnInit } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import {
- DataExplorerWidgetModel,
- LinkageData,
- SpAssetTreeNode,
-} from '@streampipes/platform-services';
-import { AssetSaveService } from '@streampipes/shared-ui';
+import { SpAssetTreeNode } from '@streampipes/platform-services';
+import { DialogRef } from '@streampipes/shared-ui';
@Component({
selector: 'sp-asset-dialog',
templateUrl: './asset-dialog.component.html',
standalone: false,
})
-export class AssetDialogComponent {
- private assetSaveService = inject(AssetSaveService);
+export class AssetDialogComponent implements OnInit {
+ @Input() selectedAssets: SpAssetTreeNode[];
+ @Input() deselectedAssets: SpAssetTreeNode[];
+ @Input() originalAssets: SpAssetTreeNode[];
+ @Input() dataViewId: string;
+ @Input() editMode: string;
+ @Input() cancelTitle: string;
+ @Input() okTitle: string;
- selectedAssets: SpAssetTreeNode[];
- deselectedAssets: SpAssetTreeNode[];
- originalAssets: SpAssetTreeNode[];
+ private dialogRef = inject<DialogRef<AssetDialogComponent>>(DialogRef);
addToAssets = false;
- constructor(
- public dialogRef: MatDialogRef<AssetDialogComponent>,
- @Inject(MAT_DIALOG_DATA) public data: any,
- ) {
- if (this.data.editMode) {
+ ngOnInit(): void {
+ if (this.editMode) {
this.addToAssets = true;
}
}
@@ -67,37 +57,15 @@ export class AssetDialogComponent {
this.originalAssets = updatedAssets;
}
- saveToAssets(): void {
- let linkageData: LinkageData[];
- try {
- linkageData = this.createLinkageData();
-
- this.saveAssets(linkageData);
- } catch (err) {
- console.error('Error in addToAsset:', err);
- }
- }
- private createLinkageData(): LinkageData[] {
- return [
- {
- type: 'chart',
- id: this.data.dataInput.elementId,
- name: this.data.dataInput.baseAppearanceConfig.widgetTitle,
- },
- ];
- }
-
- private async saveAssets(linkageData: LinkageData[]): Promise<void> {
- await this.assetSaveService.saveSelectedAssets(
- this.selectedAssets,
- linkageData,
- this.deselectedAssets,
- this.originalAssets,
- );
- this.dialogRef.close(true);
+ onCancel(): void {
+ this.dialogRef.close({});
}
- onCancel(): void {
- this.dialogRef.close();
+ onAddAsset(): void {
+ this.dialogRef.close({
+ selectedAssets: this.selectedAssets,
+ deselectedAssets: this.deselectedAssets,
+ originalAssets: this.originalAssets,
+ });
}
}
diff --git
a/ui/src/app/editor/dialog/save-pipeline/save-pipeline-settings/save-pipeline-settings.component.ts
b/ui/src/app/editor/dialog/save-pipeline/save-pipeline-settings/save-pipeline-settings.component.ts
index 59531bfa91..b8b5284f16 100644
---
a/ui/src/app/editor/dialog/save-pipeline/save-pipeline-settings/save-pipeline-settings.component.ts
+++
b/ui/src/app/editor/dialog/save-pipeline/save-pipeline-settings/save-pipeline-settings.component.ts
@@ -106,6 +106,9 @@ export class SavePipelineSettingsComponent implements
OnInit {
this.pipelineService
.convertToCompactPipeline(this.pipeline)
.subscribe(p => (this.compactPipeline = p));
+ if (this.storageOptions.updateModeActive) {
+ this.addToAssets = true;
+ }
}
onSelectedAssetsChange(updatedAssets: SpAssetTreeNode[]): void {
