diff --git a/app/client/src/comments/inlineComments/Comments.tsx b/app/client/src/comments/inlineComments/Comments.tsx
index 5533ffa719..25db2a24a7 100644
--- a/app/client/src/comments/inlineComments/Comments.tsx
+++ b/app/client/src/comments/inlineComments/Comments.tsx
@@ -6,12 +6,14 @@ import {
commentThreadsSelector,
refCommentThreadsSelector,
unpublishedCommentThreadSelector,
+ visibleCommentThreadSelector,
} from "../../selectors/commentsSelectors";
import {
getCurrentApplicationId,
getCurrentPageId,
} from "selectors/editorSelectors";
import { useLocation } from "react-router";
+import { AppState } from "reducers";
// TODO refactor application comment threads by page id to optimise
// if lists turn out to be expensive
@@ -24,11 +26,18 @@ function InlinePageCommentPin({
}) {
const commentThread = useSelector(commentThreadsSelector(commentThreadId));
const currentPageId = useSelector(getCurrentPageId);
+ const isVisibleCommentThread = useSelector(
+ (state: AppState) =>
+ visibleCommentThreadSelector(state) === commentThreadId,
+ );
if (commentThread && commentThread.pageId !== currentPageId) return null;
return (
-
+
);
}
diff --git a/app/client/src/selectors/commentsSelectors.ts b/app/client/src/selectors/commentsSelectors.ts
index 5f0d25b701..b0e67124d5 100644
--- a/app/client/src/selectors/commentsSelectors.ts
+++ b/app/client/src/selectors/commentsSelectors.ts
@@ -155,7 +155,7 @@ export const appCommentsFilter = (state: AppState) =>
export const showUnreadIndicator = (state: AppState) =>
state.ui.comments.unreadCommentThreadsCount > 0;
-export const visibleCommentThread = (state: AppState) =>
+export const visibleCommentThreadSelector = (state: AppState) =>
state.ui.comments.visibleCommentThreadId;
export const isIntroCarouselVisibleSelector = (state: AppState) =>