fix: store updated widgets in dashboard announcements example (#4038)

vaadin · Dec 20, 2024 · d6771ef · d6771ef
1 parent c32afd2
commit d6771ef
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 0 deletions.
diff --git a/frontend/demo/component/dashboard/dashboard-announcements.ts b/frontend/demo/component/dashboard/dashboard-announcements.ts
@@ -89,6 +89,9 @@ export class Example extends LitElement {
     // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
     const title = widgetTitles[(e.detail.item as WidgetConfig).type];
     this.announcement = `Moved widget ${title} to position ${position} of ${total}`;
+
+    // Store updated widgets after user has modified them
+    this.widgets = e.detail.items as WidgetConfig[];
   }
 
   handleResize(e: DashboardItemResizedEvent<WidgetConfig>) {
@@ -98,13 +101,19 @@ export class Example extends LitElement {
     const title = widgetTitles[e.detail.item.type];
 
     this.announcement = `Resized widget ${title} to ${colspan} columns, ${rowspan} rows`;
+
+    // Store updated widgets after user has modified them
+    this.widgets = e.detail.items as WidgetConfig[];
   }
 
   handleRemove(e: DashboardItemRemovedEvent<WidgetConfig>) {
     // This event is fired when the user removes a widget
     const title = widgetTitles[(e.detail.item as WidgetConfig).type];
 
     this.announcement = `Removed widget ${title}`;
+
+    // Store updated widgets after user has modified them
+    this.widgets = e.detail.items as WidgetConfig[];
   }
 
   render() {

diff --git a/frontend/demo/component/dashboard/react/dashboard-announcements.tsx b/frontend/demo/component/dashboard/react/dashboard-announcements.tsx
@@ -84,6 +84,9 @@ function Example() {
     const title = widgetTitles[(e.detail.item as WidgetConfig).type];
 
     announcement.value = `Moved widget ${title} to position ${position} of ${total}`;
+
+    // Store updated widgets after user has modified them
+    widgets.value = e.detail.items as WidgetConfig[];
   }
 
   function handleResize(e: DashboardItemResizedEvent<WidgetConfig>) {
@@ -93,13 +96,19 @@ function Example() {
     const title = widgetTitles[e.detail.item.type];
 
     announcement.value = `Resized widget ${title} to ${colspan} columns, ${rowspan} rows`;
+
+    // Store updated widgets after user has modified them
+    widgets.value = e.detail.items as WidgetConfig[];
   }
 
   function handleRemove(e: DashboardItemRemovedEvent<WidgetConfig>) {
     // This event is fired when the user removes a widget
     const title = widgetTitles[(e.detail.item as WidgetConfig).type];
 
     announcement.value = `Removed widget ${title}`;
+
+    // Store updated widgets after user has modified them
+    widgets.value = e.detail.items as WidgetConfig[];
   }
 
   return (