From f799632e22486dea3dbe4308d309c5dd6cce726a Mon Sep 17 00:00:00 2001
From: nevainero <nevainero@gmail.com>
Date: Thu, 18 Aug 2022 16:31:53 +0300
Subject: [PATCH] fix(2690): fix player watermark

---
 src/components/WaterMark/index.tsx | 27 +++++++++++----------------
 1 file changed, 11 insertions(+), 16 deletions(-)

diff --git a/src/components/WaterMark/index.tsx b/src/components/WaterMark/index.tsx
index 72e48043..1ab73fa2 100644
--- a/src/components/WaterMark/index.tsx
+++ b/src/components/WaterMark/index.tsx
@@ -4,7 +4,6 @@ import styled from 'styled-components/macro'
 type WmType = {
   leftWm: number,
   topWm: number,
-  visible: boolean,
 }
 
 export const ScWaterMark = styled.div<WmType>`
@@ -14,8 +13,6 @@ export const ScWaterMark = styled.div<WmType>`
   z-index: 1;
   opacity: 1;
   color: white;
-  visibility: ${({ visible }) => (visible ? 'visible'
-    : 'hidden')};
 `
 
 type WaterMarkProps = {
@@ -28,22 +25,20 @@ export const WaterMark = ({ value }: WaterMarkProps) => {
   const [visible, setVisible] = useState(false)
 
   useEffect(() => {
-    setInterval(() => {
+    const interval = setInterval(() => {
       setLeftWm(Math.floor(Math.random() * 95))
       setTopWm(Math.floor(Math.random() * 95))
       setVisible((v) => !v)
-    }, 1000 * 5)
+    }, 1000 * 10)
+    return () => clearInterval(interval)
   }, [])
 
-  return (
-    <>
-      <ScWaterMark
-        visible={visible}
-        topWm={topWm}
-        leftWm={leftWm}
-      >
-        {value}
-      </ScWaterMark>
-    </>
-  )
+  return visible ? (
+    <ScWaterMark
+      topWm={topWm}
+      leftWm={leftWm}
+    >
+      {value}
+    </ScWaterMark>
+  ) : null
 }