From f552c94972d8866c58769a6d1931bbf9416c1d68 Mon Sep 17 00:00:00 2001
From: tannerlinsley <tannerlinsley@gmail.com>
Date: Thu, 26 Sep 2019 13:21:34 -0600
Subject: [PATCH] fix(usepagination): fix unstable callbacks

Closes #1549
---
 package.json                      |  2 +-
 src/plugin-hooks/usePagination.js | 69 +++++++++++++++++--------------
 2 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/package.json b/package.json
index 4903315..fae074b 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,7 @@
     "prepare": "yarn build",
     "release": "yarn publish",
     "releaseNext": "yarn publish --tag next",
-    "format": "prettier ./src/**/*.{md,js,jsx,tsx} --write"
+    "format": "prettier {src,src/**,examples/*/src,examples/*/src/**}/*.{md,js,jsx,tsx} --write"
   },
   "files": [
     "CHANGELOG.md",
diff --git a/src/plugin-hooks/usePagination.js b/src/plugin-hooks/usePagination.js
index dc94b5c..c298b78 100755
--- a/src/plugin-hooks/usePagination.js
+++ b/src/plugin-hooks/usePagination.js
@@ -116,39 +116,48 @@ function useMain(instance) {
   const canPreviousPage = pageIndex > 0
   const canNextPage = pageCount === -1 || pageIndex < pageCount - 1
 
-  const gotoPage = pageIndex => {
-    if (process.env.NODE_ENV === 'development' && debug)
-      console.info('gotoPage')
-    return setState(old => {
-      if (pageIndex < 0 || pageIndex > pageCount - 1) {
-        return old
-      }
-      return {
-        ...old,
-        pageIndex,
-      }
-    }, actions.pageChange)
-  }
+  const gotoPage = React.useCallback(
+    updater => {
+      if (process.env.NODE_ENV === 'development' && debug)
+        console.info('gotoPage')
+      return setState(old => {
+        const newPageIndex =
+          typeof updater === 'function' ? updater(old.pageIndex) : updater
 
-  const previousPage = () => {
-    return gotoPage(pageIndex - 1)
-  }
+        if (newPageIndex < 0 || newPageIndex > pageCount - 1) {
+          return old
+        }
+        return {
+          ...old,
+          pageIndex: newPageIndex,
+        }
+      }, actions.pageChange)
+    },
+    [debug, pageCount, setState]
+  )
 
-  const nextPage = () => {
-    return gotoPage(pageIndex + 1)
-  }
+  const previousPage = React.useCallback(() => {
+    return gotoPage(old => old - 1)
+  }, [gotoPage])
 
-  const setPageSize = pageSize => {
-    setState(old => {
-      const topRowIndex = old.pageSize * old.pageIndex
-      const pageIndex = Math.floor(topRowIndex / pageSize)
-      return {
-        ...old,
-        pageIndex,
-        pageSize,
-      }
-    }, actions.pageSizeChange)
-  }
+  const nextPage = React.useCallback(() => {
+    return gotoPage(old => old + 1)
+  }, [gotoPage])
+
+  const setPageSize = React.useCallback(
+    pageSize => {
+      setState(old => {
+        const topRowIndex = old.pageSize * old.pageIndex
+        const pageIndex = Math.floor(topRowIndex / pageSize)
+        return {
+          ...old,
+          pageIndex,
+          pageSize,
+        }
+      }, actions.pageSizeChange)
+    },
+    [setState]
+  )
 
   return {
     ...instance,