[PR #5027] [MERGED] fix(frontend): fix event listener memory leak in useIsDisabled hook #4870

Closed
opened 2026-02-22 18:36:42 -05:00 by yindo · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/Mintplex-Labs/anything-llm/pull/5027
Author: @dipanshurdev
Created: 2/19/2026
Status: Merged
Merged: 2/19/2026
Merged by: @timothycarambat

Base: masterHead: dev


📝 Commits (1)

  • 23a4e26 fix: optimize event listener management in useIsDisabled hook

📊 Changes

1 file changed (+7 additions, -12 deletions)

View changed files

📝 frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx (+7 -12)

📄 Description

Description

Fixes a subtle but real event listener memory leak in the useIsDisabled
hook inside PromptInput.

Problem

useIsDisabled registers two event listeners (ATTACHMENTS_PROCESSING_EVENT
and ATTACHMENTS_PROCESSED_EVENT) on window inside a useEffect. The
cleanup function in the return of the effect was calling
removeEventListener with new inline arrow functions — not the same
function references that were originally passed to addEventListener.

Since removeEventListener identifies handlers by reference equality,
passing a different function instance means the cleanup is a no-op
the original listeners are never removed.

// Before — broken cleanup (new arrow functions ≠ original handlers)
window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, () => setIsDisabled(true));
return () => {
  window.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, () => setIsDisabled(true)); // ❌
};

// After — correct cleanup
const onProcessing = () => setIsDisabled(true);
const onProcessed = () => setIsDisabled(false);

window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing);
window.addEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed);

return () => {
  window.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing); // ✅
  window.removeEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed);   // ✅
};

---

<sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
## 📋 Pull Request Information **Original PR:** https://github.com/Mintplex-Labs/anything-llm/pull/5027 **Author:** [@dipanshurdev](https://github.com/dipanshurdev) **Created:** 2/19/2026 **Status:** ✅ Merged **Merged:** 2/19/2026 **Merged by:** [@timothycarambat](https://github.com/timothycarambat) **Base:** `master` ← **Head:** `dev` --- ### 📝 Commits (1) - [`23a4e26`](https://github.com/Mintplex-Labs/anything-llm/commit/23a4e26484575edccd4825d72b1ef16693f662c9) fix: optimize event listener management in useIsDisabled hook ### 📊 Changes **1 file changed** (+7 additions, -12 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx` (+7 -12) </details> ### 📄 Description ## Description Fixes a subtle but real event listener memory leak in the [useIsDisabled](cci:1://file:///c:/Users/hp/Documents/Work/git%20forked/anything-llm/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx:348:0-375:1) hook inside [PromptInput](cci:1://file:///c:/Users/hp/Documents/Work/git%20forked/anything-llm/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx:32:0-346:1). ## Problem useIsDisabled registers two event listeners (`ATTACHMENTS_PROCESSING_EVENT` and `ATTACHMENTS_PROCESSED_EVENT`) on `window` inside a `useEffect`. The cleanup function in the `return` of the effect was calling `removeEventListener` with **new inline arrow functions** — not the same function references that were originally passed to `addEventListener`. Since `removeEventListener` identifies handlers by reference equality, passing a different function instance means the cleanup **is a no-op** — the original listeners are never removed. ```js // Before — broken cleanup (new arrow functions ≠ original handlers) window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, () => setIsDisabled(true)); return () => { window.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, () => setIsDisabled(true)); // ❌ }; // After — correct cleanup const onProcessing = () => setIsDisabled(true); const onProcessed = () => setIsDisabled(false); window.addEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing); window.addEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed); return () => { window.removeEventListener(ATTACHMENTS_PROCESSING_EVENT, onProcessing); // ✅ window.removeEventListener(ATTACHMENTS_PROCESSED_EVENT, onProcessed); // ✅ }; --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
yindo added the pull-request label 2026-02-22 18:36:42 -05:00
yindo closed this issue 2026-02-22 18:36:42 -05:00
yindo changed title from [PR #5027] fix(frontend): fix event listener memory leak in useIsDisabled hook to [PR #5027] [MERGED] fix(frontend): fix event listener memory leak in useIsDisabled hook 2026-06-05 15:20:47 -04:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: Mintplex-Labs/anything-llm#4870