diff --git a/public/img/icons-raw/icon-exit-small.svg b/public/img/icons-raw/icon-exit-small.svg deleted file mode 100644 index 90ffb7977..000000000 --- a/public/img/icons-raw/icon-exit-small.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/public/img/icons/icon-exit-small.svg b/public/img/icons/icon-exit-small.svg deleted file mode 100644 index 46c9c7fea..000000000 --- a/public/img/icons/icon-exit-small.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/atoms/activeLink.tsx b/src/components/atoms/activeLink.tsx index d6b1eb8a0..c1987d43f 100644 --- a/src/components/atoms/activeLink.tsx +++ b/src/components/atoms/activeLink.tsx @@ -3,14 +3,12 @@ import { LinkProps } from 'next/link'; import { useRouter } from 'next/router'; import React, { ReactElement } from 'react'; -import { analytics } from '../../lib/analytics'; import Link from './linkWithoutPrefetch'; type ActiveLinkProps = LinkProps & { children: ReactElement; className?: string; activeClassName: string; - linkLabel?: string; }; // SOURCE: https://zaiste.net/programming/reactjs/howtos/create-activelink-nextjs/ @@ -19,7 +17,6 @@ const ActiveLink = ({ children, className, activeClassName, - linkLabel, ...props }: ActiveLinkProps): JSX.Element => { const { asPath } = useRouter(); @@ -34,9 +31,6 @@ const ActiveLink = ({ { - analytics.track('Menu click', { label: linkLabel }); - }} > {children} diff --git a/src/components/atoms/titleLogger.tsx b/src/components/atoms/titleLogger.tsx deleted file mode 100644 index b9a2d8075..000000000 --- a/src/components/atoms/titleLogger.tsx +++ /dev/null @@ -1,31 +0,0 @@ -// components/TitleLogger.tsx -import { useRouter } from 'next/router'; -import { useEffect, useState } from 'react'; - -function TitleLogger() { - const router = useRouter(); - const [currentTitle, setCurrentTitle] = useState(null); - - useEffect(() => { - const handleRouteChange = () => { - // Access the current title - const newTitle = document.querySelector('title')?.text; - setCurrentTitle(newTitle || null); - }; - - // Listen for route changes - router.events.on('routeChangeComplete', handleRouteChange); - - // Initial title - handleRouteChange(); - - // Remove the event listener on component unmount - return () => { - router.events.off('routeChangeComplete', handleRouteChange); - }; - }, [router.events]); - - return { currentTitle }; -} - -export default TitleLogger; diff --git a/src/components/molecules/buttonFavorite.tsx b/src/components/molecules/buttonFavorite.tsx index 6c1da02c7..837e19aa0 100644 --- a/src/components/molecules/buttonFavorite.tsx +++ b/src/components/molecules/buttonFavorite.tsx @@ -5,6 +5,7 @@ import { BaseColors } from '~lib/constants'; import IconLike from '~public/img/icons/icon-like.svg'; import IconLikeActive from '~public/img/icons/icon-like-active.svg'; import IconLikeLight from '~public/img/icons/icon-like-light.svg'; +import { gtmPushEvent } from '~src/utils/gtm'; import { analytics } from '../../lib/analytics'; import { isBackgroundColorDark } from './buttonPlay'; @@ -68,6 +69,11 @@ const ButtonFavorite = forwardRef( e.preventDefault(); e.stopPropagation(); toggleFavorited(); + if (!isFavorited) { + gtmPushEvent({ + event: 'favorite', + }); + } if (favoritedType) { analytics.track(isFavorited ? 'Unfavorite' : 'Favorite', { type: favoritedType, diff --git a/src/components/molecules/buttonShare.tsx b/src/components/molecules/buttonShare.tsx index b4ba835f6..f7c2a8695 100644 --- a/src/components/molecules/buttonShare.tsx +++ b/src/components/molecules/buttonShare.tsx @@ -40,7 +40,7 @@ export default function ButtonShare({ // FUTURE: update sharing links const facebookLink = `https://facebook.com/share.php?u=${shareUrl}`; - const twitterLink = `https://twitter.com/intent/tweet?url=${shareUrl}`; + const twitterLink = `https://x.com/intent/post?url=${shareUrl}`; const emailLink = `mailto:?body=${shareUrl}${ emailSubject ? `&subject=${encodeURIComponent( diff --git a/src/components/molecules/card/collection.tsx b/src/components/molecules/card/collection.tsx index bb14e8b9b..4eaff7fe8 100644 --- a/src/components/molecules/card/collection.tsx +++ b/src/components/molecules/card/collection.tsx @@ -1,6 +1,5 @@ import clsx from 'clsx'; import Image from 'next/legacy/image'; -import router from 'next/router'; import React from 'react'; import { FormattedMessage } from 'react-intl'; @@ -16,7 +15,6 @@ import { useFormattedDuration } from '~lib/time'; import useHover from '~lib/useHover'; import SuccessIcon from '~public/img/icons/icon-success-light.svg'; import { CollectionContentType } from '~src/__generated__/graphql'; -import { analytics } from '~src/lib/analytics'; import ButtonFavorite from '../buttonFavorite'; import CollectionTypeLockup from '../collectionTypeLockup'; @@ -52,7 +50,6 @@ export default function CardCollection({ image, startDate, title, - id, } = collection; const heroImage = image?.url && (
@@ -77,14 +74,6 @@ export default function CardCollection({ isBibleVersion && styles.bibleVersion, (isHovered || isSubHovered) && styles.otherHovered, )} - onClick={() => { - analytics.track('Card click', { - type: contentType, - id, - title, - }); - router.push(canonicalPath); - }} > {heroImage} diff --git a/src/components/molecules/card/person.tsx b/src/components/molecules/card/person.tsx index 9ae6d0886..c247bdefb 100644 --- a/src/components/molecules/card/person.tsx +++ b/src/components/molecules/card/person.tsx @@ -10,8 +10,6 @@ import RoundImage from '~components/atoms/roundImage'; import Card from '~components/molecules/card'; import { useIsPersonFavorited } from '~lib/api/useIsPersonFavorited'; import { BaseColors } from '~lib/constants'; -import { CatalogEntityType } from '~src/__generated__/graphql'; -import { analytics } from '~src/lib/analytics'; import ButtonFavorite from '../buttonFavorite'; import PersonTypeLockup from '../personTypeLockup'; @@ -35,21 +33,12 @@ export default function CardPerson({ smallinit = false, }: CardCollectionProps): JSX.Element { const { isFavorited, toggleFavorited } = useIsPersonFavorited(person.id); - const { canonicalPath, image, name, recordings, id } = person; + const { canonicalPath, image, name, recordings } = person; return ( - { - analytics.track('Card click', { - type: CatalogEntityType.Person, - id, - title: name, - }); - }} - > +
{!compact && } diff --git a/src/components/molecules/card/sequence.tsx b/src/components/molecules/card/sequence.tsx index 08f7aa088..1505444d1 100644 --- a/src/components/molecules/card/sequence.tsx +++ b/src/components/molecules/card/sequence.tsx @@ -22,7 +22,6 @@ import IconDisclosure from '~public/img/icons/icon-disclosure.svg'; import SuccessIcon from '~public/img/icons/icon-success-light.svg'; import { SequenceContentType } from '~src/__generated__/graphql'; import NameMatcher from '~src/components/atoms/nameMatcher'; -import { analytics } from '~src/lib/analytics'; import ButtonFavorite from '../buttonFavorite'; import PersonLockup from '../personLockup'; @@ -61,7 +60,6 @@ export default function CardSequence({ title, speakers, sequenceWriters: writers, - id, } = sequence; const { Icon, accentColor, backgroundColor, textColor, label, labelColor } = ( @@ -302,18 +300,7 @@ export default function CardSequence({ return ( - { - analytics.track('Card click', { - type: sequence.contentType, - id, - title, - }); - }} - > - {inner} - + {inner} ); diff --git a/src/components/molecules/card/sponsor.tsx b/src/components/molecules/card/sponsor.tsx index 3060c7882..d2cbd6194 100644 --- a/src/components/molecules/card/sponsor.tsx +++ b/src/components/molecules/card/sponsor.tsx @@ -10,8 +10,6 @@ import Card from '~components/molecules/card'; import { useIsSponsorFavorited } from '~lib/api/useIsSponsorFavorited'; import { BaseColors } from '~lib/constants'; import UserPlusIcon from '~public/img/icons/fa-user-plus.svg'; -import { CatalogEntityType } from '~src/__generated__/graphql'; -import { analytics } from '~src/lib/analytics'; import ButtonFavorite from '../buttonFavorite'; import TypeLockup from '../typeLockup'; @@ -28,29 +26,13 @@ export default function CardSponsor({ const intl = useIntl(); const { isFavorited, toggleFavorited } = useIsSponsorFavorited(sponsor.id); - const { - canonicalPath, - image, - title, - collections, - sequences, - recordings, - id, - } = sponsor; + const { canonicalPath, image, title, collections, sequences, recordings } = + sponsor; return ( - { - analytics.track('Card click', { - type: CatalogEntityType.Sponsor, - id, - title, - }); - }} - > + {inner} @@ -39,7 +36,6 @@ export default function NavItem({ { - analytics.track('Menu click', { label }); setSubmenu(key); }} > diff --git a/src/components/molecules/searchBar.module.scss b/src/components/molecules/searchBar.module.scss index b76430110..573b25dc6 100644 --- a/src/components/molecules/searchBar.module.scss +++ b/src/components/molecules/searchBar.module.scss @@ -92,6 +92,9 @@ letter-spacing: 0em; text-align: left; margin-left: 28px; + @media (max-width: $breakpoint-sm) { + display: none; + } } .filters { diff --git a/src/components/molecules/searchBar.tsx b/src/components/molecules/searchBar.tsx index 1efa652a4..55ee07966 100644 --- a/src/components/molecules/searchBar.tsx +++ b/src/components/molecules/searchBar.tsx @@ -79,7 +79,7 @@ export default function SearchBar({ > { - analytics.track('Card click', { - type: recording.recordingContentType, - id: recording.id, - title: recording.title, - }); router.push(recording.canonicalPath); }} > @@ -133,13 +127,6 @@ export default function TeaseRecording({ unpadded && styles.unpadded, fullBleed && styles.fullBleed, )} - onClick={() => { - analytics.track('Card click', { - type: recording.recordingContentType, - id: recording.id, - title: recording.title, - }); - }} > {inner} diff --git a/src/components/organisms/drawer.tsx b/src/components/organisms/drawer.tsx index e3a2a771d..ac5cc510c 100644 --- a/src/components/organisms/drawer.tsx +++ b/src/components/organisms/drawer.tsx @@ -10,13 +10,9 @@ import styles from './drawer.module.scss'; export default function Drawer({ showingMenu, onExit, - onSearchChange, - searchTerm, }: { showingMenu: boolean; onExit: () => void; - onSearchChange: (term: string | undefined) => void; - searchTerm?: string; }): JSX.Element { useEffect(() => { Router.events.on('routeChangeStart', onExit); @@ -34,11 +30,7 @@ export default function Drawer({
- +
); diff --git a/src/components/organisms/mobileHeader.module.scss b/src/components/organisms/mobileHeader.module.scss index 86ea0d0c1..8d744b09d 100644 --- a/src/components/organisms/mobileHeader.module.scss +++ b/src/components/organisms/mobileHeader.module.scss @@ -70,45 +70,6 @@ border: none; } -.search { - display: none; - background: $ts-cream; - padding-top: 8px; - - @include hpad(); - - .searchInput { - background: $ts-white; - border-bottom: none; - border-radius: 4px; - padding: 4px 12px 4px 8px; - height: 32px; - - > svg { - color: $ts-red; - } - - input, - input::placeholder { - font-size: 16px; - line-height: 24px; - font-weight: 400; - } - } - - > button { - margin-left: 8px; - } -} - -.searchActive { - display: flex; -} - -.searchFilters { - padding-top: 8px; -} - @media (min-width: $breakpoint-lg) { .base { display: none; diff --git a/src/components/organisms/mobileHeader.tsx b/src/components/organisms/mobileHeader.tsx index 9c7c6bbf3..b099b51e2 100644 --- a/src/components/organisms/mobileHeader.tsx +++ b/src/components/organisms/mobileHeader.tsx @@ -6,37 +6,25 @@ import { FormattedMessage, useIntl } from 'react-intl'; import Button from '~components/molecules/button'; import ButtonPlayback from '~components/molecules/buttonPlayback'; import Mininav from '~components/molecules/mininav'; -import SearchBar from '~components/molecules/searchBar'; import Header from '~components/organisms/header'; import { PlaybackContext } from '~components/templates/andPlaybackContext'; import root from '~lib/routes'; import useLanguageRoute from '~lib/useLanguageRoute'; import { useNavigationItems } from '~lib/useNavigationItems'; -import IconExitSmall from '~public/img/icons/icon-exit-small.svg'; import MoreIcon from '~public/img/icons/icon-more.svg'; -import { analytics } from '../../lib/analytics'; import OpenAppButton from '../molecules/openAppButton'; import styles from './mobileHeader.module.scss'; import useScrollDirection, { SCROLL_DIRECTIONS, } from './mobileHeader.useScrollDirection'; -import { EntityFilterId } from './searchResults.filters'; export default function MobileHeader({ setShowingMenu, scrollRef, - term, - onTermChange, - entityType, - onEntityTypeChange, }: { setShowingMenu: (showingMenu: boolean) => void; scrollRef: React.RefObject; - term?: string; - onTermChange: (term: string | undefined) => void; - entityType: EntityFilterId; - onEntityTypeChange: (entityType: EntityFilterId) => void; }): JSX.Element { const intl = useIntl(); const { asPath } = useRouter(); @@ -59,9 +47,6 @@ export default function MobileHeader({