feat: implement activity dot indicator experiment #11319

anandaroop · 2024-12-19T22:47:39Z

This PR resolves ONYX-1465

Description

Sets up the activity dot experiment

Control	Variant B	Variant C

TODO:

PR Checklist

I have tested my changes on iOS and Android.
I hid my changes behind a feature flag, or they don't need one.
I have included screenshots or videos, or I have not changed the UI.
I have added tests, or my changes don't require any.
I added an app state migration, or my changes do not require one.
I have documented any follow-up work that this PR will require, or it does not require any.
I have added a changelog entry below, or my changes do not require one.

To the reviewers 👀

I would like at least one of the reviewers to run this PR on the simulator or device.

Changelog updates

Cross-platform user-facing changes

Add experiment for activity indicator dots

iOS user-facing changes

Android user-facing changes

Dev changes

Need help with something? Have a look at our docs, or get in touch with us.

And define a payload that allows us to force the dots to display (for QA)

Strangely, I don't see how the profile icon's dot ever gets requested so I've added the ability to force it here

ArtsyOpenSource · 2024-12-30T23:57:23Z

This PR contains the following changes:

Cross-platform user-facing changes (Add experiment for activity indicator dots - anandaroop)

Generated by 🚫 dangerJS against 9b0dd0b

src/app/Navigation/utils/useBottomTabsBadges.ts

src/app/Scenes/HomeView/Components/ActivityIndicator.tsx

src/app/Scenes/HomeView/HomeView.tsx

dariakoko · 2024-12-31T09:52:52Z

src/app/utils/experiments/experiments.ts

+    fallbackEnabled: true,
+    fallbackVariant: "control",
+    variantSuggestions: ["control", "variant-b", "variant-c"],
+    payloadSuggestions: ['{"forceDots": "true"}', '{"forceDots": "false"}'],


Hmmm is is okay to have 3 variant and 2 payload suggestions?

Yep, I believe the payload is just "additional" information that can be used in the rendering logic. That's what I'm utilizing to force the display of the activity dots for QA purposes.

dariakoko · 2024-12-31T11:23:33Z

src/app/utils/experiments/useActivityDotExperiment.ts

+  // Dev Menu helper to force visible dots for testing during QA
+  const forceDots = Boolean(payload && JSON.parse(payload)?.forceDots === "true")
+
+  const color: Color = enabled ? (variant === "variant-b" ? "red50" : "blue100") : "blue100"


I think for this experiment it is fine as it doesn't touch a lot of functionality, but if it was a bigger experiment we could also use a feature flag just to make sure if something goes wrong with the implementation of the experiment we can always fall back.

The Enabled toggle in Unleash effectively gives us that ability, no? That's why this logic on L14 accounts for enabled.

Yes, if the implementation of the experiment is correct. For small experiments it should be fine not to use a ff.
I just wanted to spread the knowledge @olerichter00 shared with me while working on the Artwork card redesign - for that experiment it was recommended to use the feature flag because the experiment's logic was more complex and used in a lot of components. So if there was a mistake that affects the experiment's results we would disable the experiment and the feature flag, fix the issue and enable the ff and the experiment again
I hope it makes sense 😅

An additional Echo feature flag can be useful when implementing a feature that takes a long time across multiple app releases. In this case, enabling the flag in Unleash would also activate the feature for app versions that only have a work-in-progress state.

If the feature is ready within a single release cycle, the extra flag is unnecessary.

anandaroop

Whoops I wrote, but forgot to submit, these comments before requesting review 🙈

anandaroop · 2024-12-30T23:24:04Z

src/app/utils/experiments/useActivityDotExperiment.ts

This hook encapsulates the color calculation and other experiment-related features to simplify the invocation of the experiment at the various call sites.

anandaroop · 2024-12-30T23:27:54Z

src/app/utils/experiments/experiments.ts

+    variantSuggestions: ["control", "variant-b", "variant-c"],
+    payloadSuggestions: ['{"forceDots": "true"}', '{"forceDots": "false"}'],


The payload suggestions here will allow testers to force the activity dots to display, as a convenience during QA (otherwise every tester would have to tediously ensure the existence of various kinds of unseen notifications and messages.)

anandaroop · 2024-12-30T23:34:11Z

src/app/Scenes/HomeView/HomeView.tsx

+  const { trackExperiment: trackActvityDotExperiment } = useActivityDotExperiment()
+
+  useEffect(() => {
+    trackActvityDotExperiment()
+  }, [])


We fire the experiment_viewed event once per session this way.

anandaroop · 2024-12-30T23:36:01Z

src/app/Navigation/utils/useBottomTabsBadges.ts

