feat: User Activity event (#3645)

* rename: throttle() -> debounce()

The existing function is a debounce and not
a throttle. Update name.

Signed-off-by: Nikolas Komonen <[email protected]>

* feat: User Activity event

This adds a new class which provides an event that triggers
upon user activity.

Signed-off-by: Nikolas Komonen <[email protected]>

---------

Signed-off-by: Nikolas Komonen <[email protected]>

Author: nkomonen-amazon

src/auth/ui/statusBarItem.ts

@@ -13,7 +13,7 @@ import { DevSettings } from '../../shared/settings'
 import { Auth } from '../auth'
 import { getAllConnectionsInUse, onDidChangeConnections } from '../secondaryAuth'
 import { codicon, getIcon } from '../../shared/icons'
-import { throttle } from '../../shared/utilities/functionUtils'
+import { debounce } from '../../shared/utilities/functionUtils'
 import { login } from '../utils'
 
 const statusbarPriority = 1
@@ -27,7 +27,7 @@ export async function initializeAwsCredentialsStatusBarItem(
     statusBarItem.command = login.build().asCommand({ title: 'Login' })
     statusBarItem.show()
 
-    const update = throttle(() => updateItem(statusBarItem, devSettings))
+    const update = debounce(() => updateItem(statusBarItem, devSettings))
 
     update()
     context.subscriptions.push(

src/auth/ui/vue/show.ts

@@ -36,7 +36,7 @@ import { tryAddCredentials, signout, showRegionPrompter, promptAndUseConnection,
 import { Region } from '../../../shared/regions/endpoints'
 import { CancellationError } from '../../../shared/utilities/timeoutUtils'
 import { validateSsoUrl, validateSsoUrlFormat } from '../../sso/validation'
-import { throttle } from '../../../shared/utilities/functionUtils'
+import { debounce } from '../../../shared/utilities/functionUtils'
 import { AuthError, ServiceItemId, userCancelled } from './types'
 import { awsIdSignIn } from '../../../codewhisperer/util/showSsoPrompt'
 import { connectToEnterpriseSso } from '../../../codewhisperer/util/getStartUrl'
@@ -314,12 +314,12 @@ export class AuthWebview extends VueWebview {
         ]
 
         // The event handler in the frontend refreshes all connection statuses
-        // when triggered, and multiple events can fire at the same time so we throttle.
-        const throttledFire = throttle(() => this.onDidConnectionUpdate.fire(undefined), 500)
+        // when triggered, and multiple events can fire at the same time so we debounce.
+        const debouncedFire = debounce(() => this.onDidConnectionUpdate.fire(undefined), 500)
 
         events.forEach(event =>
             event(() => {
-                throttledFire()
+                debouncedFire()
             })
         )
     }

src/awsexplorer/localExplorer.ts

@@ -6,7 +6,7 @@
 import * as vscode from 'vscode'
 import { ResourceTreeDataProvider, TreeNode } from '../shared/treeview/resourceTreeDataProvider'
 import { isCloud9 } from '../shared/extensionUtilities'
-import { throttle } from '../shared/utilities/functionUtils'
+import { debounce } from '../shared/utilities/functionUtils'
 
 export interface RootNode<T = unknown> extends TreeNode<T> {
     /**
@@ -40,7 +40,7 @@ export function createLocalExplorerView(rootNodes: RootNode[]): vscode.TreeView<
         rootNodes.forEach(node => {
             // Refreshes are delayed to guard against excessive calls to `getTreeItem` and `getChildren`
             // The 10ms delay is arbitrary. A single event loop may be good enough in many scenarios.
-            const refresh = throttle(() => treeDataProvider.refresh(node), 10)
+            const refresh = debounce(() => treeDataProvider.refresh(node), 10)
             node.onDidChangeTreeItem?.(() => refresh())
             node.onDidChangeChildren?.(() => refresh())
         })

src/shared/extensionUtilities.ts

@@ -364,3 +364,47 @@ export function getComputeRegion(): string | undefined {
 
     return computeRegion
 }
+
+/**
+ * Provides an {@link vscode.Event} that is triggered when the user interacts with the extension.
+ * This will help to be notified of user activity.
+ */
+export class ExtensionUserActivity {
+    private activityEvent = new vscode.EventEmitter<void>()
+    /** The event that is triggered when the user interacts with the extension */
+    onUserActivity = this.activityEvent.event
+
+    /** To be efficient we re-used instances that already have the same throttle delay */
+    private static instances: { [delay: number]: ExtensionUserActivity } = {}
+
+    /**
+     * @param delay The delay until a throttled user activity event is fired in milliseconds.
+     * @param activityEvents The events that trigger the user activity.
+     * @returns
+     */
+    static instance(delay: number = 500, activityEvents = ExtensionUserActivity.activityEvents): ExtensionUserActivity {
+        if (!ExtensionUserActivity.instances[delay]) {
+            const newInstance = new ExtensionUserActivity(delay, activityEvents)
+            ExtensionUserActivity.instances[delay] = newInstance
+        }
+        return ExtensionUserActivity.instances[delay]
+    }
+
+    private constructor(delay: number, private readonly activityEvents: vscode.Event<any>[]) {
+        const throttledEvent = _.throttle(() => this.activityEvent.fire(), delay, { leading: true })
+        this.activityEvents.forEach(event => event(throttledEvent))
+    }
+
+    private static activityEvents = [
+        vscode.window.onDidChangeActiveTextEditor,
+        vscode.window.onDidChangeTextEditorSelection,
+        vscode.window.onDidChangeActiveTerminal,
+        vscode.window.onDidChangeVisibleTextEditors,
+        vscode.window.onDidChangeWindowState,
+        vscode.window.onDidChangeTextEditorOptions,
+        vscode.window.onDidOpenTerminal,
+        vscode.window.onDidCloseTerminal,
+        vscode.window.onDidChangeTextEditorVisibleRanges,
+        vscode.window.onDidChangeTextEditorViewColumn,
+    ]
+}

src/shared/utilities/functionUtils.ts

@@ -79,14 +79,14 @@ export function memoize<T, U extends any[]>(fn: (...args: U) => T): (...args: U)
 
 /**
  * Prevents a function from executing until {@link delay} milliseconds have passed
- * since the last invocation. Omitting {@link delay} will throttle the function for
+ * since the last invocation. Omitting {@link delay} will not execute the function for
  * a single event loop.
  *
- * Multiple calls made during the throttle window will receive references to the
+ * Multiple calls made during the debounce window will receive references to the
  * same Promise similar to {@link shared}. The window will also be 'rolled', delaying
  * the execution by another {@link delay} milliseconds.
  */
-export function throttle<T>(cb: () => T | Promise<T>, delay: number = 0): () => Promise<T> {
+export function debounce<T>(cb: () => T | Promise<T>, delay: number = 0): () => Promise<T> {
     let timer: NodeJS.Timeout | undefined
     let promise: Promise<T> | undefined
 

src/test/shared/extensionUtilities.test.ts

@@ -11,7 +11,12 @@ import * as path from 'path'
 import * as sinon from 'sinon'
 import { DefaultEc2MetadataClient } from '../../shared/clients/ec2MetadataClient'
 import * as vscode from 'vscode'
-import { getComputeRegion, initializeComputeRegion, mostRecentVersionKey } from '../../shared/extensionUtilities'
+import {
+    ExtensionUserActivity,
+    getComputeRegion,
+    initializeComputeRegion,
+    mostRecentVersionKey,
+} from '../../shared/extensionUtilities'
 import {
     createQuickStartWebview,
     isDifferentVersion,
@@ -22,6 +27,7 @@ import * as filesystemUtilities from '../../shared/filesystemUtilities'
 import { FakeExtensionContext } from '../fakeExtensionContext'
 import { InstanceIdentity } from '../../shared/clients/ec2MetadataClient'
 import { extensionVersion } from '../../shared/vscode/env'
+import { sleep } from '../../shared/utilities/timeoutUtils'
 
 describe('extensionUtilities', function () {
     describe('safeGet', function () {
@@ -184,3 +190,51 @@ describe('initializeComputeRegion, getComputeRegion', async function () {
         await assert.rejects(metadataService.invoke('/bogus/path'))
     })
 })
+
+describe('ExtensionUserActivity', function () {
+    let count: number
+
+    function onEventTriggered() {
+        count++
+    }
+
+    before(function () {
+        count = 0
+    })
+
+    it('triggers twice when multiple user activities are fired in separate intervals', async function () {
+        // IMPORTANT: This may be flaky in CI, so we may need to increase the intervals for more tolerance
+        const throttleDelay = 200
+        const eventsFirst = [delayedFiringEvent(100), delayedFiringEvent(101), delayedFiringEvent(102)]
+        const eventsSecond = [
+            delayedFiringEvent(250),
+            delayedFiringEvent(251),
+            delayedFiringEvent(251),
+            delayedFiringEvent(252),
+        ]
+        const waitFor = 500 // some additional buffer to make sure everything triggers
+
+        const instance = ExtensionUserActivity.instance(throttleDelay, [...eventsFirst, ...eventsSecond])
+        instance.onUserActivity(onEventTriggered)
+        await sleep(waitFor)
+
+        assert.strictEqual(count, 2)
+    })
+
+    it('gives the same instance if the throttle delay is the same', function () {
+        const instance1 = ExtensionUserActivity.instance(100)
+        const instance2 = ExtensionUserActivity.instance(100)
+        const instance3 = ExtensionUserActivity.instance(200)
+        const instance4 = ExtensionUserActivity.instance(200)
+
+        assert.strictEqual(instance1, instance2)
+        assert.strictEqual(instance3, instance4)
+        assert.notStrictEqual(instance1, instance3)
+    })
+
+    function delayedFiringEvent(fireInMillis: number): vscode.Event<any> {
+        const event = new vscode.EventEmitter<void>()
+        setTimeout(() => event.fire(), fireInMillis)
+        return event.event
+    }
+})

src/test/shared/utilities/functionUtils.test.ts

@@ -4,7 +4,7 @@
  */
 
 import * as assert from 'assert'
-import { once, onceChanged, throttle } from '../../../shared/utilities/functionUtils'
+import { once, onceChanged, debounce } from '../../../shared/utilities/functionUtils'
 import { installFakeClock } from '../../testUtil'
 
 describe('functionUtils', function () {
@@ -50,13 +50,13 @@ describe('functionUtils', function () {
     })
 })
 
-describe('throttle', function () {
+describe('debounce', function () {
     let counter: number
     let fn: () => Promise<unknown>
 
     beforeEach(function () {
         counter = 0
-        fn = throttle(() => void counter++)
+        fn = debounce(() => void counter++)
     })
 
     it('prevents a function from executing more than once in the `delay` window', async function () {
@@ -86,7 +86,7 @@ describe('throttle', function () {
 
         beforeEach(function () {
             clock = installFakeClock()
-            fn = throttle(() => void counter++, 10)
+            fn = debounce(() => void counter++, 10)
         })
 
         afterEach(function () {