Fix primefaces#4816: TreeTable onValueChange

melloware · Aug 23, 2023 · deb5832 · deb5832
1 parent dbaf012
commit deb5832
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 7 deletions.
diff --git a/components/lib/treetable/TreeTable.js b/components/lib/treetable/TreeTable.js
@@ -93,6 +93,10 @@ export const TreeTable = React.forwardRef((inProps, ref) => {
             setFirstState(event.first);
             setRowsState(event.rows);
         }
+
+        if (props.onValueChange) {
+            props.onValueChange(processedData());
+        }
     };
 
     const onSort = (event) => {
@@ -152,6 +156,16 @@ export const TreeTable = React.forwardRef((inProps, ref) => {
             setSortOrderState(eventMeta.sortOrder);
             setMultiSortMetaState(eventMeta.multiSortMeta);
         }
+
+        if (props.onValueChange) {
+            props.onValueChange(
+                processedData({
+                    sortField,
+                    sortOrder,
+                    multiSortMeta
+                })
+            );
+        }
     };
 
     const getCalculatedSortOrder = (currentOrder) => {
@@ -297,6 +311,10 @@ export const TreeTable = React.forwardRef((inProps, ref) => {
             setFirstState(0);
             setFiltersState(newFilters);
         }
+
+        if (props.onValueChange) {
+            props.onValueChange(processedData({ filters }));
+        }
     };
 
     const hasFilter = () => {
@@ -820,14 +838,14 @@ export const TreeTable = React.forwardRef((inProps, ref) => {
         return node.leaf === false ? false : !(node.children && node.children.length);
     };
 
-    const processData = () => {
+    const processedData = (localState) => {
         let data = props.value || [];
 
         if (!props.lazy) {
             if (data && data.length) {
-                const filters = getFilters();
-                const sortField = getSortField();
-                const multiSortMeta = getMultiSortMeta();
+                const filters = (localState && localState.filters) || getFilters();
+                const sortField = (localState && localState.sortField) || getSortField();
+                const multiSortMeta = (localState && localState.multiSortMeta) || getMultiSortMeta();
 
                 if (ObjectUtils.isNotEmpty(filters) || props.globalFilter) {
                     data = filterLocal(data, filters);
@@ -1054,7 +1072,7 @@ export const TreeTable = React.forwardRef((inProps, ref) => {
         return null;
     };
 
-    const data = processData();
+    const data = processedData();
 
     const table = createTable(data);
     const totalRecords = getTotalRecords(data);

diff --git a/components/lib/treetable/TreeTableBase.js b/components/lib/treetable/TreeTableBase.js
@@ -262,6 +262,7 @@ export const TreeTableBase = ComponentBase.extend({
         onSort: null,
         onToggle: null,
         onUnselect: null,
+        onValueChange: null,
         pageLinkSize: 5,
         paginator: false,
         paginatorClassName: null,

diff --git a/components/lib/treetable/treetable.d.ts b/components/lib/treetable/treetable.d.ts
@@ -8,12 +8,12 @@
  *
  */
 import * as React from 'react';
+import { CSSProperties } from 'react';
 import { ColumnProps } from '../column';
+import { InputTextPassThroughOptions } from '../inputtext/inputtext';
 import { PaginatorPassThroughOptions, PaginatorTemplate } from '../paginator';
 import { TreeNode } from '../treenode';
 import { IconType, PassThroughType } from '../utils/utils';
-import { InputTextPassThroughOptions } from '../inputtext/inputtext';
-import { CSSProperties } from 'react';
 
 export declare type TreeTablePassThroughType<T> = PassThroughType<T, TreeTablePassThroughMethodOptions>;
 
@@ -940,6 +940,11 @@ export interface TreeTableProps extends Omit<React.DetailedHTMLProps<React.Input
      * @param {TreeTableEvent} event - Custom treetable event.
      */
     onUnselect?(event: TreeTableEvent): void;
+    /**
+     * Callback to invoke after filtering and sorting to pass the rendered value.
+     * @param {TreeNode[] | undefined} value - Value displayed by the table.
+     */
+    onValueChange?(value: TreeNode[] | undefined): void;
     /**
      * Function that takes the row data and returns an object in &#123;'styleclass' : condition&#125; format to define a classname for a particular now.
      * @param {TreeNode} data - Value displayed by the treetable.