Bugfix/handle super admin wrapper logged out (#5251)

* return null when isLoggedIn is false * update tests
canada-ca · Apr 22, 2024 · 4dffc26 · 4dffc26
1 parent e32b977
commit 4dffc26
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 16 deletions.
diff --git a/frontend/src/app/__tests__/withSuperAdmin.test.js b/frontend/src/app/__tests__/withSuperAdmin.test.js
@@ -6,6 +6,8 @@ import { IS_USER_SUPER_ADMIN } from '../../graphql/queries'
 import { I18nProvider } from '@lingui/react'
 import { setupI18n } from '@lingui/core'
 import { en } from 'make-plural/plurals'
+import { UserVarProvider } from '../../utilities/userState'
+import { makeVar } from '@apollo/client'
 
 // Mock component to wrap with the HOC
 const MockComponent = () => <div>Mock Component</div>
@@ -50,7 +52,9 @@ describe('withSuperAdmin', () => {
     const { findByText } = render(
       <MockedProvider mocks={[mocks[0]]} addTypename={false}>
         <I18nProvider i18n={i18n}>
-          <SuperAdminComponent />
+          <UserVarProvider userVar={makeVar({ jwt: 'jwt', tfaSendMethod: 'email', userName: 'test.user@gc.ca' })}>
+            <SuperAdminComponent />
+          </UserVarProvider>
         </I18nProvider>
       </MockedProvider>,
     )

diff --git a/frontend/src/app/withSuperAdmin.js b/frontend/src/app/withSuperAdmin.js
@@ -3,15 +3,18 @@ import { useQuery } from '@apollo/client'
 import { IS_USER_SUPER_ADMIN } from '../graphql/queries'
 import { ErrorFallbackMessage } from '../components/ErrorFallbackMessage'
 import { LoadingMessage } from '../components/LoadingMessage'
+import { useUserVar } from '../utilities/userState'
 
 const withSuperAdmin = (Component) => {
   const WrappedComponent = (props) => {
-    const { loading, error, data } = useQuery(IS_USER_SUPER_ADMIN)
+    const { isLoggedIn } = useUserVar()
+    const { loading, error, data: { isUserSuperAdmin } = {} } = useQuery(IS_USER_SUPER_ADMIN)
 
+    if (!isLoggedIn) return null
     if (loading) return <LoadingMessage />
     if (error) return <ErrorFallbackMessage error={error} />
 
-    return data.isUserSuperAdmin ? <Component {...props} /> : null
+    return isUserSuperAdmin ? <Component {...props} /> : null
   }
 
   WrappedComponent.displayName = `withSuperAdmin(${Component.displayName || Component.name})`

diff --git a/frontend/src/domains/DomainsPage.js b/frontend/src/domains/DomainsPage.js
@@ -24,7 +24,7 @@ import { ABTestVariant, ABTestWrapper } from '../app/ABTestWrapper'
 import withSuperAdmin from '../app/withSuperAdmin'
 
 export default function DomainsPage() {
-  const { hasAffiliation } = useUserVar()
+  const { hasAffiliation, isLoggedIn } = useUserVar()
   const toast = useToast()
   const [orderDirection, setOrderDirection] = useState('ASC')
   const [orderField, setOrderField] = useState('DOMAIN')
@@ -249,18 +249,20 @@ export default function DomainsPage() {
           placeholder={t`Search for a domain`}
           onToggle={onToggle}
         />
-        <Flex align="center" mb="2">
-          <Text mr="2" fontWeight="bold" fontSize="lg">
-            <Trans>Filters:</Trans>
-          </Text>
-          <AffiliationFilterSwitch isAffiliated={isAffiliated} setIsAffiliated={setIsAffiliated} />
-          <Divider orientation="vertical" borderLeftColor="gray.900" height="1.5rem" mx="1" />
-          <ABTestWrapper insiderVariantName="B">
-            <ABTestVariant name="B">
-              <FilterList filters={filters} setFilters={setFilters} />
-            </ABTestVariant>
-          </ABTestWrapper>
-        </Flex>
+        {isLoggedIn() && (
+          <Flex align="center" mb="2">
+            <Text mr="2" fontWeight="bold" fontSize="lg">
+              <Trans>Filters:</Trans>
+            </Text>
+            <AffiliationFilterSwitch isAffiliated={isAffiliated} setIsAffiliated={setIsAffiliated} />
+            <Divider orientation="vertical" borderLeftColor="gray.900" height="1.5rem" mx="1" />
+            <ABTestWrapper insiderVariantName="B">
+              <ABTestVariant name="B">
+                <FilterList filters={filters} setFilters={setFilters} />
+              </ABTestVariant>
+            </ABTestWrapper>
+          </Flex>
+        )}
 
         {domainList}