From 724e88e561cdc3bb308bfb62956c543a762ba5d0 Mon Sep 17 00:00:00 2001
From: sammanadh <51258872+sammanadh@users.noreply.github.com>
Date: Mon, 1 Aug 2022 22:17:31 +0545
Subject: [PATCH] Select account and close modal on Watch (#301)

---
 .../components/WatchAccountButton.tsx         | 28 +++++++++++++++----
 1 file changed, 22 insertions(+), 6 deletions(-)

diff --git a/src/renderer/components/WatchAccountButton.tsx b/src/renderer/components/WatchAccountButton.tsx
index 887e338a..5a23fced 100644
--- a/src/renderer/components/WatchAccountButton.tsx
+++ b/src/renderer/components/WatchAccountButton.tsx
@@ -6,11 +6,13 @@ import Form from 'react-bootstrap/Form';
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 import Popover from 'react-bootstrap/Popover';
 import { logger } from '../common/globals';
+import { setSelected } from '../data/SelectedAccountsList/selectedAccountsState';
+import { useAppDispatch } from '../hooks';
 
 function WatchAcountPopover(props: {
-  pinAccount: (pk: string, b: boolean) => void;
+  onWatch: (pk: string, b: boolean) => void;
 }) {
-  const { pinAccount } = props;
+  const { onWatch } = props;
 
   const pubKeyVal = '';
 
@@ -74,7 +76,7 @@ function WatchAcountPopover(props: {
                 type="button"
                 disabled={validationError || !toKey}
                 onClick={() => {
-                  pinAccount(toKey, false);
+                  onWatch(toKey, false);
                 }}
               >
                 Watch
@@ -91,15 +93,29 @@ function WatchAccountButton(props: {
   pinAccount: (pk: string, b: boolean) => void;
 }) {
   const { pinAccount } = props;
+  const [show, setShow] = useState(false);
+  const dispatch = useAppDispatch();
+
+  const handleWatch = (toKey, isPinned) => {
+    pinAccount(toKey, isPinned);
+    dispatch(setSelected(toKey));
+    setShow(false);
+  };
 
   return (
     <OverlayTrigger
-      trigger="click"
       placement="bottom"
-      overlay={WatchAcountPopover({ pinAccount })}
+      overlay={WatchAcountPopover({ onWatch: handleWatch })}
       rootClose
+      show={show}
     >
-      <Button variant="success" size="sm">
+      <Button
+        variant="success"
+        size="sm"
+        onClick={() => {
+          setShow((prev) => !prev);
+        }}
+      >
         Watch
       </Button>
     </OverlayTrigger>