From 3c749f28343fbc8a16b0e12bb988aab9b9fc6ccf Mon Sep 17 00:00:00 2001
From: sanjeevani vishaka <sanjeevani.vishaka@gmail.com>
Date: Wed, 5 Feb 2020 12:48:46 -0800
Subject: [PATCH 1/3] multiple popovers fix

---
 .../pop-over-search/pop-over-search.tsx       | 48 ++++++++++++++-----
 1 file changed, 36 insertions(+), 12 deletions(-)

diff --git a/src/components/pop-over-search/pop-over-search.tsx b/src/components/pop-over-search/pop-over-search.tsx
index 66e380e683..7886ec046f 100644
--- a/src/components/pop-over-search/pop-over-search.tsx
+++ b/src/components/pop-over-search/pop-over-search.tsx
@@ -1,5 +1,5 @@
-import React, { useState } from 'react';
-import { Popover, Input, Checkbox, Icon} from 'antd';
+import React, {useState, useRef, useEffect} from 'react';
+import {Popover, Input, Checkbox, Icon} from 'antd';
 import styles from './pop-over-search.module.scss';
 import axios from "axios";
 
@@ -16,9 +16,13 @@ const PopOverSearch: React.FC<Props> = (props) => {
   const [options, setOptions] = useState<any[]>([]);
   const [checkedValues, setCheckedValues] = useState<any[]>([]);
   const [popOverVisibility, setPopOverVisibilty] = useState(false);
+  const [open, setOpen] = useState(true);
+
+  const popOverRef = useRef<HTMLDivElement>(null);
+  const checkRef = useRef<HTMLDivElement>(null);
 
   const getFacetValues = async (param) => {
-    if(param.target.value.length >= 2 && param.target.value.toLowerCase()){
+    if (param.target.value.length >= 2 && param.target.value.toLowerCase()) {
       try {
         const response = await axios({
           method: 'POST',
@@ -51,34 +55,54 @@ const PopOverSearch: React.FC<Props> = (props) => {
     props.checkFacetValues(checkedValues);
   }
 
-  const searchPopover = () => {
+  /*const searchPopover = () => {
     setPopOverVisibilty(true);
-  }
+  }*/
 
-  const closePopover = () => {
+  /*const closePopover = () => {
     setPopOverVisibilty(false);
   }
+*/
+  const handleClick = e => {
+    if (popOverRef.current && popOverRef.current.contains(e.target)) {
+      console.log(popOverRef);
+      setPopOverVisibilty(true);
+    }
+    if (checkRef.current && checkRef.current.contains(e.target)) {
+      console.log(checkRef);
+      setPopOverVisibilty(false);
+    }
+    // outside click
+    setPopOverVisibilty(false);
+  };
+
+
+  useEffect(() => {
+    document.addEventListener("mousedown", handleClick);
+    return () => {
+      document.removeEventListener("mousedown", handleClick);
+    };
+  }, []);
+
 
   const content = (
     <div className={styles.popover}>
       <Input placeholder="Search" allowClear={true} onChange={getFacetValues}/>
-      <div className={styles.scrollOptions}>
+      <div className={styles.scrollOptions} ref={popOverRef}>
         <Checkbox.Group options={options} onChange={onSelectCheckboxes}></Checkbox.Group>
       </div>
       <hr/>
-      <div className={styles.checkIcon}>
+      <div className={styles.checkIcon} ref={checkRef}>
         <Icon type="check-square-o" className={styles.popoverIcons} onClick={addFacetValues}/>
-        <Icon type="close-square-o" className={styles.popoverIcons} onClick={closePopover}/>
       </div>
     </div>
   )
 
   return (
-    <Popover placement="leftTop" content={content} trigger="click" visible={popOverVisibility}>
-      <div className={styles.search} onClick={searchPopover}>Search</div>
+    <Popover placement="leftTop" content={content} trigger="click">
+      <div className={styles.search}>Search</div>
     </Popover>
   )
-
 }
 
 export default PopOverSearch;

From b25ef866da49acdf3533e122b577e6fcd9703c92 Mon Sep 17 00:00:00 2001
From: sanjeevani vishaka <sanjeevani.vishaka@gmail.com>
Date: Wed, 5 Feb 2020 14:14:41 -0800
Subject: [PATCH 2/3] multipopover fix

---
 .../pop-over-search/pop-over-search.tsx       | 47 ++++++-------------
 1 file changed, 14 insertions(+), 33 deletions(-)

diff --git a/src/components/pop-over-search/pop-over-search.tsx b/src/components/pop-over-search/pop-over-search.tsx
index 7886ec046f..9f9c9a42b1 100644
--- a/src/components/pop-over-search/pop-over-search.tsx
+++ b/src/components/pop-over-search/pop-over-search.tsx
@@ -1,4 +1,4 @@
-import React, {useState, useRef, useEffect} from 'react';
+import React, { useState } from 'react';
 import {Popover, Input, Checkbox, Icon} from 'antd';
 import styles from './pop-over-search.module.scss';
 import axios from "axios";
@@ -16,10 +16,6 @@ const PopOverSearch: React.FC<Props> = (props) => {
   const [options, setOptions] = useState<any[]>([]);
   const [checkedValues, setCheckedValues] = useState<any[]>([]);
   const [popOverVisibility, setPopOverVisibilty] = useState(false);
-  const [open, setOpen] = useState(true);
-
-  const popOverRef = useRef<HTMLDivElement>(null);
-  const checkRef = useRef<HTMLDivElement>(null);
 
   const getFacetValues = async (param) => {
     if (param.target.value.length >= 2 && param.target.value.toLowerCase()) {
@@ -53,53 +49,38 @@ const PopOverSearch: React.FC<Props> = (props) => {
 
   const addFacetValues = () => {
     props.checkFacetValues(checkedValues);
+    setPopOverVisibilty(false);
   }
 
-  /*const searchPopover = () => {
+  const searchPopover = () => {
     setPopOverVisibilty(true);
-  }*/
-
-  /*const closePopover = () => {
-    setPopOverVisibilty(false);
   }
-*/
-  const handleClick = e => {
-    if (popOverRef.current && popOverRef.current.contains(e.target)) {
-      console.log(popOverRef);
-      setPopOverVisibilty(true);
-    }
-    if (checkRef.current && checkRef.current.contains(e.target)) {
-      console.log(checkRef);
-      setPopOverVisibilty(false);
-    }
-    // outside click
-    setPopOverVisibilty(false);
-  };
 
-
-  useEffect(() => {
-    document.addEventListener("mousedown", handleClick);
-    return () => {
-      document.removeEventListener("mousedown", handleClick);
-    };
-  }, []);
+  const handleChange = (visible) => {
+    setPopOverVisibilty(visible);
+  }
 
 
   const content = (
     <div className={styles.popover}>
       <Input placeholder="Search" allowClear={true} onChange={getFacetValues}/>
-      <div className={styles.scrollOptions} ref={popOverRef}>
+      <div className={styles.scrollOptions}>
         <Checkbox.Group options={options} onChange={onSelectCheckboxes}></Checkbox.Group>
       </div>
       <hr/>
-      <div className={styles.checkIcon} ref={checkRef}>
+      <div className={styles.checkIcon}>
         <Icon type="check-square-o" className={styles.popoverIcons} onClick={addFacetValues}/>
       </div>
     </div>
   )
 
   return (
-    <Popover placement="leftTop" content={content} trigger="click">
+    <Popover
+      placement="leftTop"
+      content={content}
+      trigger="click"
+      onVisibleChange={handleChange}
+      visible={popOverVisibility}>
       <div className={styles.search}>Search</div>
     </Popover>
   )

From 9fa1097cad2bfc03ea7d73f2232c242234f3bb15 Mon Sep 17 00:00:00 2001
From: sanjeevani vishaka <sanjeevani.vishaka@gmail.com>
Date: Wed, 5 Feb 2020 14:36:57 -0800
Subject: [PATCH 3/3] removed vertical scroll for table

---
 src/components/result-table/result-table.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/result-table/result-table.tsx b/src/components/result-table/result-table.tsx
index 4231f6fd1b..bf3a37393e 100644
--- a/src/components/result-table/result-table.tsx
+++ b/src/components/result-table/result-table.tsx
@@ -533,7 +533,7 @@ const ResultTable: React.FC<Props> = (props) => {
             pagination={false}
             expandedRowRender={expandedRowRender}
             expandIcon={expandIcon}
-            scroll={{y:3/4*(window.innerHeight)}}
+            //scroll={{y:3/4*(window.innerHeight)}}
             data-cy="search-tabular"
           />
         </div>