update tracking for View Work and Purchase buttons

artsy · Apr 25, 2024 · 2bac015 · 2bac015
1 parent 01f82cc
commit 2bac015
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 17 deletions.
diff --git a/src/app/Scenes/Activity/components/AlertNotification.tsx b/src/app/Scenes/Activity/components/AlertNotification.tsx
@@ -84,10 +84,7 @@ export const AlertNotification: FC<AlertNotificationProps> = ({ notification })
 
         <Spacer y={0.5} />
 
-        <NotificationArtworkList
-          alertID={alert.internalID}
-          artworksConnection={artworksConnection}
-        />
+        <NotificationArtworkList artworksConnection={artworksConnection} />
 
         <Flex mx={2} mt={1} mb={2}>
           <Button

diff --git a/src/app/Scenes/Activity/components/NotificationArtworkList.tsx b/src/app/Scenes/Activity/components/NotificationArtworkList.tsx
@@ -21,7 +21,6 @@ interface NotificationArtworkListProps {
   priceOfferMessage?: PriceOfferMessage
   showArtworkCommercialButtons?: boolean
   partnerOffer?: PartnerOffer
-  alertID?: string
 }
 
 export const NotificationArtworkList: FC<NotificationArtworkListProps> = (props) => {
@@ -55,7 +54,6 @@ export const NotificationArtworkList: FC<NotificationArtworkListProps> = (props)
         <CommercialButtonsQueryRenderer
           artworkID={artworks[0].internalID}
           partnerOffer={partnerOffer}
-          alertID={props.alertID}
         />
       )}
       {!!note && (

diff --git a/src/app/Scenes/Activity/components/NotificationCommercialButtons.tsx b/src/app/Scenes/Activity/components/NotificationCommercialButtons.tsx
@@ -22,9 +22,8 @@ import { useTracking } from "react-tracking"
 
 export const CommercialButtonsQueryRenderer: React.FC<{
   artworkID: string
-  alertID?: string
   partnerOffer?: PartnerOffer
-}> = ({ artworkID, partnerOffer, alertID }) => {
+}> = ({ artworkID, partnerOffer }) => {
   return (
     <QueryRenderer<NotificationCommercialButtonsQuery>
       environment={getRelayEnvironment()}
@@ -40,7 +39,7 @@ export const CommercialButtonsQueryRenderer: React.FC<{
       variables={{ artworkID }}
       render={renderWithPlaceholder({
         Container: CommercialButtons,
-        initialProps: { partnerOffer, artworkID, alertID },
+        initialProps: { partnerOffer, artworkID },
         renderPlaceholder: () => <></>,
       })}
     />
@@ -68,8 +67,7 @@ export const CommercialButtons: React.FC<{
     | InquiryButtons_artwork$key
   partnerOffer?: PartnerOffer
   artworkID: string
-  alertID?: string
-}> = ({ artwork, partnerOffer, artworkID, alertID }) => {
+}> = ({ artwork, partnerOffer, artworkID }) => {
   const artworkData = useFragment(artworkFragment, artwork)
   const [showCreateArtworkAlertModal, setShowCreateArtworkAlertModal] = useState(false)
   const space = useSpace()
@@ -100,6 +98,8 @@ export const CommercialButtons: React.FC<{
       renderComponent = (
         <Button
           onPress={() => {
+            tracking.trackEvent(tracks.tappedViewWork(artworkID, partnerOffer?.internalID || ""))
+
             navigate(`/artwork/${artworkID}`, { passProps: { artworkOfferExpired: true } })
           }}
           block
@@ -117,14 +117,16 @@ export const CommercialButtons: React.FC<{
           partnerOffer={partnerOffer}
           editionSetID={null}
           buttonText="Continue to Purchase"
+          source="notification"
         />
       )
     } else {
       renderComponent = (
         <RowContainer>
           <Button
             onPress={() => {
-              tracking.trackEvent(tracks.tappedViewWork(artworkID, alertID || ""))
+              tracking.trackEvent(tracks.tappedViewWork(artworkID, partnerOffer.internalID))
+
               navigate(`/artwork/${artworkID}`, {
                 passProps: { partnerOfferId: partnerOffer?.internalID },
               })
@@ -135,11 +137,13 @@ export const CommercialButtons: React.FC<{
           >
             View Work
           </Button>
+
           <BuyNowButton
             artwork={artworkData as BuyNowButton_artwork$key}
             partnerOffer={partnerOffer}
             editionSetID={null}
             buttonText="Purchase"
+            source="notification"
           />
         </RowContainer>
       )
@@ -150,6 +154,7 @@ export const CommercialButtons: React.FC<{
         <Button block variant="outline" onPress={() => setShowCreateArtworkAlertModal(true)}>
           Create Alert
         </Button>
+
         <CreateArtworkAlertModal
           artwork={artwork as CreateArtworkAlertModal_artwork$key}
           onClose={() => setShowCreateArtworkAlertModal(false)}
@@ -174,13 +179,14 @@ const artworkFragment = graphql`
     ...CreateArtworkAlertModal_artwork
   }
 `
+
 const tracks = {
-  tappedViewWork: (artworkID: string, alertID: string): TappedViewWork => ({
+  tappedViewWork: (artworkID: string, partnerOfferId: string): TappedViewWork => ({
     action: ActionType.tappedViewWork,
     context_module: ContextModule.notification,
     context_screen_owner_type: OwnerType.notification,
-    context_screen_owner_id: alertID,
+    context_screen_owner_id: partnerOfferId,
     artwork_id: artworkID,
-    notification_type: "",
+    notification_type: "offers",
   }),
 }
diff --git a/src/app/Scenes/Artwork/Components/CommercialButtons/BuyNowButton.tsx b/src/app/Scenes/Artwork/Components/CommercialButtons/BuyNowButton.tsx
@@ -6,7 +6,6 @@ import {
   TappedBuyNow,
 } from "@artsy/cohesion"
 import { ButtonProps, Button } from "@artsy/palette-mobile"
-
 import { BuyNowButton_artwork$key } from "__generated__/BuyNowButton_artwork.graphql"
 import { Toast } from "app/Components/Toast/Toast"
 import { useCreateOrder } from "app/Scenes/Artwork/hooks/useCreateOrder"
@@ -36,6 +35,8 @@ export interface BuyNowButtonProps {
   editionSetID: string | null
   renderSaleMessage?: boolean
   buttonText?: string
+  // Source is used to track where the button was tapped from, by default it's in the artwork screen
+  source?: "notification" | (string & {})
 }
 
 export const BuyNowButton = ({
@@ -45,6 +46,7 @@ export const BuyNowButton = ({
   editionSetID,
   renderSaleMessage,
   buttonText,
+  source,
 }: BuyNowButtonProps) => {
   const [isCommittingCreateOrderMutation, setIsCommittingCreateOrderMutation] = useState(false)
   const AREnablePartnerOfferOnArtworkScreen = useFeatureFlag("AREnablePartnerOfferOnArtworkScreen")
@@ -159,10 +161,19 @@ export const BuyNowButton = ({
 
     try {
       if (AREnablePartnerOfferOnArtworkScreen && partnerOffer && !partnerOfferTimer?.hasEnded) {
-        trackEvent(tracks.tappedBuyNow(slug, internalID, OwnerType.notification, "Partner offer"))
+        trackEvent(
+          tracks.tappedBuyNow(
+            slug,
+            internalID,
+            source === "notification" ? OwnerType.notification : OwnerType.artwork,
+            "Partner offer"
+          )
+        )
+
         await createOrderFromPartnerOffer(partnerOffer)
       } else {
         trackEvent(tracks.tappedBuyNow(slug, internalID, OwnerType.artwork, "Buy now"))
+
         await createOrder()
       }
     } catch (e) {