From c00f308e957b2db49535514cf90d238d1fb177be Mon Sep 17 00:00:00 2001
From: streamich <streamich@gmail.com>
Date: Mon, 29 Oct 2018 15:05:16 +0100
Subject: [PATCH] =?UTF-8?q?feat:=20=F0=9F=8E=B8=20add=20useUpdate=20hook?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                           |  1 +
 docs/useUpdate.md                   | 21 +++++++++++++++++++++
 src/__stories__/useUpdate.story.tsx | 21 +++++++++++++++++++++
 src/index.ts                        |  2 ++
 src/useUpdate.ts                    |  5 +++++
 5 files changed, 50 insertions(+)
 create mode 100644 docs/useUpdate.md
 create mode 100644 src/__stories__/useUpdate.story.tsx
 create mode 100644 src/useUpdate.ts

diff --git a/README.md b/README.md
index 4647b9cdf3..7019a6a1ee 100644
--- a/README.md
+++ b/README.md
@@ -54,6 +54,7 @@
   - [`useSpring`](./docs/useSpring.md) &mdash; interpolates number over time according to spring dynamics.
   - [`useTimeout`](./docs/useTimeout.md) &mdash; returns true after a timeout.
   - [`useTween`](./docs/useTween.md) &mdash; re-renders component, while tweening a number from 0 to 1. [![][img-demo]](https://codesandbox.io/s/52990wwzyl)
+  - [`useUpdate`](./docs/useUpdate.md) &mdash; returns a callback, which re-renders component when called.
     <br/>
     <br/>
 - [**Side-effects**](./docs/Side-effects.md)
diff --git a/docs/useUpdate.md b/docs/useUpdate.md
new file mode 100644
index 0000000000..9f9549efe1
--- /dev/null
+++ b/docs/useUpdate.md
@@ -0,0 +1,21 @@
+# `useUpdate`
+
+React utility hook that returns a function that forces component
+to re-render when called.
+
+
+## Usage
+
+```jsx
+import {useUpdate} from 'react-use';
+
+const Demo = () => {
+  const update = useUpdate();
+  return (
+    <>
+      <div>Time: {Date.now()}</div>
+      <button onClick={update}>Update</button>
+    </>
+  );
+};
+```
diff --git a/src/__stories__/useUpdate.story.tsx b/src/__stories__/useUpdate.story.tsx
new file mode 100644
index 0000000000..b445f3c261
--- /dev/null
+++ b/src/__stories__/useUpdate.story.tsx
@@ -0,0 +1,21 @@
+import {storiesOf} from '@storybook/react';
+import * as React from 'react';
+import {useUpdate} from '..';
+import ShowDocs from '../util/ShowDocs';
+
+const Demo = () => {
+  const update = useUpdate();
+  return (
+    <>
+      <div>Time: {Date.now()}</div>
+      <button onClick={update}>Update</button>
+    </>
+  );
+};
+
+storiesOf('useUpdate', module)
+  .add('Docs', () => <ShowDocs md={require('../../docs/useUpdate.md')} />)
+  .add('Demo', () =>
+    <Demo/>
+  )
+
diff --git a/src/index.ts b/src/index.ts
index 8c2e1dbbb0..974acbcb25 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -31,6 +31,7 @@ import useTitle from './useTitle';
 import useToggle from './useToggle';
 import useTween from './useTween';
 import useUnmount from './useUnmount';
+import useUpdate from './useUpdate';
 import useWindowSize from './useWindowSize';
 
 export {
@@ -67,5 +68,6 @@ export {
   useToggle,
   useTween,
   useUnmount,
+  useUpdate,
   useWindowSize,
 };
diff --git a/src/useUpdate.ts b/src/useUpdate.ts
new file mode 100644
index 0000000000..cb1948cb7b
--- /dev/null
+++ b/src/useUpdate.ts
@@ -0,0 +1,5 @@
+import {useState} from './react';
+
+const useUpdate = () => useState(0)[1] as (() => void);
+
+export default useUpdate;