Ad missing analytics

Joystream · May 3, 2024 · c04e6d8 · c04e6d8
1 parent 06d94a0
commit c04e6d8
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 12 deletions.
diff --git a/packages/atlas/src/hooks/useSegmentAnalytics.ts b/packages/atlas/src/hooks/useSegmentAnalytics.ts
@@ -565,6 +565,15 @@ export const useSegmentAnalytics = () => {
     },
     [analytics]
   )
+  const trackRoundtableEventsClicked = useCallback(
+    (channelId: string, channelTier: string) => {
+      analytics.track('Rewards - Roundtable Events Clicked', {
+        channelId,
+        channelTier,
+      })
+    },
+    [analytics]
+  )
 
   const trackShareNftLinkClicked = useCallback(
     (channelId: string, channelTier: string) => {
@@ -686,5 +695,6 @@ export const useSegmentAnalytics = () => {
     trackTwitterPostLinkClicked,
     trackRewardsBrandingLinkClicked,
     trackRewardsReferralLinkClicked,
+    trackRoundtableEventsClicked,
   }
 }
diff --git a/packages/atlas/src/views/studio/YppDashboard/tabs/YppDashboardMainTab.tsx b/packages/atlas/src/views/studio/YppDashboard/tabs/YppDashboardMainTab.tsx
@@ -109,6 +109,7 @@ export const YppDashboardMainTab: FC = () => {
     trackShareNftLinkClicked,
     trackJoinDiscordLinkClicked,
     trackShareTokenLinkClicked,
+    trackRoundtableEventsClicked,
   } = useSegmentAnalytics()
   const navigate = useNavigate()
   const _handleYppSignUpClick = useYppAuthorizeHandler()
@@ -126,6 +127,7 @@ export const YppDashboardMainTab: FC = () => {
   const isSilverOrAbove = ['Verified::Silver', 'Verified::Gold', 'Verified::Diamond'].includes(
     currentChannel?.yppStatus ?? ''
   )
+  const isBronze = currentChannel?.yppStatus === 'Verified::Bronze'
   const handleYppSignUpClick = () => {
     const success = _handleYppSignUpClick()
     if (success) {
@@ -153,6 +155,18 @@ export const YppDashboardMainTab: FC = () => {
     </YppSyncStatus>
   )
 
+  const silverTierGroup = (
+    <FlexBox gap={3} alignItems="center">
+      <SilverTierWrapper tier="Verified::Silver">{getTierIcon('Verified::Silver')}</SilverTierWrapper>
+      <Text variant="t300" as="p">
+        Offers are valid for silver tiers and above.
+      </Text>
+      {!isBronze ? (
+        <Information text="Connect YouTube channel and wait for verification by the content team to get rewards tier assigned." />
+      ) : null}
+    </FlexBox>
+  )
+
   return (
     <>
       <YppAuthorizationModal unSyncedChannels={unsyncedChannels} />
@@ -376,7 +390,7 @@ export const YppDashboardMainTab: FC = () => {
             }
             actionNode={
               <Button
-                onClick={() => trackRewardsReferralLinkClicked(channelId ?? '', currentChannel?.yppStatus ?? '')}
+                onClick={() => trackRoundtableEventsClicked(channelId ?? '', currentChannel?.yppStatus ?? '')}
                 to={benefitsMetadata.roundTableEvents.actionLink}
               >
                 Learn more
@@ -386,7 +400,7 @@ export const YppDashboardMainTab: FC = () => {
         </BenefitsContainer>
 
         <BenefitsContainer title="Original Creators">
-          {silverTierGroup}
+          {isSilverOrAbove ? null : silverTierGroup}
           <BenefitCard
             title={benefitsMetadata.originalCreatorsContent.title}
             description={benefitsMetadata.originalCreatorsContent.description}
@@ -434,7 +448,7 @@ export const YppDashboardMainTab: FC = () => {
         </BenefitsContainer>
 
         <BenefitsContainer title="Social Promoters">
-          {silverTierGroup}
+          {isSilverOrAbove ? null : silverTierGroup}
           <BenefitCard
             title={benefitsMetadata.shareNft.title}
             rewardNode={benefitsMetadata.shareNft.reward}
@@ -546,15 +560,6 @@ const SilverTierWrapper = styled(TierWrapper)`
   }
 `
 
-const silverTierGroup = (
-  <FlexBox gap={3} alignItems="center">
-    <SilverTierWrapper tier="Verified::Silver">{getTierIcon('Verified::Silver')}</SilverTierWrapper>
-    <Text variant="t300" as="p">
-      Offers are valid for silver tiers and above{' '}
-    </Text>
-  </FlexBox>
-)
-
 export const BenefitsContainer = ({ children, title }: { children: ReactNode[] | ReactNode; title: string }) => {
   const drawer = useRef<HTMLDivElement>(null)
   const [isDrawerActive, setDrawerActive] = useState(true)