From 0dda9c417b22af7e2397b6d02e9d6b6c2a80bad1 Mon Sep 17 00:00:00 2001
From: KharchenkoVV <vv.harchenko@autodrilling.ru>
Date: Thu, 27 May 2021 17:55:03 +0500
Subject: [PATCH] =?UTF-8?q?CF2-7:=20=D0=9F=D0=B5=D1=80=D0=B5=D0=BC=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=BD=D0=B0=D1=8F=20=D1=81=D0=BE=20=D1=81=D1=82=D1=80?=
 =?UTF-8?q?=D0=B5=D0=BB=D0=BA=D0=B0=D0=BC=D0=B8=20=D1=83=D0=B1=D1=8B=D0=B2?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=B8=D1=8F/=D1=80=D0=BE=D1=81=D1=82=D0=B0=20?=
 =?UTF-8?q?=D1=81=D0=BE=D1=85=D1=80=D0=B0=D0=BD=D0=B5=D0=BD=D0=B0=20=D0=B2?=
 =?UTF-8?q?=20Ref?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Display.jsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/Display.jsx b/src/components/Display.jsx
index 763b634..e39a9b7 100644
--- a/src/components/Display.jsx
+++ b/src/components/Display.jsx
@@ -1,11 +1,10 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import {CaretUpOutlined, CaretDownOutlined} from '@ant-design/icons'
 
 export const ValueDisplay = ({prefix, value, suffix, isArrowVisible}) =>{
   const [oldVal, setOldVal] = useState(NaN)
   const [val, setVal] = useState('---')
-
-  let arrow = null
+  const arrowRef = useRef(null);
 
   useEffect(()=>{
     if(value)
@@ -14,16 +13,16 @@ export const ValueDisplay = ({prefix, value, suffix, isArrowVisible}) =>{
         if (isArrowVisible)
         {
           if (value > oldVal)
-            arrow = <CaretUpOutlined style={{color:"red"}} />
+            arrowRef.current = (<CaretUpOutlined style={{color:"red"}} />)
           else if (value < oldVal)
-            arrow = <CaretDownOutlined style={{color:"red"}} />
+            arrowRef.current = (<CaretDownOutlined style={{color:"red"}} />)
           setOldVal(value)
         }
       } else
       setVal(value)
   },[value])
 
-  return(<span className='display_value'>{prefix} {val} {suffix}{arrow}</span>)
+  return(<span className='display_value'>{prefix} {val} {suffix}{arrowRef.current}</span>)
 }
 
 export const Display = (props)=>{