Merge pull request #1431 from guardian/help-centre-remove-footer-support

hide the support cta's from the help centre footer
guardian · Dec 20, 2024 · 48a999c · 48a999c
2 parents fb1e4fe + ab9e424
commit 48a999c
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 14 deletions.
diff --git a/client/components/shared/Main.tsx b/client/components/shared/Main.tsx
@@ -75,7 +75,11 @@ export const Main = ({
 						{children}
 					</main>
 				</div>
-				{hasMinimalFooter ? <MinimalFooter /> : <Footer />}
+				{hasMinimalFooter ? (
+					<MinimalFooter />
+				) : (
+					<Footer hideSupport={!!isHelpCentrePage} />
+				)}
 			</div>
 		</HasMinimalFooterContext.Provider>
 	);

diff --git a/client/components/shared/footer/Footer.stories.tsx b/client/components/shared/footer/Footer.stories.tsx
@@ -15,4 +15,8 @@ export default {
 
 export const Default: StoryFn<typeof Footer> = () => <Footer />;
 
+export const WithoutSupport: StoryFn<typeof Footer> = () => (
+	<Footer hideSupport />
+);
+
 export const Minimal: StoryFn<typeof MinimalFooter> = () => <MinimalFooter />;
diff --git a/client/components/shared/footer/Footer.tsx b/client/components/shared/footer/Footer.tsx
@@ -171,7 +171,7 @@ const fillEmailSignup = (_: SyntheticEvent<HTMLIFrameElement>) => {
 	return;
 };
 
-export const Footer = () => {
+export const Footer = ({ hideSupport }: { hideSupport?: boolean }) => {
 	const TODAY = new Date(Date.now());
 
 	const [isInUSA, setIsInUSA] = useState<boolean>(false);
@@ -255,19 +255,21 @@ export const Footer = () => {
 									</ul>
 								))}
 
-								<div css={supportStyles}>
-									<div css={supportTitleStyles}>
-										Support the&nbsp;Guardian
+								{!hideSupport && (
+									<div css={supportStyles}>
+										<div css={supportTitleStyles}>
+											Support the&nbsp;Guardian
+										</div>
+										<div css={supportButtonContainerStyles}>
+											<SupportTheGuardianButton
+												supportReferer="footer_support_contribute"
+												alternateButtonText="Support us"
+												theme="brand"
+												size="small"
+											/>
+										</div>
 									</div>
-									<div css={supportButtonContainerStyles}>
-										<SupportTheGuardianButton
-											supportReferer="footer_support_contribute"
-											alternateButtonText="Support us"
-											theme="brand"
-											size="small"
-										/>
-									</div>
-								</div>
+								)}
 							</div>
 						</div>