Don't load GdprBanner unless configured

This commit is contained in:
Alex Gleason 2023-11-14 15:53:57 -06:00
parent 5c16747b0c
commit 4162808ce0
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
2 changed files with 14 additions and 14 deletions

View file

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

View file

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