fix #932 Wrong UI interaction between datatable SummaryPlugin and Emp…

…tyStatePlugin
DominoKit · Jul 14, 2024 · 1065c23 · 1065c23
1 parent fbcbb51
commit 1065c23
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 4 deletions.
diff --git a/domino-ui/src/main/java/org/dominokit/domino/ui/datatable/TableConfig.java b/domino-ui/src/main/java/org/dominokit/domino/ui/datatable/TableConfig.java
@@ -390,6 +390,15 @@ public List<ColumnConfig<T>> getFlattenColumns() {
         .collect(Collectors.toList());
   }
 
+  /**
+   * Retrieves only the leaf columns of the data table.
+   *
+   * @return A list of {@link ColumnConfig} representing all columns, flattened.
+   */
+  public List<ColumnConfig<T>> getLeafColumns() {
+    return columns.stream().flatMap(col -> col.leafColumns().stream()).collect(Collectors.toList());
+  }
+
   /**
    * Retrieves the columns of the DataTable as grouped.
    *

diff --git a/...-ui/src/main/java/org/dominokit/domino/ui/datatable/plugins/summary/EmptyStatePlugin.java b/...-ui/src/main/java/org/dominokit/domino/ui/datatable/plugins/summary/EmptyStatePlugin.java
@@ -19,6 +19,9 @@
 import org.dominokit.domino.ui.datatable.DataTable;
 import org.dominokit.domino.ui.datatable.events.TableDataUpdatedEvent;
 import org.dominokit.domino.ui.datatable.plugins.DataTablePlugin;
+import org.dominokit.domino.ui.elements.TDElement;
+import org.dominokit.domino.ui.elements.TFootElement;
+import org.dominokit.domino.ui.elements.TableRowElement;
 import org.dominokit.domino.ui.icons.Icon;
 import org.dominokit.domino.ui.layout.EmptyState;
 import org.dominokit.domino.ui.utils.ChildHandler;
@@ -47,6 +50,9 @@
 public class EmptyStatePlugin<T> implements DataTablePlugin<T> {
 
   private EmptyState emptyState;
+  private TableRowElement rowElement = tr();
+  private TDElement stateCell = td();
+  private TFootElement footer;
 
   /**
    * Creates and returns a new instance of {@code EmptyStatePlugin} with the provided icon and
@@ -72,18 +78,42 @@ public EmptyStatePlugin(Icon<?> emptyStateIcon, String title) {
   }
 
   @Override
-  public void onAfterAddTable(DataTable dataTable) {
+  public void init(DataTable<T> dataTable) {
+    rowElement
+        .addCss(dui_table_row)
+        .appendChild(stateCell.addCss(dui_table_cell).appendChild(emptyState));
+  }
+
+  /**
+   * Invoked when the footer is added to the DataTable.
+   *
+   * @param datatable The DataTable to which the footer is added.
+   */
+  @Override
+  public void onFooterAdded(DataTable<T> datatable) {
+    this.footer = datatable.footerElement();
+    this.footer.appendChild(rowElement);
+  }
+
+  @Override
+  public void onAfterAddTable(DataTable<T> dataTable) {
     dataTable.addTableEventListener(
         TableDataUpdatedEvent.DATA_UPDATED,
         event -> {
           TableDataUpdatedEvent tableDataUpdatedEvent = (TableDataUpdatedEvent) event;
+          long columnsCount =
+              dataTable.getTableConfig().getLeafColumns().stream()
+                  .filter(c -> !c.isHidden())
+                  .count();
+          stateCell.setAttribute("colspan", columnsCount);
+
           if (tableDataUpdatedEvent.getTotalCount() == 0) {
-            emptyState.show();
+            rowElement.show();
           } else {
-            emptyState.hide();
+            rowElement.hide();
           }
         });
-    dataTable.element().appendChild(emptyState.element());
+    this.footer.insertFirst(rowElement);
   }
 
   /**