Skip to content

Commit 8623ef6

Browse files
nickskalkinnickskalkin
committed
feat(dia-1067): infinite disco bottom sheet tracking (except footer)
1 parent 80c2de6 commit 8623ef6

8 files changed

+251
-168
lines changed

‎src/app/Components/ArtistFollowButton.tsx

+17
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
import { FollowButton } from "@artsy/palette-mobile"
22
import { ArtistFollowButtonQuery } from "__generated__/ArtistFollowButtonQuery.graphql"
33
import { ArtistFollowButton_artist$key } from "__generated__/ArtistFollowButton_artist.graphql"
4+
import { useAnalyticsContext } from "app/system/analytics/AnalyticsContext"
45
import { useFollowArtist } from "app/utils/mutations/useFollowArtist"
6+
import { ActionNames, ActionTypes, OwnerEntityTypes } from "app/utils/track/schema"
57
import { FC } from "react"
68
import { useLazyLoadQuery, graphql, useFragment } from "react-relay"
9+
import { useTracking } from "react-tracking"
710

811
interface ArtistFollowButtonProps {
912
artist: ArtistFollowButton_artist$key
@@ -12,6 +15,8 @@ interface ArtistFollowButtonProps {
1215
export const ArtistFollowButton: FC<ArtistFollowButtonProps> = ({ artist }) => {
1316
const data = useFragment(fragment, artist)
1417
const [commitMutation, isInFlight] = useFollowArtist()
18+
const { trackEvent } = useTracking()
19+
const analytics = useAnalyticsContext()
1520

1621
if (!data) {
1722
return null
@@ -24,6 +29,17 @@ export const ArtistFollowButton: FC<ArtistFollowButtonProps> = ({ artist }) => {
2429
store.get(data.internalID)?.setValue(!data.isFollowed, "isFollowed")
2530
},
2631
})
32+
33+
trackEvent({
34+
action_name: data.isFollowed ? ActionNames.ArtistUnfollow : ActionNames.ArtistFollow,
35+
action_type: ActionTypes.Success,
36+
owner_id: data.internalID,
37+
owner_slug: data.slug,
38+
owner_type: OwnerEntityTypes.Artist,
39+
context_screen_owner_id: analytics.contextScreenOwnerId,
40+
context_screen_owner_slug: analytics.contextScreenOwnerSlug,
41+
context_screen_owner_type: analytics.contextScreenOwnerType,
42+
})
2743
}
2844

2945
return <FollowButton isFollowed={data.isFollowed} onPress={handleOnPress} loading={isInFlight} />
@@ -33,6 +49,7 @@ const fragment = graphql`
3349
fragment ArtistFollowButton_artist on Artist {
3450
internalID @required(action: NONE)
3551
isFollowed @required(action: NONE)
52+
slug
3653
}
3754
`
3855

‎src/app/Components/PartnerFollowButton.tsx

+19
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
11
import { FollowButton } from "@artsy/palette-mobile"
22
import { PartnerFollowButtonQuery } from "__generated__/PartnerFollowButtonQuery.graphql"
33
import { PartnerFollowButton_partner$key } from "__generated__/PartnerFollowButton_partner.graphql"
4+
import { useAnalyticsContext } from "app/system/analytics/AnalyticsContext"
45
import { useFollowProfile } from "app/utils/mutations/useFollowProfile"
6+
import { ActionNames, ActionTypes, OwnerEntityTypes } from "app/utils/track/schema"
57
import { FC } from "react"
68
import { graphql, useFragment, useLazyLoadQuery } from "react-relay"
9+
import { useTracking } from "react-tracking"
710

811
interface PartnerFollowButtonProps {
912
partner: PartnerFollowButton_partner$key
1013
}
1114

1215
export const PartnerFollowButton: FC<PartnerFollowButtonProps> = ({ partner }) => {
16+
const analytics = useAnalyticsContext()
17+
const { trackEvent } = useTracking()
1318
const data = useFragment(fragment, partner)
1419
const { followProfile, isInFlight } = useFollowProfile({
1520
id: data?.profile.id ?? "",
@@ -23,6 +28,19 @@ export const PartnerFollowButton: FC<PartnerFollowButtonProps> = ({ partner }) =
2328

2429
const handleOnPress = () => {
2530
followProfile()
31+
32+
// TODO: action_name is always FollowPartner, should be FollowPartner or UnfollowPartner
33+
// I've checked other follow partner buttons, and the behavior is the same
34+
// Should be fixed in a separate PR
35+
trackEvent({
36+
action_name: ActionNames.FollowPartner,
37+
action_type: ActionTypes.Tap,
38+
owner_id: data.internalID,
39+
owner_type: OwnerEntityTypes.Partner,
40+
context_screen_owner_id: analytics.contextScreenOwnerId,
41+
context_screen_owner_slug: analytics.contextScreenOwnerSlug,
42+
context_screen_owner_type: analytics.contextScreenOwnerType,
43+
})
2644
}
2745

2846
return (
@@ -40,6 +58,7 @@ const fragment = graphql`
4058
profile @required(action: NONE) {
4159
id @required(action: NONE)
4260
internalID @required(action: NONE)
61+
slug
4362
isFollowed
4463
}
4564
}

‎src/app/Scenes/Artwork/Components/ArtworkCommercialButtons.tests.tsx

+25-11
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
1+
import { OwnerType } from "@artsy/cohesion"
12
import { fireEvent, screen, waitFor } from "@testing-library/react-native"
23
import { ArtworkCommercialButtons_Test_Query } from "__generated__/ArtworkCommercialButtons_Test_Query.graphql"
34
import { AuctionTimerState } from "app/Components/Bidding/Components/Timer"
45
import { ArtworkStoreProvider } from "app/Scenes/Artwork/ArtworkStore"
56
import { ArtworkFixture } from "app/__fixtures__/ArtworkFixture"
7+
import { AnalyticsContextProvider } from "app/system/analytics/AnalyticsContext"
68
import { navigate } from "app/system/navigation/navigate"
79
import { ArtworkInquiryStateProvider } from "app/utils/ArtworkInquiry/ArtworkInquiryStore"
810
import { extractNodes } from "app/utils/extractNodes"
@@ -19,17 +21,23 @@ describe("ArtworkCommercialButtons", () => {
1921
const partnerOffer = extractNodes(props.me!.partnerOffersConnection)[0]
2022

2123
return (
22-
<ArtworkInquiryStateProvider>
23-
<ArtworkStoreProvider>
24-
<Suspense fallback={null}>
25-
<ArtworkCommercialButtons
26-
partnerOffer={partnerOffer}
27-
artwork={props.artwork}
28-
me={props.me}
29-
/>
30-
</Suspense>
31-
</ArtworkStoreProvider>
32-
</ArtworkInquiryStateProvider>
24+
<AnalyticsContextProvider
25+
contextScreenOwnerId={ArtworkFixture.internalID}
26+
contextScreenOwnerSlug={ArtworkFixture.slug}
27+
contextScreenOwnerType={OwnerType.artwork}
28+
>
29+
<ArtworkInquiryStateProvider>
30+
<ArtworkStoreProvider>
31+
<Suspense fallback={null}>
32+
<ArtworkCommercialButtons
33+
partnerOffer={partnerOffer}
34+
artwork={props.artwork}
35+
me={props.me}
36+
/>
37+
</Suspense>
38+
</ArtworkStoreProvider>
39+
</ArtworkInquiryStateProvider>
40+
</AnalyticsContextProvider>
3341
)
3442
},
3543
query: graphql`
@@ -459,6 +467,7 @@ describe("ArtworkCommercialButtons", () => {
459467
[
460468
{
461469
"action": "tappedContactGallery",
470+
"context_module": undefined,
462471
"context_owner_id": "5b2b745e9c18db204fc32e11",
463472
"context_owner_slug": "andreas-rod-prinzknecht",
464473
"context_owner_type": "artwork",
@@ -491,6 +500,7 @@ describe("ArtworkCommercialButtons", () => {
491500
[
492501
{
493502
"action": "tappedContactGallery",
503+
"context_module": undefined,
494504
"context_owner_id": "5b2b745e9c18db204fc32e11",
495505
"context_owner_slug": "andreas-rod-prinzknecht",
496506
"context_owner_type": "artwork",
@@ -522,6 +532,7 @@ describe("ArtworkCommercialButtons", () => {
522532
[
523533
{
524534
"action": "tappedContactGallery",
535+
"context_module": undefined,
525536
"context_owner_id": "5b2b745e9c18db204fc32e11",
526537
"context_owner_slug": "andreas-rod-prinzknecht",
527538
"context_owner_type": "artwork",
@@ -555,6 +566,7 @@ describe("ArtworkCommercialButtons", () => {
555566
[
556567
{
557568
"action": "tappedContactGallery",
569+
"context_module": undefined,
558570
"context_owner_id": "5b2b745e9c18db204fc32e11",
559571
"context_owner_slug": "andreas-rod-prinzknecht",
560572
"context_owner_type": "artwork",
@@ -596,6 +608,7 @@ describe("ArtworkCommercialButtons", () => {
596608
[
597609
{
598610
"action": "tappedContactGallery",
611+
"context_module": undefined,
599612
"context_owner_id": "5b2b745e9c18db204fc32e11",
600613
"context_owner_slug": "andreas-rod-prinzknecht",
601614
"context_owner_type": "artwork",
@@ -633,6 +646,7 @@ describe("ArtworkCommercialButtons", () => {
633646
[
634647
{
635648
"action": "tappedContactGallery",
649+
"context_module": undefined,
636650
"context_owner_id": "5b2b745e9c18db204fc32e11",
637651
"context_owner_slug": "andreas-rod-prinzknecht",
638652
"context_owner_type": "artwork",

‎src/app/Scenes/Artwork/Components/CommercialButtons/ContactGalleryButton.tsx

+20-13
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { ActionType, OwnerType, TappedContactGallery } from "@artsy/cohesion"
1+
import { ActionType } from "@artsy/cohesion"
22
import { ButtonProps, Button } from "@artsy/palette-mobile"
33
import { ContactGalleryButton_artwork$key } from "__generated__/ContactGalleryButton_artwork.graphql"
44
import { MyProfileEditModal_me$key } from "__generated__/MyProfileEditModal_me.graphql"
55
import { useSendInquiry_me$key } from "__generated__/useSendInquiry_me.graphql"
66
import { InquiryModal } from "app/Scenes/Artwork/Components/CommercialButtons/InquiryModal"
7+
import { useAnalyticsContext } from "app/system/analytics/AnalyticsContext"
78
import {
89
ArtworkInquiryContext,
910
ArtworkInquiryStateProvider,
@@ -29,6 +30,7 @@ export const ContactGalleryButton: React.FC<ContactGalleryButtonProps> = ({
2930
const artworkData = useFragment(artworkFragment, artwork)
3031

3132
const { trackEvent } = useTracking()
33+
const analytics = useAnalyticsContext()
3234

3335
return (
3436
<ArtworkInquiryStateProvider>
@@ -38,9 +40,11 @@ export const ContactGalleryButton: React.FC<ContactGalleryButtonProps> = ({
3840
onPress={() => {
3941
trackEvent(
4042
tracks.trackTappedContactGallery(
41-
artworkData.internalID,
42-
artworkData.slug,
43-
artworkData.collectorSignals
43+
analytics.contextScreenOwnerId ?? "",
44+
analytics.contextScreenOwnerSlug ?? "",
45+
analytics.contextScreenOwnerType ?? "",
46+
artworkData.collectorSignals,
47+
analytics.contextModule
4448
)
4549
)
4650
dispatch({ type: "setInquiryModalVisible", payload: true })
@@ -57,24 +61,27 @@ export const ContactGalleryButton: React.FC<ContactGalleryButtonProps> = ({
5761
)
5862
}
5963

64+
// TODO: I temporarily removed TappedContactGallery type because it lacks the `context_owner_type` and `context_module` fields
65+
// I should add them there first and bring back the time
6066
const tracks = {
6167
trackTappedContactGallery: (
62-
artworkId: string,
63-
artworkSlug: string,
64-
collectorSignals: CollectorSignals
65-
): TappedContactGallery => ({
68+
contextOwnerId: string,
69+
contextOwnerSlug: string,
70+
contextOwnerType: string,
71+
collectorSignals: CollectorSignals,
72+
contextModule?: string
73+
) => ({
6674
action: ActionType.tappedContactGallery,
67-
context_owner_type: OwnerType.artwork,
68-
context_owner_id: artworkId,
69-
context_owner_slug: artworkSlug,
75+
context_module: contextModule,
76+
context_owner_type: contextOwnerType,
77+
context_owner_id: contextOwnerId,
78+
context_owner_slug: contextOwnerSlug,
7079
...getArtworkSignalTrackingFields(collectorSignals),
7180
}),
7281
}
7382

7483
const artworkFragment = graphql`
7584
fragment ContactGalleryButton_artwork on Artwork {
76-
internalID
77-
slug
7885
collectorSignals {
7986
primaryLabel
8087
auction {

0 commit comments

Comments
 (0)