instrument more behaviors with analytics

packages/fakeyou.com/src/common/Analytics.ts

@@ -84,6 +84,10 @@ class Analytics {
     Analytics.sendCategorizedEvent(this.TTS, 'clear', modelToken);
   }
   
+  static ttsClickResultInlinePlay() {
+    Analytics.sendCategorizedEvent(this.TTS, 'click_tts_result_inline_play');
+  }
+
   static ttsClickResultLink() {
     Analytics.sendCategorizedEvent(this.TTS, 'click_tts_result_link');
   }
@@ -92,6 +96,14 @@ class Analytics {
     Analytics.sendCategorizedEvent(this.TTS, 'click_model_details_link');
   }
 
+  static ttsClickHeroViewProfile() {
+    Analytics.sendCategorizedEvent(this.TTS, 'click_hero_view_profile');
+  }
+
+  static ttsClickHeroViewPricing() {
+    Analytics.sendCategorizedEvent(this.TTS, 'click_hero_view_pricing');
+  }
+
   static ttsClickHeroVoiceClone() {
     Analytics.sendCategorizedEvent(this.TTS, 'click_hero_voice_clone');
   }

packages/fakeyou.com/src/v2/view/_common/SessionTtsInferenceResultsListFc.tsx

@@ -94,7 +94,12 @@ function SessionTtsInferenceResultListFc(props: Props) {
                 <p>{job.rawInferenceText}</p>
               </div>
 
-              <audio className="w-100" controls src={audioLink}>
+              <audio 
+                className="w-100" 
+                controls 
+                src={audioLink}
+                onClick={() => { Analytics.ttsClickResultInlinePlay() }}
+              >
                 Your browser does not support the
                 <code>audio</code> element.
               </audio>

packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsPageHero.tsx

@@ -22,17 +22,15 @@ interface Props {
 export function TtsPageHero(props: Props) {
   const randomImage = useMemo(() => {
     const images = [
+      "mascot/kitsune_pose2.webp",
+      "mascot/kitsune_wizard.webp",
       // "mascot/halloween_1.webp",
       // "mascot/halloween_2.webp",
       // "mascot/halloween_3.webp",
-
-      "mascot/kitsune_pose2.webp",
-      "mascot/kitsune_wizard.webp",
-
-      //"mascot/xmas_1.webp",
-      //"mascot/xmas_2.webp",
-      //"mascot/xmas_3.webp",
-      //"mascot/xmas_4.webp",
+      // "mascot/xmas_1.webp",
+      // "mascot/xmas_2.webp",
+      // "mascot/xmas_3.webp",
+      // "mascot/xmas_4.webp",
     ];
 
     return images[Math.floor(Math.random() * images.length)];
@@ -61,7 +59,12 @@ export function TtsPageHero(props: Props) {
     );
     viewPricingButton = (
       <>
-        <Link to="/pricing">
+        <Link 
+          to="/pricing"
+          onClick={() => {
+            Analytics.ttsClickHeroViewPricing();
+          }}
+        >
           <button type="button" className="btn btn-secondary w-100">
             <FontAwesomeIcon icon={faStar} className="me-2" />
             View Pricing
@@ -76,7 +79,12 @@ export function TtsPageHero(props: Props) {
     let url = `/profile/${displayName}`;
     myProfileButton = (
       <>
-        <Link to={url}>
+        <Link 
+          to={url}
+          onClick={() => {
+            Analytics.ttsClickHeroViewProfile();
+          }}
+        >
           <button type="button" className="btn btn-secondary w-100">
             <FontAwesomeIcon icon={faUser} className="me-2" />
             View my profile