[PLAT-696] Add trending-playlists/underground notifications (#3089)

AudiusProject · Mar 24, 2023 · 4b8edef · 4b8edef
1 parent 1f9cf3e
commit 4b8edef
Show file tree

Hide file tree

Showing 23 changed files with 428 additions and 70 deletions.
diff --git a/packages/common/src/models/Analytics.ts b/packages/common/src/models/Analytics.ts
@@ -177,6 +177,9 @@ export enum Name {
   NOTIFICATIONS_CLICK_DETHRONED_TWITTER_SHARE = 'Notifications: Clicked Dethroned Twitter Share',
   NOTIFICATIONS_CLICK_SUPPORTER_RANK_UP_TWITTER_SHARE = 'Notifications: Clicked Supporter Rank Up Twitter Share',
   NOTIFICATIONS_CLICK_SUPPORTING_RANK_UP_TWITTER_SHARE = 'Notifications: Clicked Supporting Rank Up Twitter Share',
+  NOTIFICATIONS_CLICK_TRENDING_TRACK_TWITTER_SHARE = 'Notifications: Clicked Trending Track Twitter Share',
+  NOTIFICATIONS_CLICK_TRENDING_PLAYLIST_TWITTER_SHARE = 'Notifications: Clicked Trending Playlist Twitter Share',
+  NOTIFICATIONS_CLICK_TRENDING_UNDERGROUND_TWITTER_SHARE = 'Notifications: Clicked Trending Underground Twitter Share',
   NOTIFICATIONS_CLICK_ADD_TRACK_TO_PLAYLIST_TWITTER_SHARE = 'Notifications: Clicked Add Track to Playlist Twitter Share',
   NOTIFICATIONS_TOGGLE_SETTINGS = 'Notifications: Toggle Setting',
   BROWSER_NOTIFICATION_SETTINGS = 'Browser Push Notification',
@@ -891,6 +894,18 @@ type NotificationsClickAddTrackToPlaylist = {
   eventName: Name.NOTIFICATIONS_CLICK_ADD_TRACK_TO_PLAYLIST_TWITTER_SHARE
   text: string
 }
+type NotificationsClickTrendingTrack = {
+  eventName: Name.NOTIFICATIONS_CLICK_TRENDING_TRACK_TWITTER_SHARE
+  text: string
+}
+type NotificationsClickTrendingPlaylist = {
+  eventName: Name.NOTIFICATIONS_CLICK_TRENDING_PLAYLIST_TWITTER_SHARE
+  text: string
+}
+type NotificationsClickTrendingUnderground = {
+  eventName: Name.NOTIFICATIONS_CLICK_TRENDING_UNDERGROUND_TWITTER_SHARE
+  text: string
+}
 type NotificationsToggleSettings = {
   eventName: Name.NOTIFICATIONS_TOGGLE_SETTINGS
   settings: string
@@ -1593,6 +1608,9 @@ export type AllTrackingEvents =
   | NotificationsClickSupporterRankUp
   | NotificationsClickSupportingRankUp
   | NotificationsClickAddTrackToPlaylist
+  | NotificationsClickTrendingPlaylist
+  | NotificationsClickTrendingTrack
+  | NotificationsClickTrendingUnderground
   | NotificationsToggleSettings
   | ProfilePageTabClick
   | ProfilePageSort

diff --git a/packages/common/src/store/notifications/types.ts b/packages/common/src/store/notifications/types.ts
@@ -32,6 +32,8 @@ export enum NotificationType {
   RemixCreate = 'RemixCreate',
   RemixCosign = 'RemixCosign',
   TrendingTrack = 'TrendingTrack',
+  TrendingPlaylist = 'TrendingPlaylist',
+  TrendingUnderground = 'TrendingUnderground',
   ChallengeReward = 'ChallengeReward',
   TierChange = 'TierChange',
   Reaction = 'Reaction',
@@ -657,6 +659,15 @@ export type RemixCosignPushNotification = {
   ]
 }
 
+export type TrendingPlaylistNotification = BaseNotification & {
+  type: NotificationType.TrendingPlaylist
+  rank: number
+  genre: string
+  time: 'week' | 'month' | 'year'
+  entityType: Entity.Playlist
+  entityId: ID
+}
+
 export type TrendingTrackNotification = BaseNotification & {
   type: NotificationType.TrendingTrack
   rank: number
@@ -666,6 +677,15 @@ export type TrendingTrackNotification = BaseNotification & {
   entityId: ID
 }
 
+export type TrendingUndergroundNotification = BaseNotification & {
+  type: NotificationType.TrendingUnderground
+  rank: number
+  genre: string
+  time: 'week' | 'month' | 'year'
+  entityType: Entity.Track
+  entityId: ID
+}
+
 export type ChallengeRewardNotification = BaseNotification & {
   type: NotificationType.ChallengeReward
   challengeId: ChallengeRewardID
@@ -824,7 +844,9 @@ export type Notification =
   | MilestoneNotification
   | RemixCreateNotification
   | RemixCosignNotification
+  | TrendingPlaylistNotification
   | TrendingTrackNotification
+  | TrendingUndergroundNotification
   | ChallengeRewardNotification
   | TierChangeNotification
   | ReactionNotification

diff --git a/packages/mobile/src/components/twitter-button/TwitterButton.tsx b/packages/mobile/src/components/twitter-button/TwitterButton.tsx
@@ -12,10 +12,10 @@ import { useDispatch, useSelector } from 'react-redux'
 import IconTwitterBird from 'app/assets/images/iconTwitterBird.svg'
 import type { ButtonProps } from 'app/components/core'
 import { Button, useOnOpenLink } from 'app/components/core'
-import type { make } from 'app/services/analytics'
-import { track } from 'app/services/analytics'
+import { make, track } from 'app/services/analytics'
 import { makeStyles } from 'app/styles'
 import { spacing } from 'app/styles/spacing'
+import type { AllEvents } from 'app/types/analytics'
 const { getUser } = cacheUsersSelectors
 const { fetchUserSocials } = cacheUsersActions
 
@@ -32,7 +32,7 @@ const useStyles = makeStyles(({ palette }) => ({
 type StaticTwitterProps = {
   type: 'static'
   shareText: string
-  analytics?: ReturnType<typeof make>
+  analytics?: AllEvents
 }
 
 type DynamicTwitterProps = {
@@ -44,7 +44,7 @@ type DynamicTwitterProps = {
     otherHandle?: Nullable<string>
   ) => Nullable<{
     shareText: string
-    analytics: ReturnType<typeof make>
+    analytics: AllEvents
   }>
 }
 
@@ -80,7 +80,7 @@ export const TwitterButton = (props: TwitterButtonProps) => {
 
   const handlePress = useCallback(() => {
     if (other.type === 'static' && other.analytics) {
-      track(other.analytics)
+      track(make(other.analytics))
     }
     if (other.type === 'dynamic') {
       dispatch(fetchUserSocials(other.handle))
@@ -104,7 +104,7 @@ export const TwitterButton = (props: TwitterButtonProps) => {
     if (twitterData) {
       const { shareText, analytics } = twitterData
       openLink(makeTwitterShareUrl(url, shareText))
-      track(analytics)
+      track(make(analytics))
       setIdle()
     }
   }

diff --git a/packages/mobile/src/screens/notifications-screen/NotificationListItem.tsx b/packages/mobile/src/screens/notifications-screen/NotificationListItem.tsx
@@ -13,7 +13,9 @@ import {
   MilestoneNotification,
   AnnouncementNotification,
   TierChangeNotification,
+  TrendingPlaylistNotification,
   TrendingTrackNotification,
+  TrendingUndergroundNotification,
   TopSupporterNotification,
   TopSupportingNotification,
   TipReactionNotification,
@@ -76,8 +78,12 @@ export const NotificationListItem = (props: NotificationListItemProps) => {
         return <TopSupporterNotification notification={notification} />
       case NotificationType.SupportingRankUp:
         return <TopSupportingNotification notification={notification} />
+      case NotificationType.TrendingPlaylist:
+        return <TrendingPlaylistNotification notification={notification} />
       case NotificationType.TrendingTrack:
         return <TrendingTrackNotification notification={notification} />
+      case NotificationType.TrendingUnderground:
+        return <TrendingUndergroundNotification notification={notification} />
       case NotificationType.UserSubscription:
         return <UserSubscriptionNotification notification={notification} />
       case NotificationType.AddTrackToPlaylist:

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/MilestoneNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/MilestoneNotification.tsx
@@ -16,7 +16,6 @@ import { useSelector } from 'react-redux'
 
 import IconTrophy from 'app/assets/images/iconTrophy.svg'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 import { formatCount } from 'app/utils/format'
 
@@ -146,10 +145,10 @@ export const MilestoneNotification = (props: MilestoneNotificationProps) => {
         type='static'
         url={link}
         shareText={text}
-        analytics={make({
+        analytics={{
           eventName: EventNames.NOTIFICATIONS_CLICK_MILESTONE_TWITTER_SHARE,
           milestone: text
-        })}
+        }}
       />
     </NotificationTile>
   )

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/RemixCosignNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/RemixCosignNotification.tsx
@@ -11,7 +11,6 @@ import { useSelector } from 'react-redux'
 
 import IconRemix from 'app/assets/images/iconRemix.svg'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 import { getTrackRoute } from 'app/utils/routes'
 
@@ -68,10 +67,10 @@ export const RemixCosignNotification = (
     (handle: string | undefined) => {
       if (parentTrackTitle && handle) {
         const shareText = messages.shareTwitterText(parentTrackTitle, handle)
-        const analytics = make({
+        const analytics = {
           eventName: EventNames.NOTIFICATIONS_CLICK_REMIX_COSIGN_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
         return { shareText, analytics }
       }
       return null

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/RemixCreateNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/RemixCreateNotification.tsx
@@ -10,7 +10,6 @@ import { useSelector } from 'react-redux'
 
 import IconRemix from 'app/assets/images/iconRemix.svg'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 import { getTrackRoute } from 'app/utils/routes'
 
@@ -69,10 +68,10 @@ export const RemixCreateNotification = (
     (handle: string | undefined) => {
       if (parentTrackTitle && handle) {
         const shareText = messages.shareTwitterText(parentTrackTitle, handle)
-        const analytics = make({
+        const analytics = {
           eventName: EventNames.NOTIFICATIONS_CLICK_REMIX_COSIGN_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
         return { shareText, analytics }
       }
       return null

diff --git a/.../mobile/src/screens/notifications-screen/Notifications/SupporterDethronedNotification.tsx b/.../mobile/src/screens/notifications-screen/Notifications/SupporterDethronedNotification.tsx
@@ -10,7 +10,6 @@ import { useSelector } from 'react-redux'
 
 import IconCrownSource from 'app/assets/images/crown2x.png'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
 import {
@@ -68,10 +67,10 @@ export const SupporterDethronedNotification = (
       const shareText = messages.twitterShare(usurpingHandle, supportingHandle)
       return {
         shareText,
-        analytics: make({
+        analytics: {
           eventName: EventNames.NOTIFICATIONS_CLICK_DETHRONED_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
       }
     },
     []

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/TipReactionNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/TipReactionNotification.tsx
@@ -12,7 +12,6 @@ import { useSelector } from 'react-redux'
 import IconTip from 'app/assets/images/iconTip.svg'
 import UserBadges from 'app/components/user-badges'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { makeStyles } from 'app/styles'
 import { EventNames } from 'app/types/analytics'
 
@@ -93,10 +92,10 @@ export const TipReactionNotification = (
     const shareText = messages.twitterShare(handle, Platform.OS === 'ios')
     return {
       shareText,
-      analytics: make({
+      analytics: {
         eventName: EventNames.NOTIFICATIONS_CLICK_TIP_REACTION_TWITTER_SHARE,
         text: shareText
-      })
+      } as const
     }
   }, [])
 

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/TipReceivedNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/TipReceivedNotification.tsx
@@ -19,7 +19,6 @@ import Checkmark from 'app/assets/images/emojis/white-heavy-check-mark.png'
 import IconTip from 'app/assets/images/iconTip.svg'
 import { Text } from 'app/components/core'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
 import {
@@ -99,10 +98,10 @@ export const TipReceivedNotification = (
       )
       return {
         shareText,
-        analytics: make({
+        analytics: {
           eventName: EventNames.NOTIFICATIONS_CLICK_TIP_RECEIVED_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
       }
     },
     [uiAmount]

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/TipSentNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/TipSentNotification.tsx
@@ -7,7 +7,6 @@ import { useSelector } from 'react-redux'
 
 import IconTip from 'app/assets/images/iconTip.svg'
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
 import {
@@ -65,10 +64,10 @@ export const TipSentNotification = (props: TipSentNotificationProps) => {
       )
       return {
         shareText,
-        analytics: make({
+        analytics: {
           eventName: EventNames.NOTIFICATIONS_CLICK_TIP_SENT_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
       }
     },
     [uiAmount]

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/TopSupporterNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/TopSupporterNotification.tsx
@@ -6,7 +6,6 @@ import { Platform } from 'react-native'
 import { useSelector } from 'react-redux'
 
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
 import { NotificationTile, NotificationTwitterButton } from '../Notification'
@@ -51,11 +50,11 @@ export const TopSupporterNotification = (
       )
       return {
         shareText,
-        analytics: make({
+        analytics: {
           eventName:
             EventNames.NOTIFICATIONS_CLICK_SUPPORTER_RANK_UP_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
       }
     },
     [rank]

diff --git a/packages/mobile/src/screens/notifications-screen/Notifications/TopSupportingNotification.tsx b/packages/mobile/src/screens/notifications-screen/Notifications/TopSupportingNotification.tsx
@@ -6,7 +6,6 @@ import { Platform } from 'react-native'
 import { useSelector } from 'react-redux'
 
 import { useNotificationNavigation } from 'app/hooks/useNotificationNavigation'
-import { make } from 'app/services/analytics'
 import { EventNames } from 'app/types/analytics'
 
 import { NotificationTile, NotificationTwitterButton } from '../Notification'
@@ -51,11 +50,11 @@ export const TopSupportingNotification = (
       )
       return {
         shareText,
-        analytics: make({
+        analytics: {
           eventName:
             EventNames.NOTIFICATIONS_CLICK_SUPPORTING_RANK_UP_TWITTER_SHARE,
           text: shareText
-        })
+        } as const
       }
     },
     [rank]