From b9ca54afadd3dc9a011a01f9098ca90317a09e1d Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Tue, 28 Jun 2022 15:33:51 +0300
Subject: [PATCH] Do not triggering computed value every time it is being used

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 src/renderer/components/update-button/update-button.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/renderer/components/update-button/update-button.tsx b/src/renderer/components/update-button/update-button.tsx
index 85f86d8193..029b58f3fe 100644
--- a/src/renderer/components/update-button/update-button.tsx
+++ b/src/renderer/components/update-button/update-button.tsx
@@ -28,12 +28,13 @@ export const NonInjectedUpdateButton = observer(({ warningLevel, update, id }: U
   const buttonId = id ?? "update-lens-button";
   const menuIconProps: IconProps = { material: "update", small: true };
   const [opened, setOpened] = useState(false);
+  const level = warningLevel.get();
 
   const toggle = () => {
     setOpened(!opened);
   };
 
-  if (!warningLevel.get()) {
+  if (!level) {
     return null;
   }
 
@@ -41,11 +42,11 @@ export const NonInjectedUpdateButton = observer(({ warningLevel, update, id }: U
     <>
       <button
         data-testid="update-button"
-        data-warning-level={warningLevel.get()}
+        data-warning-level={level}
         id={buttonId}
         className={cssNames(styles.updateButton, {
-          [styles.warningHigh]: warningLevel.get() === "high",
-          [styles.warningMedium]: warningLevel.get() === "medium",
+          [styles.warningHigh]: level === "high",
+          [styles.warningMedium]: level === "medium",
         })}
       >
         Update