Merge branch 'master' of https://github.com/react-tools/react-table

src/plugin-hooks/useExpanded.js

@@ -20,7 +20,7 @@ export const useExpanded = hooks => {
 
 useExpanded.pluginName = 'useExpanded'
 
-const defaultGetResetExpandedDeps = instance => [instance.data]
+const defaultGetResetExpandedDeps = ({ data }) => [data]
 
 function useMain(instance) {
   const {
@@ -76,6 +76,10 @@ function useMain(instance) {
     }, actions.toggleExpanded)
   }
 
+  // use reference to avoid memory leak in #1608
+  const instanceRef = React.useRef()
+  instanceRef.current = instance
+
   hooks.prepareRow.push(row => {
     row.toggleExpanded = set => toggleExpandedByPath(row.path, set)
     row.getExpandedToggleProps = props => {
@@ -90,7 +94,11 @@ function useMain(instance) {
           },
           title: 'Toggle Expanded',
         },
-        applyPropHooks(instance.hooks.getExpandedToggleProps, row, instance),
+        applyPropHooks(
+          instanceRef.current.hooks.getExpandedToggleProps,
+          row,
+          instanceRef.current
+        ),
         props
       )
     }

src/plugin-hooks/useGroupBy.js

@@ -109,6 +109,10 @@ function useMain(instance) {
 
   hooks.getGroupByToggleProps = []
 
+  // use reference to avoid memory leak in #1608
+  const instanceRef = React.useRef()
+  instanceRef.current = instance
+
   flatHeaders.forEach(header => {
     const { canGroupBy } = header
     header.getGroupByToggleProps = props => {
@@ -125,7 +129,11 @@ function useMain(instance) {
           },
           title: 'Toggle GroupBy',
         },
-        applyPropHooks(instance.hooks.getGroupByToggleProps, header, instance),
+        applyPropHooks(
+          instanceRef.current.hooks.getGroupByToggleProps,
+          header,
+          instanceRef.current
+        ),
         props
       )
     }

src/plugin-hooks/useResizeColumns.js

@@ -1,4 +1,4 @@
-//
+import React from 'react'
 
 import { defaultState } from '../hooks/useTable'
 import { defaultColumn, getFirstDefined } from '../utils'
@@ -93,6 +93,10 @@ const useBeforeDimensions = instance => {
     }))
   }
 
+  // use reference to avoid memory leak in #1608
+  const instanceRef = React.useRef()
+  instanceRef.current = instance
+
   flatHeaders.forEach(header => {
     const canResize = getFirstDefined(
       header.disableResizing === true ? false : undefined,
@@ -114,7 +118,11 @@ const useBeforeDimensions = instance => {
             },
             draggable: false,
           },
-          applyPropHooks(instance.hooks.getResizerProps, header, instance),
+          applyPropHooks(
+            instanceRef.current.hooks.getResizerProps,
+            header,
+            instanceRef.current
+          ),
           userProps
         )
       }

src/plugin-hooks/useRowSelect.js

@@ -168,6 +168,10 @@ function useMain(instance) {
     }, actions.toggleRowSelected)
   }
 
+  // use reference to avoid memory leak in #1608
+  const instanceRef = React.useRef()
+  instanceRef.current = instance
+
   const getToggleAllRowsSelectedProps = props => {
     return mergeProps(
       {
@@ -180,7 +184,10 @@ function useMain(instance) {
         checked: isAllRowsSelected,
         title: 'Toggle All Rows Selected',
       },
-      applyPropHooks(instance.hooks.getToggleAllRowsSelectedProps, instance),
+      applyPropHooks(
+        instanceRef.current.hooks.getToggleAllRowsSelectedProps,
+        instanceRef.current
+      ),
       props
     )
   }
@@ -216,9 +223,9 @@ function useMain(instance) {
             title: 'Toggle Row Selected',
           },
           applyPropHooks(
-            instance.hooks.getToggleRowSelectedProps,
+            instanceRef.current.hooks.getToggleRowSelectedProps,
             row,
-            instance
+            instanceRef.current
           ),
           props
         )
@@ -246,9 +253,9 @@ function useMain(instance) {
             title: 'Toggle Row Selected',
           },
           applyPropHooks(
-            instance.hooks.getToggleRowSelectedProps,
+            instanceRef.current.hooks.getToggleRowSelectedProps,
             row,
-            instance
+            instanceRef.current
           ),
           props
         )

src/plugin-hooks/useSortBy.js

@@ -155,6 +155,10 @@ function useMain(instance) {
     }, actions.sortByChange)
   }
 
+  // use reference to avoid memory leak in #1608
+  const instanceRef = React.useRef()
+  instanceRef.current = instance
+
   // Add the getSortByToggleProps method to columns and headers
   flatHeaders.forEach(column => {
     const {
@@ -198,7 +202,7 @@ function useMain(instance) {
                 e.persist()
                 column.toggleSortBy(
                   undefined,
-                  !instance.disableMultiSort && isMultiSortEvent(e)
+                  !instanceRef.current.disableMultiSort && isMultiSortEvent(e)
                 )
               }
             : undefined,
@@ -207,7 +211,11 @@ function useMain(instance) {
           },
           title: 'Toggle SortBy',
         },
-        applyPropHooks(instance.hooks.getSortByToggleProps, column, instance),
+        applyPropHooks(
+          instanceRef.current.hooks.getSortByToggleProps,
+          column,
+          instanceRef.current
+        ),
         props
       )
     }