From 988ae28d422107035c0074daff10e9b469c5bb5e Mon Sep 17 00:00:00 2001
From: Tainan Felipe <tainanfelipe214@gmail.com>
Date: Mon, 28 Oct 2024 13:14:43 -0300
Subject: [PATCH] Fix: hook being used inside useEffect (#21534)

---
 .../ui/components/actions-bar/container.jsx   | 23 ++++++-----------
 .../user-notes/component.tsx                  | 25 ++++---------------
 2 files changed, 13 insertions(+), 35 deletions(-)

diff --git a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
index 54ab0409ad..5bc4ce69b2 100644
--- a/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
+++ b/bigbluebutton-html5/imports/ui/components/actions-bar/container.jsx
@@ -93,22 +93,10 @@ const ActionsBarContainer = (props) => {
   const amIPresenter = currentUserData?.presenter;
   const amIModerator = currentUserData?.isModerator;
   const [pinnedPadDataState, setPinnedPadDataState] = useState(null);
+  const { data: pinnedPadData } = useDeduplicatedSubscription(
+    PINNED_PAD_SUBSCRIPTION,
+  );
 
-  useEffect(() => {
-    const fetchData = async () => {
-      const { data: pinnedPadData } = await useDeduplicatedSubscription(
-        PINNED_PAD_SUBSCRIPTION,
-      );
-      setPinnedPadDataState(pinnedPadData || []);
-    };
-
-    fetchData();
-  }, []);
-
-  const isSharedNotesPinnedFromGraphql = !!pinnedPadDataState
-    && pinnedPadDataState.sharedNotes[0]?.sharedNotesExtId === NOTES_CONFIG.id;
-
-  const isSharedNotesPinned = isSharedNotesPinnedFromGraphql;
   const allowExternalVideo = useIsExternalVideoEnabled();
   const connected = useReactiveVar(connectionStatus.getConnectedStatusVar());
   const intl = useIntl();
@@ -131,7 +119,12 @@ const ActionsBarContainer = (props) => {
     && (deviceInfo.isPhone || isLayeredView.matches);
   if (actionsBarStyle.display === false) return null;
   if (!currentMeeting) return null;
+  if (!pinnedPadData) return null;
 
+  const isSharedNotesPinnedFromGraphql = !!pinnedPadData
+  && pinnedPadData.sharedNotes[0]?.sharedNotesExtId === NOTES_CONFIG.id;
+
+  const isSharedNotesPinned = isSharedNotesPinnedFromGraphql;
   return (
     <ActionsBar {
       ...{
diff --git a/bigbluebutton-html5/imports/ui/components/user-list/user-list-graphql/user-list-content/user-notes/component.tsx b/bigbluebutton-html5/imports/ui/components/user-list/user-list-graphql/user-list-content/user-notes/component.tsx
index ebff16f8a3..30d17a9a7b 100644
--- a/bigbluebutton-html5/imports/ui/components/user-list/user-list-graphql/user-list-content/user-notes/component.tsx
+++ b/bigbluebutton-html5/imports/ui/components/user-list/user-list-graphql/user-list-content/user-notes/component.tsx
@@ -191,30 +191,13 @@ const UserNotesGraphql: React.FC<UserNotesGraphqlProps> = (props) => {
 };
 
 const UserNotesContainerGraphql: React.FC<UserNotesContainerGraphqlProps> = (props) => {
-  type PinnedPadData = {
-    sharedNotes: Array<{
-      sharedNotesExtId: string;
-    }>;
-  };
   const { userLocks } = props;
   const disableNotes = userLocks.userNotes;
-  const [pinnedPadDataState, setPinnedPadDataState] = useState<PinnedPadData | null>(null);
-
-  useEffect(() => {
-    const fetchData = async () => {
-      const { data: pinnedPadData } = await useDeduplicatedSubscription(
-        PINNED_PAD_SUBSCRIPTION,
-      );
-      setPinnedPadDataState(pinnedPadData || []);
-    };
-
-    fetchData();
-  }, []);
-
+  const { data: pinnedPadData } = useDeduplicatedSubscription(
+    PINNED_PAD_SUBSCRIPTION,
+  );
   const NOTES_CONFIG = window.meetingClientSettings.public.notes;
 
-  const isPinned = !!pinnedPadDataState && pinnedPadDataState.sharedNotes[0]?.sharedNotesExtId === NOTES_CONFIG.id;
-
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const sidebarContent = layoutSelectInput((i: any) => i.sidebarContent);
   const { sidebarContentPanel } = sidebarContent;
@@ -226,7 +209,9 @@ const UserNotesContainerGraphql: React.FC<UserNotesContainerGraphqlProps> = (pro
   const hasUnreadNotes = useHasUnreadNotes();
   const markNotesAsRead = () => setNotesLastRev(rev);
   const isEnabled = NotesService.useIsEnabled();
+  if (!pinnedPadData) return null;
 
+  const isPinned = !!pinnedPadData && pinnedPadData?.sharedNotes[0]?.sharedNotesExtId === NOTES_CONFIG.id;
   return (
     <UserNotesGraphql
       disableNotes={disableNotes}