From 05fb3abf2e06f5758dbbe03a0e9e526dff2b3b81 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Fri, 22 Apr 2022 11:17:09 +0200
Subject: [PATCH] change(ui) - icon changes for assist

---
 .../Assist/components/AssistActions/AssistActions.tsx |  4 ++--
 frontend/app/svg/icons/pencil-stop.svg                | 11 +++++++++++
 frontend/app/svg/icons/window-x.svg                   |  5 +++++
 3 files changed, 18 insertions(+), 2 deletions(-)
 create mode 100644 frontend/app/svg/icons/pencil-stop.svg
 create mode 100644 frontend/app/svg/icons/window-x.svg

diff --git a/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx b/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx
index 75a770b51..9584188fc 100644
--- a/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx
+++ b/frontend/app/components/Assist/components/AssistActions/AssistActions.tsx
@@ -94,7 +94,7 @@ function AssistActions({ toggleChatWindow, userId, calling, annotating, peerConn
             onClick={ toggleAnnotation }
             role="button"
           >
-            <IconButton label={`Annotate`} icon="pencil" primaryText redText={annotating} />
+            <IconButton label={`Annotate`} icon={ annotating ? "pencil-stop" : "pencil"} primaryText redText={annotating} />
           </div>
           <div className={ stl.divider } />
         </>
@@ -109,7 +109,7 @@ function AssistActions({ toggleChatWindow, userId, calling, annotating, peerConn
         onClick={ requestReleaseRemoteControl }
         role="button"
       >
-        <IconButton label={`Remote Control`} icon="remote-control" primaryText redText={remoteActive} />
+        <IconButton label={`Remote Control`} icon={ remoteActive ? "window-x" : "remote-control"} primaryText redText={remoteActive} />
       </div>
       <div className={ stl.divider } />
       
diff --git a/frontend/app/svg/icons/pencil-stop.svg b/frontend/app/svg/icons/pencil-stop.svg
new file mode 100644
index 000000000..f7c192810
--- /dev/null
+++ b/frontend/app/svg/icons/pencil-stop.svg
@@ -0,0 +1,11 @@
+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_670_5221)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.4999 -0.207153L16.2071 3.49995L5.78093 13.9261L-0.397583 16.3975L2.07382 10.219L12.4999 -0.207153ZM2.92607 10.7809L1.39747 14.6024L5.21896 13.0738L14.7928 3.49995L12.4999 1.20706L2.92607 10.7809Z" fill="black"/>
+<path d="M9 4.5C9 5.69347 8.52589 6.83807 7.68198 7.68198C6.83807 8.52589 5.69347 9 4.5 9C3.30653 9 2.16193 8.52589 1.31802 7.68198C0.474106 6.83807 0 5.69347 0 4.5C0 3.30653 0.474106 2.16193 1.31802 1.31802C2.16193 0.474106 3.30653 0 4.5 0C5.69347 0 6.83807 0.474106 7.68198 1.31802C8.52589 2.16193 9 3.30653 9 4.5V4.5ZM3.01163 2.61337C2.95881 2.56056 2.88719 2.53089 2.8125 2.53089C2.73781 2.53089 2.66619 2.56056 2.61337 2.61337C2.56056 2.66619 2.53089 2.73781 2.53089 2.8125C2.53089 2.88719 2.56056 2.95881 2.61337 3.01163L4.10231 4.5L2.61337 5.98837C2.58723 6.01452 2.56648 6.04557 2.55233 6.07973C2.53818 6.1139 2.53089 6.15052 2.53089 6.1875C2.53089 6.22448 2.53818 6.2611 2.55233 6.29527C2.56648 6.32943 2.58723 6.36048 2.61337 6.38663C2.66619 6.43944 2.73781 6.46911 2.8125 6.46911C2.84948 6.46911 2.8861 6.46182 2.92027 6.44767C2.95443 6.43352 2.98548 6.41277 3.01163 6.38663L4.5 4.89769L5.98837 6.38663C6.01452 6.41277 6.04557 6.43352 6.07973 6.44767C6.1139 6.46182 6.15052 6.46911 6.1875 6.46911C6.22448 6.46911 6.2611 6.46182 6.29527 6.44767C6.32943 6.43352 6.36048 6.41277 6.38663 6.38663C6.41277 6.36048 6.43352 6.32943 6.44767 6.29527C6.46182 6.2611 6.46911 6.22448 6.46911 6.1875C6.46911 6.15052 6.46182 6.1139 6.44767 6.07973C6.43352 6.04557 6.41277 6.01452 6.38663 5.98837L4.89769 4.5L6.38663 3.01163C6.41277 2.98548 6.43352 2.95443 6.44767 2.92027C6.46182 2.8861 6.46911 2.84948 6.46911 2.8125C6.46911 2.77552 6.46182 2.7389 6.44767 2.70473C6.43352 2.67057 6.41277 2.63952 6.38663 2.61337C6.36048 2.58723 6.32943 2.56648 6.29527 2.55233C6.2611 2.53818 6.22448 2.53089 6.1875 2.53089C6.15052 2.53089 6.1139 2.53818 6.07973 2.55233C6.04557 2.56648 6.01452 2.58723 5.98837 2.61337L4.5 4.10231L3.01163 2.61337Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_670_5221">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+</defs>
+</svg>
\ No newline at end of file
diff --git a/frontend/app/svg/icons/window-x.svg b/frontend/app/svg/icons/window-x.svg
new file mode 100644
index 000000000..facc1178f
--- /dev/null
+++ b/frontend/app/svg/icons/window-x.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="bi bi-window-x" viewBox="0 0 16 16">
+  <path d="M2.5 5a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1ZM4 5a.5.5 0 1 0 0-1 .5.5 0 0 0 0 1Zm2-.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z"/>
+  <path d="M0 4a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v4a.5.5 0 0 1-1 0V7H1v5a1 1 0 0 0 1 1h5.5a.5.5 0 0 1 0 1H2a2 2 0 0 1-2-2V4Zm1 2h13V4a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v2Z"/>
+  <path d="M16 12.5a3.5 3.5 0 1 1-7 0 3.5 3.5 0 0 1 7 0Zm-4.854-1.354a.5.5 0 0 0 0 .708l.647.646-.647.646a.5.5 0 0 0 .708.708l.646-.647.646.647a.5.5 0 0 0 .708-.708l-.647-.646.647-.646a.5.5 0 0 0-.708-.708l-.646.647-.646-.647a.5.5 0 0 0-.708 0Z"/>
+</svg>
\ No newline at end of file