diff --git a/src/app/components/elements/PageTitle.tsx b/src/app/components/elements/PageTitle.tsx index ee6cbefdf5..954abbcd72 100644 --- a/src/app/components/elements/PageTitle.tsx +++ b/src/app/components/elements/PageTitle.tsx @@ -1,5 +1,6 @@ import React, { ReactElement, useEffect, useRef } from "react"; -import { UncontrolledTooltip } from "reactstrap"; +import { UncontrolledTooltip, Button } from "reactstrap"; +import { Link } from "react-router-dom"; import { AUDIENCE_DISPLAY_FIELDS, filterAudienceViewsByProperties, @@ -16,6 +17,15 @@ import { Helmet } from "react-helmet"; import { Markup } from "./markup"; import { EditablePageTitle } from "./inputs/EditablePageTitle"; +declare global { + interface Window { + followedAtLeastOneSoftLink?: boolean; + } + + // eslint-disable-next-line no-var + var followedAtLeastOneSoftLink: boolean | undefined; +} + function AudienceViewer({ audienceViews }: { audienceViews: ViewingContext[] }) { const userContext = useUserContext(); const viewsWithMyStage = audienceViews.filter((vc) => vc.stage === userContext.stage); @@ -46,33 +56,68 @@ export interface PageTitleProps { subTitle?: string; disallowLaTeX?: boolean; help?: ReactElement; + boosterVideoButton?: boolean; className?: string; audienceViews?: ViewingContext[]; onTitleEdit?: (newTitle: string) => void; } + export const PageTitle = ({ currentPageTitle, subTitle, disallowLaTeX, help, + boosterVideoButton, className, audienceViews, onTitleEdit, }: PageTitleProps) => { const dispatch = useAppDispatch(); const openModal = useAppSelector((state: AppState) => Boolean(state?.activeModals?.length)); + const user = useAppSelector((state: AppState) => state?.user); const headerRef = useRef(null); useEffect(() => { dispatch(mainContentIdSlice.actions.set("main-heading")); - }, []); + }, [dispatch]); + useEffect(() => { document.title = currentPageTitle + " — Isaac " + SITE_SUBJECT_TITLE; const element = headerRef.current; - if (element && (window as any).followedAtLeastOneSoftLink && !openModal) { + if (element && globalThis.followedAtLeastOneSoftLink && !openModal) { element.focus(); } - }, [currentPageTitle]); + }, [currentPageTitle, openModal]); + + // Extract nested ternary logic + const renderHelpOrBoosterButton = () => { + if (boosterVideoButton) { + const targetPath = user?.loggedIn + ? "/pages/booster_video_binary_conversion_and_addition" + : "/login?target=/pages/booster_video_binary_conversion_and_addition"; + + return ( + + ); + } + + if (help) { + return ( + +
+ Help +
+ + {help} + +
+ ); + } + + return null; + }; return (

@@ -88,16 +133,7 @@ export const PageTitle = ({ {audienceViews && } - {help && ( - -
- Help -
- - {help} - -
- )} + {renderHelpOrBoosterButton()}

); }; diff --git a/src/app/components/pages/Events.tsx b/src/app/components/pages/Events.tsx index 086d728f16..fc970f2729 100644 --- a/src/app/components/pages/Events.tsx +++ b/src/app/components/pages/Events.tsx @@ -95,8 +95,6 @@ export const Events = withRouter(({ history, location }: RouteComponentProps) => dispatch(getEventMapData(startIndex, -1, typeFilter, statusFilter, stageFilter)); }, [dispatch, typeFilter, statusFilter, stageFilter]); - const pageHelp = Follow the links below to find out more about our FREE events.; - const metaDescriptionCS = "A level and GCSE Computer Science live online training. Revision and extension workshops for students."; @@ -104,7 +102,7 @@ export const Events = withRouter(({ history, location }: RouteComponentProps) => <>
- +
{/* Filters */} @@ -123,7 +121,7 @@ export const Events = withRouter(({ history, location }: RouteComponentProps) => query.show_reservations_only = selectedFilter === EventStatusFilter["My event reservations"] ? true : undefined; query.event_status = selectedFilter == EventStatusFilter["All events"] ? "all" : undefined; - history.push({ pathname: location.pathname, search: queryString.stringify(query as any) }); + history.push({ pathname: location.pathname, search: queryString.stringify(query as never) }); }} > {/* Tutors are considered students w.r.t. events currently, so cannot see teacher-only events */} @@ -150,7 +148,7 @@ export const Events = withRouter(({ history, location }: RouteComponentProps) => onChange={(e) => { const selectedType = e.target.value as EventTypeFilter; query.types = selectedType !== EventTypeFilter["All events"] ? selectedType : undefined; - history.push({ pathname: location.pathname, search: queryString.stringify(query as any) }); + history.push({ pathname: location.pathname, search: queryString.stringify(query as never) }); }} > {Object.entries(EventTypeFilter).map(([typeLabel, typeValue]) => ( @@ -168,7 +166,7 @@ export const Events = withRouter(({ history, location }: RouteComponentProps) => const selectedStage = e.target.value as EventStageFilter; query.show_stage_only = selectedStage !== EventStageFilter["All stages"] ? selectedStage : undefined; - history.push({ pathname: location.pathname, search: queryString.stringify(query as any) }); + history.push({ pathname: location.pathname, search: queryString.stringify(query as never) }); }} > {Object.entries(EventStageFilter)