Merge pull request #10500 from rusikv/enhancement/pattern-support-widget-export

Pattern support for widget title on widget export

ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts

@@ -1350,9 +1350,9 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
     });
   }
 
-  exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget) {
+  exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget, widgetTitle: string) {
     $event.stopPropagation();
-    this.importExport.exportWidget(this.dashboard, this.dashboardCtx.state, layoutCtx.id, widget);
+    this.importExport.exportWidget(this.dashboard, this.dashboardCtx.state, layoutCtx.id, widget, widgetTitle);
   }
 
   widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget) {

ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.models.ts

@@ -49,7 +49,7 @@ export interface IDashboardController {
   openDashboardState(stateId: string, openRightLayout: boolean);
   addWidget($event: Event, layoutCtx: DashboardPageLayoutContext);
   editWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
-  exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
+  exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget, widgetTitle: string);
   removeWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
   widgetMouseDown($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
   widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);

ui-ngx/src/app/modules/home/components/dashboard-page/layout/dashboard-layout.component.ts

@@ -226,8 +226,8 @@ export class DashboardLayoutComponent extends PageComponent implements ILayoutCo
     this.layoutCtx.dashboardCtrl.editWidget($event, this.layoutCtx, widget);
   }
 
-  onExportWidget($event: Event, widget: Widget): void {
+  onExportWidget($event: Event, widget: Widget, widgetTitle: string): void {
-    this.layoutCtx.dashboardCtrl.exportWidget($event, this.layoutCtx, widget);
+    this.layoutCtx.dashboardCtrl.exportWidget($event, this.layoutCtx, widget, widgetTitle);
   }
 
   onRemoveWidget($event: Event, widget: Widget): void {

ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.ts

@@ -54,7 +54,7 @@ import { IAliasController, IStateController } from '@app/core/api/widget-api.mod
 import { Widget, WidgetPosition } from '@app/shared/models/widget.models';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { SafeStyle } from '@angular/platform-browser';
-import { distinct } from 'rxjs/operators';
+import { distinct, take } from 'rxjs/operators';
 import { ResizeObserver } from '@juggle/resize-observer';
 import { UtilsService } from '@core/services/utils.service';
 import { WidgetComponentAction, WidgetComponentActionType } from '@home/components/widget/widget-container.component';
@@ -436,7 +436,11 @@ export class DashboardComponent extends PageComponent implements IDashboardCompo
       $event.stopPropagation();
     }
     if (this.isExportActionEnabled && this.callbacks && this.callbacks.onExportWidget) {
-      this.callbacks.onExportWidget($event, widget.widget);
+      widget.title$.pipe(
+        take(1)
+      ).subscribe((widgetTitle) => {
+        this.callbacks.onExportWidget($event, widget.widget, widgetTitle);
+      });
     }
   }
 

ui-ngx/src/app/modules/home/models/dashboard-component.models.ts

@@ -65,7 +65,7 @@ export interface WidgetContextMenuItem extends ContextMenuItem {
 
 export interface DashboardCallbacks {
   onEditWidget?: ($event: Event, widget: Widget) => void;
-  onExportWidget?: ($event: Event, widget: Widget) => void;
+  onExportWidget?: ($event: Event, widget: Widget, widgeTitle: string) => void;
   onRemoveWidget?: ($event: Event, widget: Widget) => void;
   onWidgetMouseDown?: ($event: Event, widget: Widget) => void;
   onWidgetClicked?: ($event: Event, widget: Widget) => void;

ui-ngx/src/app/shared/import-export/import-export.service.ts

@@ -198,11 +198,12 @@ export class ImportExportService {
     );
   }
 
-  public exportWidget(dashboard: Dashboard, sourceState: string, sourceLayout: DashboardLayoutId, widget: Widget) {
+  public exportWidget(dashboard: Dashboard, sourceState: string, sourceLayout: DashboardLayoutId, widget: Widget, widgetTitle: string) {
     const widgetItem = this.itembuffer.prepareWidgetItem(dashboard, sourceState, sourceLayout, widget);
-    let name = widgetItem.widget.config.title;
+    const widgetDefaultName = this.widgetService.getWidgetInfoFromCache(widget.typeFullFqn).widgetName;
-    name = name.toLowerCase().replace(/\W/g, '_');
+    let fileName = widgetDefaultName + (isNotEmptyStr(widgetTitle) ? `_${widgetTitle}` : '');
-    this.exportToPc(this.prepareExport(widgetItem), name);
+    fileName = fileName.toLowerCase().replace(/\W/g, '_');
+    this.exportToPc(this.prepareExport(widgetItem), fileName);
   }
 
   public importWidget(dashboard: Dashboard, targetState: string,