From 03b678e860cd957fd5cc973b8ad9788889b82bab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Espino=20Garc=C3=ADa?= <larkox@gmail.com>
Date: Tue, 21 Jan 2025 16:33:32 +0100
Subject: [PATCH] Fix error when navigating away of threads view (#29543)

Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../advanced_text_editor/formatting_bar/hooks.tsx         | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/webapp/channels/src/components/advanced_text_editor/formatting_bar/hooks.tsx b/webapp/channels/src/components/advanced_text_editor/formatting_bar/hooks.tsx
index b1957eb957..b3388d6647 100644
--- a/webapp/channels/src/components/advanced_text_editor/formatting_bar/hooks.tsx
+++ b/webapp/channels/src/components/advanced_text_editor/formatting_bar/hooks.tsx
@@ -4,7 +4,7 @@
 import type {Instance} from '@popperjs/core';
 import debounce from 'lodash/debounce';
 import type React from 'react';
-import {useCallback, useEffect, useLayoutEffect, useState} from 'react';
+import {useEffect, useLayoutEffect, useMemo, useState} from 'react';
 
 import type {MarkdownMode} from 'utils/markdown/apply_markdown';
 
@@ -12,8 +12,8 @@ type WideMode = 'wide' | 'normal' | 'narrow' | 'min';
 
 const useResponsiveFormattingBar = (ref: React.RefObject<HTMLDivElement>): WideMode => {
     const [wideMode, setWideMode] = useState<WideMode>('wide');
-    const handleResize = useCallback(debounce(() => {
-        if (ref.current?.clientWidth === undefined) {
+    const handleResize = useMemo(() => debounce(() => {
+        if (ref.current?.clientWidth == null) {
             return;
         }
         if (ref.current.clientWidth > 640) {
@@ -29,7 +29,7 @@ const useResponsiveFormattingBar = (ref: React.RefObject<HTMLDivElement>): WideM
         if (ref.current.clientWidth < 310) {
             setWideMode('min');
         }
-    }, 10), []);
+    }, 10), [ref]);
 
     useLayoutEffect(() => {
         if (!ref.current) {