From 8af2e562f8f5fd384731612ed6861e956937d03f Mon Sep 17 00:00:00 2001
From: lirazyehezkel <61656597+lirazyehezkel@users.noreply.github.com>
Date: Wed, 3 Nov 2021 15:34:54 +0200
Subject: [PATCH] Do not show play icon when disconnected (#428)

---
 ui/src/components/TrafficPage.tsx        | 6 ++----
 ui/src/components/style/TrafficPage.sass | 5 -----
 2 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/ui/src/components/TrafficPage.tsx b/ui/src/components/TrafficPage.tsx
index 262c13e00..f1e3be2b1 100644
--- a/ui/src/components/TrafficPage.tsx
+++ b/ui/src/components/TrafficPage.tsx
@@ -176,10 +176,8 @@ export const TrafficPage: React.FC<TrafficPageProps> = ({setAnalyzeStatus, onTLS
     return (
         <div className="TrafficPage">
             <div className="TrafficPageHeader">
-                <img className="playPauseIcon" style={{visibility: connection === ConnectionStatus.Connected ? "visible" : "hidden"}} alt="pause"
-                    src={pauseIcon} onClick={toggleConnection}/>
-                <img className="playPauseIcon" style={{position: "absolute", visibility: connection === ConnectionStatus.Connected ? "hidden" : "visible"}} alt="play"
-                     src={playIcon} onClick={toggleConnection}/>
+                {connection !== ConnectionStatus.Closed && <img style={{cursor: "pointer", marginRight: 15, height: 30}} alt="pause"
+                     src={connection === ConnectionStatus.Connected ? pauseIcon : playIcon} onClick={toggleConnection}/>}
                 <div className="connectionText">
                     {getConnectionTitle()}
                     <div className={"indicatorContainer " + getConnectionStatusClass(true)}>
diff --git a/ui/src/components/style/TrafficPage.sass b/ui/src/components/style/TrafficPage.sass
index 3a3c558f5..ceeefe128 100644
--- a/ui/src/components/style/TrafficPage.sass
+++ b/ui/src/components/style/TrafficPage.sass
@@ -110,8 +110,3 @@
     align-items: center
     height: 17px
     font-size: 16px
-
-.playPauseIcon
-    cursor: pointer
-    margin-right: 15px
-    height: 30px
\ No newline at end of file