updated search tracking logic

audioverse-org · Dec 12, 2023 · 3db56a8 · 3db56a8
1 parent c5ace63
commit 3db56a8
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 15 deletions.
diff --git a/src/components/molecules/buttonPlay.tsx b/src/components/molecules/buttonPlay.tsx
@@ -41,13 +41,10 @@ export default function ButtonPlay({
 	prefersAudio?: boolean;
 	className?: string;
 }): JSX.Element {
-	const { isPaused, play, pause, trackPlay, trackPause } = usePlaybackSession(
-		recording,
-		{
-			playlistRecordings,
-			prefersAudio,
-		}
-	);
+	const { isPaused, play, pause } = usePlaybackSession(recording, {
+		playlistRecordings,
+		prefersAudio,
+	});
 	const intl = useIntl();
 
 	const label = isPaused
@@ -73,9 +70,7 @@ export default function ButtonPlay({
 					? IconPauseLarge
 					: IconPause
 			}
-			onClick={() =>
-				isPaused ? (play(), trackPlay()) : (pause(), trackPause())
-			}
+			onClick={() => (isPaused ? play() : pause())}
 			color={
 				active
 					? isBackgroundColorDark(backgroundColor)

diff --git a/src/components/molecules/player.tsx b/src/components/molecules/player.tsx
@@ -97,9 +97,7 @@ const Player = ({
 								(shouldShowPoster || posterHovered) && styles.posterPlayShown
 							)}
 							onClick={() =>
-								session.isPaused
-									? (session.play(), session.trackPlay())
-									: (session.pause(), session.trackPause())
+								session.isPaused ? session.play() : session.pause()
 							}
 							onTouchStart={() => setPosterHovered(true)}
 							onTouchEnd={() => setPosterHovered(false)}

diff --git a/src/components/molecules/searchBar.tsx b/src/components/molecules/searchBar.tsx
@@ -49,7 +49,6 @@ export default function SearchBar({
 	useEffect(() => {
 		if (isFocused) {
 			document.addEventListener('keydown', handleSubmit);
-			analytics.track('search', { term: term });
 		} else {
 			document.removeEventListener('keydown', handleSubmit);
 		}
@@ -87,7 +86,9 @@ export default function SearchBar({
 					value={term ?? ''}
 					onChange={({ target }) => onTermChange(target.value)}
 					onFocus={() => setIsFocused(true)}
-					onBlur={() => setIsFocused(false)}
+					onBlur={() => {
+						setIsFocused(false), analytics.track('search', { term: term });
+					}}
 					placeholder={
 						isFocused
 							? ''

diff --git a/src/lib/usePlaybackSession.tsx b/src/lib/usePlaybackSession.tsx
@@ -174,10 +174,12 @@ export default function usePlaybackSession(
 		// TODO: Maybe only if `isLoaded` is true
 		// Or perhaps throw an exception, since the user should never be presented
 		// with a pause button for a recording that isn't loaded.
+		trackPause();
 		context.pause();
 	}
 
 	function play() {
+		trackPlay();
 		afterLoad((c) => c.play());
 	}