Don't load GdprBanner unless configured

src/components/gdpr-banner.tsx

@@ -3,7 +3,7 @@ import React, { useState } from 'react';
 import { FormattedMessage } from 'react-intl';
 
 import { Banner, Button, HStack, Stack, Text } from 'soapbox/components/ui';
-import { useAppSelector, useInstance, useSoapboxConfig } from 'soapbox/hooks';
+import { useInstance, useSoapboxConfig } from 'soapbox/hooks';
 
 const acceptedGdpr = !!localStorage.getItem('soapbox:gdpr');
 
@@ -14,8 +14,7 @@ const GdprBanner: React.FC = () => {
   const [slideout, setSlideout] = useState(false);
 
   const instance = useInstance();
-  const soapbox = useSoapboxConfig();
-  const isLoggedIn = useAppSelector(state => !!state.me);
+  const { gdprUrl } = useSoapboxConfig();
 
   const handleAccept = () => {
     localStorage.setItem('soapbox:gdpr', 'true');
@@ -23,9 +22,7 @@ const GdprBanner: React.FC = () => {
     setTimeout(() => setShown(true), 200);
   };
 
-  const showBanner = soapbox.gdpr && !isLoggedIn && !shown;
-
-  if (!showBanner) {
+  if (!shown) {
     return null;
   }
 
@@ -47,8 +44,8 @@ const GdprBanner: React.FC = () => {
         </Stack>
 
         <HStack space={2} alignItems='center' className='flex-none'>
-          {soapbox.gdprUrl && (
-            <a href={soapbox.gdprUrl} tabIndex={-1} className='inline-flex'>
+          {gdprUrl && (
+            <a href={gdprUrl} tabIndex={-1} className='inline-flex'>
               <Button theme='secondary'>
                 <FormattedMessage id='gdpr.learn_more' defaultMessage='Learn more' />
               </Button>

src/init/soapbox-mount.tsx

@@ -14,6 +14,7 @@ import {
 } from 'soapbox/features/ui/util/async-components';
 import {
   useAppSelector,
+  useLoggedIn,
   useOwnAccount,
   useSoapboxConfig,
 } from 'soapbox/hooks';
@@ -27,13 +28,13 @@ const UI = React.lazy(() => import('soapbox/features/ui'));
 const SoapboxMount = () => {
   useCachedLocationHandler();
 
-  const me = useAppSelector(state => state.me);
+  const { isLoggedIn } = useLoggedIn();
   const { account } = useOwnAccount();
   const soapboxConfig = useSoapboxConfig();
 
   const needsOnboarding = useAppSelector(state => state.onboarding.needsOnboarding);
   const showOnboarding = account && needsOnboarding;
-  const { redirectRootNoLogin } = soapboxConfig;
+  const { redirectRootNoLogin, gdpr } = soapboxConfig;
 
   // @ts-ignore: I don't actually know what these should be, lol
   const shouldUpdateScroll = (prevRouterProps, { location }) => {
@@ -46,7 +47,7 @@ const SoapboxMount = () => {
         <CompatRouter>
           <ScrollContext shouldUpdateScroll={shouldUpdateScroll}>
             <Switch>
-              {(!me && redirectRootNoLogin) && (
+              {(!isLoggedIn && redirectRootNoLogin) && (
                 <Redirect exact from='/' to={redirectRootNoLogin} />
               )}
 
@@ -73,9 +74,11 @@ const SoapboxMount = () => {
                   <ModalContainer />
                 </Suspense>
 
-                <Suspense>
-                  <GdprBanner />
-                </Suspense>
+                {(gdpr && !isLoggedIn) && (
+                  <Suspense>
+                    <GdprBanner />
+                  </Suspense>
+                )}
 
                 <div id='toaster'>
                   <Toaster