From 7562bf5c9588ce22c47e1bc1798f9a6a568910c5 Mon Sep 17 00:00:00 2001
From: Patrick Fic <>
Date: Tue, 12 Oct 2021 16:17:31 -0700
Subject: [PATCH] IO-1418 Allow owner re-search on import.

---
 .../owner-find-modal.component.jsx            |  1 -
 .../owner-find-modal.container.jsx            | 62 +++++++++++++------
 client/src/graphql/owners.queries.js          |  2 +-
 3 files changed, 43 insertions(+), 22 deletions(-)

diff --git a/client/src/components/owner-find-modal/owner-find-modal.component.jsx b/client/src/components/owner-find-modal/owner-find-modal.component.jsx
index 896995497..eb2a6e068 100644
--- a/client/src/components/owner-find-modal/owner-find-modal.component.jsx
+++ b/client/src/components/owner-find-modal/owner-find-modal.component.jsx
@@ -74,7 +74,6 @@ export default function OwnerFindModalComponent({
   return (
     <div>
       <Table
-        title={() => t("owners.labels.existing_owners")}
         pagination={{ position: "bottom" }}
         columns={columns}
         rowKey="id"
diff --git a/client/src/components/owner-find-modal/owner-find-modal.container.jsx b/client/src/components/owner-find-modal/owner-find-modal.container.jsx
index 284c42adf..a7ccb3635 100644
--- a/client/src/components/owner-find-modal/owner-find-modal.container.jsx
+++ b/client/src/components/owner-find-modal/owner-find-modal.container.jsx
@@ -1,6 +1,6 @@
-import { Modal } from "antd";
-import React from "react";
-import { useQuery } from "@apollo/client";
+import { Input, Modal } from "antd";
+import React, { useState, useEffect } from "react";
+import { useLazyQuery, useQuery } from "@apollo/client";
 import { useTranslation } from "react-i18next";
 import { QUERY_SEARCH_OWNER_BY_IDX } from "../../graphql/owners.queries";
 import AlertComponent from "../alert/alert.component";
@@ -17,14 +17,27 @@ export default function OwnerFindModalContainer({
 }) {
   //use owner object to run query and find what possible owners there are.
   const { t } = useTranslation();
+  const [searchText, setSearchText] = useState(null);
 
-  const ownersList = useQuery(QUERY_SEARCH_OWNER_BY_IDX, {
-    variables: {
-      search: owner ? `${owner.ownr_fn || ""} ${owner.ownr_ln || ""}` : null,
-    },
-    skip: !owner,
-    fetchPolicy: "network-only",
-  });
+  const [callSearchowners, ownersList] = useLazyQuery(
+    QUERY_SEARCH_OWNER_BY_IDX,
+    {
+      variables: {
+        search: searchText,
+      },
+    }
+  );
+
+  useEffect(() => {
+    if (modalProps.visible && owner) {
+      const s = `${owner.ownr_fn || ""} ${owner.ownr_ln || ""} ${
+        owner.ownr_co_nm || ""
+      }`;
+
+      setSearchText(s.trim());
+      callSearchowners({ variables: { search: s.trim() } });
+    }
+  }, [callSearchowners, modalProps.visible, owner]);
 
   return (
     <Modal
@@ -35,16 +48,25 @@ export default function OwnerFindModalContainer({
       {loading ? <LoadingSpinner /> : null}
       {error ? <AlertComponent message={error.message} type="error" /> : null}
       {owner ? (
-        <OwnerFindModalComponent
-          selectedOwner={selectedOwner}
-          setSelectedOwner={setSelectedOwner}
-          ownersListLoading={ownersList.loading}
-          ownersList={
-            ownersList.data && ownersList.data.search_owners
-              ? ownersList.data.search_owners
-              : null
-          }
-        />
+        <>
+          <Input.Search
+            value={searchText}
+            onChange={(e) => setSearchText(e.target.value)}
+            onSearch={(val) =>
+              callSearchowners({ variables: { search: val.trim() } })
+            }
+          />
+          <OwnerFindModalComponent
+            selectedOwner={selectedOwner}
+            setSelectedOwner={setSelectedOwner}
+            ownersListLoading={ownersList.loading}
+            ownersList={
+              ownersList.data && ownersList.data.search_owners
+                ? ownersList.data.search_owners
+                : null
+            }
+          />
+        </>
       ) : null}
     </Modal>
   );
diff --git a/client/src/graphql/owners.queries.js b/client/src/graphql/owners.queries.js
index 46df899fa..8268d20e8 100644
--- a/client/src/graphql/owners.queries.js
+++ b/client/src/graphql/owners.queries.js
@@ -2,7 +2,7 @@ import { gql } from "@apollo/client";
 
 export const QUERY_SEARCH_OWNER_BY_IDX = gql`
   query QUERY_SEARCH_OWNER_BY_IDX($search: String!) {
-    search_owners(args: { search: $search }) {
+    search_owners(args: { search: $search }, limit: 100) {
       ownr_fn
       ownr_ln
       ownr_ph1