From f4d3542875aaf08685b77ea33313d58c7ac3a31f Mon Sep 17 00:00:00 2001
From: nahvego <nahvergon@gmail.com>
Date: Thu, 23 Mar 2023 12:29:30 +0100
Subject: [PATCH] feat(useIdle): add `reset` capability (#2880)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
---
 packages/core/useIdle/index.md | 20 ++++++++++++++++++++
 packages/core/useIdle/index.ts | 21 +++++++++++++++------
 2 files changed, 35 insertions(+), 6 deletions(-)

diff --git a/packages/core/useIdle/index.md b/packages/core/useIdle/index.md
index 98664b04f53..a9e765846a1 100644
--- a/packages/core/useIdle/index.md
+++ b/packages/core/useIdle/index.md
@@ -16,6 +16,26 @@ const { idle, lastActive } = useIdle(5 * 60 * 1000) // 5 min
 console.log(idle.value) // true or false
 ```
 
+Programatically resetting:
+
+
+```js
+import { watch } from 'vue'
+import { useCounter, useIdle } from '@vueuse/core'
+
+const { inc, count } = useCounter()
+
+const { idle, lastActive, reset } = useIdle(5 * 60 * 1000) // 5 min
+
+watch(idle, (idleValue) => {
+  if (idleValue) {
+    inc()
+    console.log(`Triggered ${count.value} times`)
+    reset() // restarts the idle timer. Does not change lastActive value
+  }
+})
+```
+
 ## Component Usage
 
 ```html
diff --git a/packages/core/useIdle/index.ts b/packages/core/useIdle/index.ts
index a48e4aa6480..b4aa5ed2344 100644
--- a/packages/core/useIdle/index.ts
+++ b/packages/core/useIdle/index.ts
@@ -34,6 +34,7 @@ export interface UseIdleOptions extends ConfigurableWindow, ConfigurableEventFil
 export interface UseIdleReturn {
   idle: Ref<boolean>
   lastActive: Ref<number>
+  reset: () => void
 }
 
 /**
@@ -59,13 +60,17 @@ export function useIdle(
 
   let timer: any
 
+  const reset = () => {
+    idle.value = false
+    clearTimeout(timer)
+    timer = setTimeout(() => idle.value = true, timeout)
+  }
+
   const onEvent = createFilterWrapper(
     eventFilter,
     () => {
-      idle.value = false
       lastActive.value = timestamp()
-      clearTimeout(timer)
-      timer = setTimeout(() => idle.value = true, timeout)
+      reset()
     },
   )
 
@@ -80,9 +85,13 @@ export function useIdle(
           onEvent()
       })
     }
-  }
 
-  timer = setTimeout(() => idle.value = true, timeout)
+    reset()
+  }
 
-  return { idle, lastActive }
+  return {
+    idle,
+    lastActive,
+    reset,
+  }
 }