From 3d2e669af8bb0c160de4bd31011606365bcfc436 Mon Sep 17 00:00:00 2001
From: Daniel Shleifman <dancheskus@gmail.com>
Date: Sun, 26 Jun 2022 14:28:40 +0300
Subject: [PATCH] refactor

---
 .../App/PWAInstallationGuide/index.jsx          | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/web/src/components/App/PWAInstallationGuide/index.jsx b/web/src/components/App/PWAInstallationGuide/index.jsx
index e709cd5..ae84217 100644
--- a/web/src/components/App/PWAInstallationGuide/index.jsx
+++ b/web/src/components/App/PWAInstallationGuide/index.jsx
@@ -7,11 +7,16 @@ import IOSShareIcon from './IOSShareIcon'
 import { StyledWrapper, StyledHeader, StyledContent } from './style'
 
 export function PWAInstallationGuide() {
-  const [isOpen, setIsOpen] = useState(!JSON.parse(localStorage.getItem('pwaNotificationIsClosed')))
+  const pwaNotificationIsClosed = JSON.parse(localStorage.getItem('pwaNotificationIsClosed'))
+  const [isOpen, setIsOpen] = useState(!pwaNotificationIsClosed)
+  const [shouldBeOpened, setShouldBeOpened] = useState(!pwaNotificationIsClosed)
+
   const { t } = useTranslation()
 
+  if (!isOpen) return null
+
   return (
-    <StyledWrapper isOpen={isOpen}>
+    <StyledWrapper isOpen={shouldBeOpened}>
       <StyledHeader>
         <img src='/apple-icon-180.png' width={50} alt='ts-icon' />
 
@@ -22,8 +27,12 @@ export function PWAInstallationGuide() {
           aria-label='close'
           color='inherit'
           onClick={() => {
-            setIsOpen(false)
-            localStorage.setItem('pwaNotificationIsClosed', true)
+            setShouldBeOpened(false)
+
+            setTimeout(() => {
+              setIsOpen(false)
+              localStorage.setItem('pwaNotificationIsClosed', true)
+            }, 300)
           }}
         >
           <CloseIcon fontSize='small' />