chore: split settings component into multiple components for sections #9979
Comments
7 tasks
sethkfman
pushed a commit
that referenced
this issue
Jun 13, 2024
## **Description** ### Onboarding phase - prevent metametrics API to be called multiple times for identical actions: - group traits addition - refactor events into a consolidated one - remove useless trackEvent in places where it would never be triggered anyway (when metrics are disabled) - add condition to prevent useless data processing when metrics are disabled - move async work in `InteractionManager.runAfterInteractions` as hook doesn't do it by default on traits addition. Move the event too even if handled already to ensure consistency with traits addition. - number of events reduced from 11 to 7 when marketing is opted-in. - making checkbox text touchable to check the box - add unit tests and update snapshot ### Settings screen - extract a section component to make the section code testable as otherwise you have to mock everything and it conflicts with code under test but keep MetaMetrics toggle and marketing toggle together as they have been designed to work together closely. - add traits when toggling marketing on/off - rework MetaMetrics and Marketing switches interaction logic - unit test on all the section and switches interactions > [!NOTE] > This is a rework of #9687. > I had to extract the settings section as a component for testing to be possible. > I could have split it further into MetaMEtrics seciton and Marketing data section. > but this would have required more work to make sure both components keep their linked behaviours when toggling switches. > however, this is a possible improvement. I consider we should work on this on a full settings sections refactoring, see issue #9979 ## **Related issues** Fixes: #9862 ## **Manual testing steps** - Same as for #9687 - No UI change. - all changes on event tracking and identify are unit tested. ## **Screenshots/Recordings** <!-- If applicable, add screenshots and/or recordings to visualize the before and after of your change. --> ### **Before** #### Onboaring phase When not checking marketing checkbox ``` INFO TRACK event saved {"event": "Terms of Use Shown", "properties": {}, "type": "track"} INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "ff0d83a8-9c1e-4897-b1b1-1b5e5e23ed42"} INFO TRACK event saved {"event": "Wallet Setup Started", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt In", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt In", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Welcome Message Viewed", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Onboarding Started", "properties": {}, "type": "track"} INFO Sent 1 events INFO Sent 7 events ``` and Mixpanel view <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/62edda42-bbe4-45e1-8a69-239ed6f00596"> When checking marketing checkbox ``` INFO TRACK event saved {"event": "Terms of Use Shown", "properties": {}, "type": "track"} INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "d1b09ff0-b550-4d7f-a894-1cdc13609473"} INFO TRACK event saved {"event": "Wallet Setup Started", "properties": {}, "type": "track"} INFO IDENTIFY event saved {"traits": {"has_marketing_consent": true, "is_metrics_opted_in": true}, "type": "identify", "userId": "d1b09ff0-b550-4d7f-a894-1cdc13609473"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "is_metrics_opted_in": true, "location": "onboarding_metametrics"}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "is_metrics_opted_in": true, "location": "onboarding_metametrics"}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt In", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt In", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Welcome Message Viewed", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Onboarding Started", "properties": {}, "type": "track"} INFO Sent 1 events INFO Sent 11 events ``` and Mixpanel view: <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/82af1510-73db-40a2-b7e1-4c047c9f1fa3"> #### Settings screen Missing marketing setting events and user traits: ``` INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "5e9545ed-84b3-4223-801e-d70fee12e10d"} INFO TRACK event saved {"event": "Views Security & Privacy", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt in", "updated_after_onboarding": true}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"analytics_option_selected": "Metrics Opt in", "updated_after_onboarding": true}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Views Security & Privacy", "properties": {}, "type": "track"} INFO Sent 5 events INFO Sent 1 events ``` ### **After** #### Onboaring phase When not checking marketing checkbox ``` INFO TRACK event saved {"event": "Terms of Use Shown", "properties": {}, "type": "track"} INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "is_metrics_opted_in": true, "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "19f4001c-68a6-4b62-9f1d-d8f6ff92718e"} INFO TRACK event saved {"event": "Wallet Setup Started", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"is_metrics_opted_in": true, "location": "onboarding_metametrics", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"is_metrics_opted_in": true, "location": "onboarding_metametrics", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Welcome Message Viewed", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Onboarding Started", "properties": {}, "type": "track"} INFO Sent 1 events INFO Sent 7 events ``` and Mixpanel view: <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/d619d77f-e486-4e3c-b151-9151248683ae"> When checking marketing checkbox ``` INFO TRACK event saved {"event": "Terms of Use Shown", "properties": {}, "type": "track"} INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "has_marketing_consent": true, "is_metrics_opted_in": true, "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "fb576f56-3e5e-4df8-9a40-55d16ae5b16e"} INFO TRACK event saved {"event": "Wallet Setup Started", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "is_metrics_opted_in": true, "location": "onboarding_metametrics", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "is_metrics_opted_in": true, "location": "onboarding_metametrics", "updated_after_onboarding": false}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Welcome Message Viewed", "properties": {}, "type": "track"} INFO TRACK event saved {"event": "Onboarding Started", "properties": {}, "type": "track"} INFO Sent 1 events INFO Sent 7 events ``` and mixpanel view: <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/e8f21057-afd0-489f-94e3-95290f84c8a6"> #### Settings screen ``` INFO IDENTIFY event saved {"traits": {"Batch account balance requests": "ON", "Enable OpenSea API": "ON", "NFT Autodetection": "OFF", "Theme": "light", "applicationVersion": "7.23.0", "currentBuildNumber": "1333", "deviceBrand": "Apple", "is_metrics_opted_in": true, "operatingSystemVersion": "17.5", "platform": "ios", "security_providers": "blockaid", "token_detection_enable": "ON"}, "type": "identify", "userId": "5e9545ed-84b3-4223-801e-d70fee12e10d"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"is_metrics_opted_in": true, "updated_after_onboarding": true}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"is_metrics_opted_in": true, "updated_after_onboarding": true}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO Sent 4 events INFO IDENTIFY event saved {"traits": {"has_marketing_consent": true}, "type": "identify", "userId": "5e9545ed-84b3-4223-801e-d70fee12e10d"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "location": "settings"}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {"has_marketing_consent": true, "location": "settings"}, "type": "track"} INFO TRACK event saved {"event": "Analytics Preference Selected", "properties": {}, "type": "track"} INFO Sent 4 events ``` and mixpanel view: <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/6e9ccdc2-96c3-459b-a6e1-61b06a21608b"> <img width="300" alt="image" src="https://github.com/MetaMask/metamask-mobile/assets/4677568/972eb915-e3d9-4a86-879a-a7d28df9286c"> ## **Pre-merge author checklist** - [x] I’ve followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile Coding Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability - [x] I’ve included tests if applicable - [x] I’ve documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] I’ve applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What is this about?
See note on #9905
Scenario
No response
Design
No response
Technical Details
No response
Threat Modeling Framework
No response
Acceptance Criteria
No response
Stakeholder review needed before the work gets merged
References
See note on #9905
The text was updated successfully, but these errors were encountered: