From 58b33942a420ba86663f7b2ae3c45698b32ae944 Mon Sep 17 00:00:00 2001
From: Martavis Parker <47053705+martavis@users.noreply.github.com>
Date: Wed, 27 Oct 2021 15:38:34 -0700
Subject: [PATCH] Homepage - Hiding policy if neither passing or failing
 (#2708)

* not display policy if neither passing nor failing

* removed log
---
 .../cards/WelcomeHost/WelcomeHost.tsx         | 53 ++++++++++++-------
 1 file changed, 33 insertions(+), 20 deletions(-)

diff --git a/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx b/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx
index e4f7f7affb..99535b238a 100644
--- a/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx
+++ b/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx
@@ -33,6 +33,7 @@ const WelcomeHost = (): JSX.Element => {
   const [refetchStartTime, setRefetchStartTime] = useState<number | null>(null);
   const [currentPolicyShown, setCurrentPolicyShown] = useState<IHostPolicy>();
   const [showPolicyModal, setShowPolicyModal] = useState<boolean>(false);
+  const [isPoliciesEmpty, setIsPoliciesEmpty] = useState<boolean>(false);
   const [
     showRefetchLoadingSpinner,
     setShowRefetchLoadingSpinner,
@@ -50,6 +51,12 @@ const WelcomeHost = (): JSX.Element => {
       select: (data: IHostResponse) => data.host,
       onSuccess: (returnedHost) => {
         setShowRefetchLoadingSpinner(returnedHost.refetch_requested);
+
+        const anyPassingOrFailingPolicy = returnedHost?.policies?.find(
+          (p) => p.response === "passing" || p.response === "failing"
+        );
+        setIsPoliciesEmpty(typeof anyPassingOrFailingPolicy === "undefined");
+
         if (returnedHost.refetch_requested) {
           // Code duplicated from HostDetailsPage. See comments there.
           if (!refetchStartTime) {
@@ -90,7 +97,7 @@ const WelcomeHost = (): JSX.Element => {
         }
       },
       onError: (error) => {
-        console.log(error);
+        console.error(error);
         dispatch(
           renderFlash("error", `Unable to load host. Please try again.`)
         );
@@ -108,7 +115,7 @@ const WelcomeHost = (): JSX.Element => {
           setTimeout(() => fullyReloadHost(), 1000);
         });
       } catch (error) {
-        console.log(error);
+        console.error(error);
         dispatch(renderFlash("error", `Host "${host.hostname}" refetch error`));
         setShowRefetchLoadingSpinner(false);
       }
@@ -164,7 +171,7 @@ const WelcomeHost = (): JSX.Element => {
     );
   }
 
-  if (host && !host.policies) {
+  if (isPoliciesEmpty) {
     return (
       <div className={baseClass}>
         <div className={`${baseClass}__error`}>
@@ -216,23 +223,29 @@ const WelcomeHost = (): JSX.Element => {
           </p>
         </div>
         <div className={`${baseClass}__policies`}>
-          {host.policies?.slice(0, 10).map((p) => (
-            <div className="policy-block">
-              <div className="info">
-                <img
-                  alt={p.response}
-                  src={p.response === "passing" ? IconPassed : IconError}
-                />
-                {p.query_name}
-              </div>
-              <Button
-                variant="text-icon"
-                onClick={() => handlePolicyModal(p.id)}
-              >
-                <img alt="" src={IconChevron} />
-              </Button>
-            </div>
-          ))}
+          {host.policies?.slice(0, 10).map((p) => {
+            if (p.response) {
+              return (
+                <div className="policy-block">
+                  <div className="info">
+                    <img
+                      alt={p.response}
+                      src={p.response === "passing" ? IconPassed : IconError}
+                    />
+                    {p.query_name}
+                  </div>
+                  <Button
+                    variant="text-icon"
+                    onClick={() => handlePolicyModal(p.id)}
+                  >
+                    <img alt="" src={IconChevron} />
+                  </Button>
+                </div>
+              );
+            }
+
+            return null;
+          })}
           {host.policies?.length > 10 && (
             <Link to={PATHS.HOST_DETAILS(host)} className="external-link">
               Go to Host details to see all checks