From 78a2c76c79078d3cb4d82ce28c6a3ad552f98dca Mon Sep 17 00:00:00 2001
From: jenny-s51 <jshandel@redhat.com>
Date: Tue, 2 Mar 2021 11:11:08 -0500
Subject: [PATCH] hide popover link when help enabled

---
 src/components/help-enabler/HelpHeader.tsx |  2 +-
 src/realm-roles/AssociatedRolesTab.tsx     |  9 ++-
 src/realm-roles/UsersInRoleTab.tsx         | 73 ++++++++++++----------
 3 files changed, 44 insertions(+), 40 deletions(-)

diff --git a/src/components/help-enabler/HelpHeader.tsx b/src/components/help-enabler/HelpHeader.tsx
index 9848a12db8..d42cda08a9 100644
--- a/src/components/help-enabler/HelpHeader.tsx
+++ b/src/components/help-enabler/HelpHeader.tsx
@@ -9,7 +9,7 @@ import {
   Switch,
   TextContent,
 } from "@patternfly/react-core";
-import { Trans, useTranslation } from "react-i18next";
+import { useTranslation } from "react-i18next";
 import { HelpIcon, ExternalLinkAltIcon } from "@patternfly/react-icons";
 
 import "./help-header.css";
diff --git a/src/realm-roles/AssociatedRolesTab.tsx b/src/realm-roles/AssociatedRolesTab.tsx
index 87fda3162d..39b62ee67f 100644
--- a/src/realm-roles/AssociatedRolesTab.tsx
+++ b/src/realm-roles/AssociatedRolesTab.tsx
@@ -53,11 +53,12 @@ export const AssociatedRolesTab = ({
 
   const getSubRoles = async (
     role: RoleRepresentation,
-    allRoles: RoleRepresentation[],
+    allRoles: RoleRepresentation[]
   ): Promise<RoleRepresentation[]> => {
-
     // Fetch all composite roles
-    const allCompositeRoles = await adminClient.roles.getCompositeRoles({id: role.id!});
+    const allCompositeRoles = await adminClient.roles.getCompositeRoles({
+      id: role.id!,
+    });
 
     // Need to ensure we don't get into an infinite loop, do not add any role that is already there or the starting role
     const newRoles: Promise<RoleRepresentation[]> = allCompositeRoles.reduce(
@@ -86,8 +87,6 @@ export const AssociatedRolesTab = ({
       return additionalRoles;
     }
 
-    
-
     const allRoles: Promise<RoleRepresentation[]> = additionalRoles.reduce(
       async (acc: Promise<RoleRepresentation[]>, role) => {
         const resolvedRoles = await acc;
diff --git a/src/realm-roles/UsersInRoleTab.tsx b/src/realm-roles/UsersInRoleTab.tsx
index 43b2a82b28..4a88611b33 100644
--- a/src/realm-roles/UsersInRoleTab.tsx
+++ b/src/realm-roles/UsersInRoleTab.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useContext } from "react";
 import { useHistory, useParams } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { Button, PageSection, Popover } from "@patternfly/react-core";
@@ -8,6 +8,7 @@ import { boolFormatter, emptyFormatter } from "../util";
 import { useAdminClient } from "../context/auth/AdminClient";
 import { QuestionCircleIcon } from "@patternfly/react-icons";
 import { useRealm } from "../context/realm-context/RealmContext";
+import { HelpContext } from "../components/help-enabler/HelpHeader";
 
 export const UsersInRoleTab = () => {
   const history = useHistory();
@@ -29,6 +30,8 @@ export const UsersInRoleTab = () => {
     return usersWithRole;
   };
 
+  const { enabled } = useContext(HelpContext);
+
   return (
     <>
       <PageSection data-testid="users-page" variant="light">
@@ -38,40 +41,42 @@ export const UsersInRoleTab = () => {
           ariaLabelKey="roles:roleList"
           searchPlaceholderKey=""
           toolbarItem={
-            <Popover
-              aria-label="Basic popover"
-              position="bottom"
-              bodyContent={
-                <div>
-                  {t("roles:whoWillAppearPopoverText")}
-                  <Button
-                    className="kc-groups-link"
-                    variant="link"
-                    onClick={() => history.push(`/${realm}/groups`)}
-                  >
-                    {t("groups")}
-                  </Button>
-                  {t("or")}
-                  <Button
-                    className="kc-users-link"
-                    variant="link"
-                    onClick={() => history.push(`/${realm}/users`)}
-                  >
-                    {t("users")}.
-                  </Button>
-                </div>
-              }
-              footerContent={t("roles:whoWillAppearPopoverFooterText")}
-            >
-              <Button
-                variant="link"
-                className="kc-who-will-appear-button"
-                key="who-will-appear-button"
-                icon={<QuestionCircleIcon />}
+            enabled && (
+              <Popover
+                aria-label="Basic popover"
+                position="bottom"
+                bodyContent={
+                  <div>
+                    {t("roles:whoWillAppearPopoverText")}
+                    <Button
+                      className="kc-groups-link"
+                      variant="link"
+                      onClick={() => history.push(`/${realm}/groups`)}
+                    >
+                      {t("groups")}
+                    </Button>
+                    {t("or")}
+                    <Button
+                      className="kc-users-link"
+                      variant="link"
+                      onClick={() => history.push(`/${realm}/users`)}
+                    >
+                      {t("users")}.
+                    </Button>
+                  </div>
+                }
+                footerContent={t("roles:whoWillAppearPopoverFooterText")}
               >
-                {t("roles:whoWillAppearLinkText")}
-              </Button>
-            </Popover>
+                <Button
+                  variant="link"
+                  className="kc-who-will-appear-button"
+                  key="who-will-appear-button"
+                  icon={<QuestionCircleIcon />}
+                >
+                  {t("roles:whoWillAppearLinkText")}
+                </Button>
+              </Popover>
+            )
           }
           emptyState={
             <ListEmptyState