From 180599f5d4f775e7fe924824de1ae2559177f1bc Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Sat, 15 Apr 2023 13:51:25 +0200
Subject: [PATCH] [Perf] Middle Column / Pinned: Remove spinner in background
 (#2981)

---
 src/components/middle/HeaderPinnedMessage.tsx | 14 ++++++++------
 src/components/middle/MiddleHeader.tsx        |  2 +-
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/middle/HeaderPinnedMessage.tsx b/src/components/middle/HeaderPinnedMessage.tsx
index 736f228b7..b24ebc1ce 100644
--- a/src/components/middle/HeaderPinnedMessage.tsx
+++ b/src/components/middle/HeaderPinnedMessage.tsx
@@ -105,12 +105,14 @@ const HeaderPinnedMessage: FC<OwnProps> = ({
           ariaLabel={lang('EventLogFilterPinnedMessages')}
           onClick={!shouldShowLoader ? onAllPinnedClick : undefined}
         >
-          <Spinner
-            color="blue"
-            className={buildClassName(
-              styles.loading, styles.pinListIcon, !shouldShowLoader && styles.pinListIconHidden,
-            )}
-          />
+          {isLoading && (
+            <Spinner
+              color="blue"
+              className={buildClassName(
+                styles.loading, styles.pinListIcon, !shouldShowLoader && styles.pinListIconHidden,
+              )}
+            />
+          )}
           <i
             className={buildClassName(
               'icon-pin-list', styles.pinListIcon, shouldShowLoader && styles.pinListIconHidden,
diff --git a/src/components/middle/MiddleHeader.tsx b/src/components/middle/MiddleHeader.tsx
index 61c33d3cb..d28941307 100644
--- a/src/components/middle/MiddleHeader.tsx
+++ b/src/components/middle/MiddleHeader.tsx
@@ -270,7 +270,7 @@ const MiddleHeader: FC<OwnProps & StateProps> = ({
   const {
     shouldRender: shouldRenderPinnedMessage,
     transitionClassNames: pinnedMessageClassNames,
-  } = useShowTransition(Boolean(pinnedMessage));
+  } = useShowTransition(Boolean(pinnedMessage), undefined, true);
 
   const renderingPinnedMessage = useCurrentOrPrev(pinnedMessage, true);
   const renderingPinnedMessagesCount = useCurrentOrPrev(pinnedMessagesCount, true);