+      case "profile": {
+        if (forceDots) {
          tabsBadges[tab] = {
-            tabBarBadge: unreadConversationsCount,
+            tabBarBadge: "",
            tabBarBadgeStyle: {
-              backgroundColor: color("red100"),
+              ...visualClueStyles,
            },
          }
        }


The profile branch of this switch statement was missing, and thus the blue profile dot is currently unable to be displayed.

After discussing with @gkartalis I think that may have been a deliberate decision, in which case we can drop this case "profile" branch as well. But in the meantime this allows us to force the dot to display during QA.

@MounirDhahri this^ was our finding, in case you have any further insight on this — is the bottom nav profile icon expected to display a dot after all?

- Use new var instead of mutating destructured var from props - Avoid 'px' in positioning props

dariakoko

Thanks for addressing the comments, looks good!

MounirDhahri

Awesome! thanks!

MounirDhahri · 2025-01-02T14:27:58Z

src/app/utils/experiments/experiments.ts

+    variantSuggestions: ["control", "variant-b", "variant-c"],
+    payloadSuggestions: ['{"forceDots": "true"}', '{"forceDots": "false"}'],


anandaroop self-assigned this Dec 19, 2024

artsy-peril bot added the Jira Synced label Dec 20, 2024

anandaroop force-pushed the anandaroop/ONYX-1465-dot-experiment branch from 7e0134c to 7ce2bb9 Compare December 30, 2024 20:00

anandaroop added 6 commits December 30, 2024 16:44

chore: bump palette-mobile to get latest colors and VisualClue

5c268eb

feat: define the experiment

d224816

And define a payload that allows us to force the dots to display (for QA)

feat: add a hook for convenience

494a3a7

feat: implement the experiment on the activity panel bell

9f9a716

feat: update red for inbox indicator

154a0e4

feat: add variants to bottom tab

222eb38

Strangely, I don't see how the profile icon's dot ever gets requested so I've added the ability to force it here

anandaroop force-pushed the anandaroop/ONYX-1465-dot-experiment branch 2 times, most recently from 3b6fcb9 to 3114cb9 Compare December 30, 2024 22:39

anandaroop added 2 commits December 30, 2024 17:42

refactor: move color calculation into hook

9b733a1

feat: track the activity dot experiment, once per session

ad75562

anandaroop force-pushed the anandaroop/ONYX-1465-dot-experiment branch from 3114cb9 to ad75562 Compare December 30, 2024 22:45

anandaroop marked this pull request as ready for review December 30, 2024 23:55

anandaroop requested review from dariakoko and MounirDhahri December 30, 2024 23:55

dariakoko reviewed Dec 31, 2024

View reviewed changes

anandaroop commented Dec 31, 2024

View reviewed changes

feat: address PR feedback

9b0dd0b

- Use new var instead of mutating destructured var from props - Avoid 'px' in positioning props

dariakoko approved these changes Jan 2, 2025

View reviewed changes

MounirDhahri approved these changes Jan 2, 2025

View reviewed changes

anandaroop merged commit a04dab7 into main Jan 2, 2025
7 checks passed

anandaroop deleted the anandaroop/ONYX-1465-dot-experiment branch January 2, 2025 15:04

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: implement activity dot indicator experiment #11319

feat: implement activity dot indicator experiment #11319

anandaroop commented Dec 19, 2024 •

edited

Loading

ArtsyOpenSource commented Dec 30, 2024 •

edited

Loading

dariakoko Dec 31, 2024

anandaroop Dec 31, 2024

dariakoko Dec 31, 2024

anandaroop Dec 31, 2024

dariakoko Jan 2, 2025

olerichter00 Jan 3, 2025

anandaroop left a comment

anandaroop Dec 30, 2024

anandaroop Dec 30, 2024

MounirDhahri Jan 2, 2025

anandaroop Dec 30, 2024

anandaroop Dec 30, 2024

anandaroop Jan 3, 2025

dariakoko left a comment

MounirDhahri left a comment

MounirDhahri Jan 2, 2025

		variantSuggestions: ["control", "variant-b", "variant-c"],
		payloadSuggestions: ['{"forceDots": "true"}', '{"forceDots": "false"}'],

feat: implement activity dot indicator experiment #11319

feat: implement activity dot indicator experiment #11319

Conversation

anandaroop commented Dec 19, 2024 • edited Loading

Description

PR Checklist

To the reviewers 👀

Changelog updates

Cross-platform user-facing changes

iOS user-facing changes

Android user-facing changes

Dev changes

ArtsyOpenSource commented Dec 30, 2024 • edited Loading

This PR contains the following changes:

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

anandaroop left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dariakoko left a comment

Choose a reason for hiding this comment

MounirDhahri left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

anandaroop commented Dec 19, 2024 •

edited

Loading

ArtsyOpenSource commented Dec 30, 2024 •

edited

Loading