Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner. #8694

techanvil · 2024-05-10T18:17:22Z

Summary

Addresses issue:

Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner #8131

Relevant technical choices

As discussed in a recent standup, I realised during implementation that reusing the partial data infrastructure as described in the IB is not such a good fit here, so instead I've taken the approach of retrieving a regular Analytics report for the 90 day range to determine whether data is available. This does mean we can't take advantage of a cached data availability state which is available on page load in order to avoid layout shifts when showing the banner; I will create a followup issue to investigate further options on that front.

PR Author Checklist

My code is tested and passes existing unit tests.
My code has an appropriate set of unit tests which all pass.
My code is backward-compatible with WordPress 5.2 and PHP 7.4.
My code follows the WordPress coding standards.
My code has proper inline documentation.
I have added a QA Brief on the issue linked above.
I have signed the Contributor License Agreement (see https://cla.developers.google.com/).

Do not alter or remove anything below. The following sections will be managed by moderators only.

Code Reviewer Checklist

Run the code.
Ensure the acceptance criteria are satisfied.
Reassess the implementation with the IB.
Ensure no unrelated changes are included.
Ensure CI checks pass.
Check Storybook where applicable.
Ensure there is a QA Brief.

Merge Reviewer Checklist

Ensure the PR has the correct target branch.
Double-check that the PR is okay to be merged.
Ensure the corresponding issue has a ZenHub release assigned.
Add a changelog message to the issue.

Pending additional conditionality.

…ion creation.

Outline the remaining tests.

…ted audiences.

…created audiences.

assets/js/modules/analytics-4/datastore/audiences.js

assets/js/modules/analytics-4/datastore/audiences.test.js

github-actions · 2024-05-10T18:29:50Z

Build files for 51540e5 have been deleted.

github-actions · 2024-05-10T18:30:58Z

Size Change: +24.5 kB (+1.7%)

Total Size: 1.46 MB

Filename	Size	Change
`./dist/assets/css/googlesitekit-admin-css-********************.min.css`	53.8 kB	+56 B (+0.1%)
`./dist/assets/js/34-********************.js`	3.12 kB	+1 B (+0.03%)
`./dist/assets/js/contact-form-7-********************.js`	646 B	+40 B (+6.6%)	🔍
`./dist/assets/js/googlesitekit-activation-********************.js`	23.9 kB	+50 B (+0.21%)
`./dist/assets/js/googlesitekit-ad-blocking-recovery-********************.js`	58.1 kB	+678 B (+1.18%)
`./dist/assets/js/googlesitekit-adminbar-********************.js`	34.5 kB	+353 B (+1.03%)
`./dist/assets/js/googlesitekit-api-********************.js`	10.1 kB	+36 B (+0.36%)
`./dist/assets/js/googlesitekit-components-gm2-********************.js`	5.88 kB	+1 B (+0.02%)
`./dist/assets/js/googlesitekit-components-gm3-********************.js`	10 kB	+3 B (+0.03%)
`./dist/assets/js/googlesitekit-data-********************.js`	2.18 kB	+5 B (+0.23%)
`./dist/assets/js/googlesitekit-datastore-forms-********************.js`	9.14 kB	+38 B (+0.42%)
`./dist/assets/js/googlesitekit-datastore-location-********************.js`	2.09 kB	+1 B (+0.05%)
`./dist/assets/js/googlesitekit-datastore-site-********************.js`	19.9 kB	+744 B (+3.89%)
`./dist/assets/js/googlesitekit-datastore-ui-********************.js`	10.1 kB	+40 B (+0.4%)
`./dist/assets/js/googlesitekit-datastore-user-********************.js`	25.5 kB	+692 B (+2.79%)
`./dist/assets/js/googlesitekit-entity-dashboard-********************.js`	72.3 kB	+1.11 kB (+1.55%)
`./dist/assets/js/googlesitekit-main-dashboard-********************.js`	108 kB	+12.3 kB (+12.87%)	⚠️
`./dist/assets/js/googlesitekit-modules-ads-********************.js`	26.8 kB	+2.59 kB (+10.69%)	⚠️
`./dist/assets/js/googlesitekit-modules-adsense-********************.js`	111 kB	+437 B (+0.4%)
`./dist/assets/js/googlesitekit-modules-analytics-4-********************.js`	111 kB	+855 B (+0.78%)
`./dist/assets/js/googlesitekit-modules-********************.js`	21.7 kB	+51 B (+0.24%)
`./dist/assets/js/googlesitekit-modules-pagespeed-insights-********************.js`	22.4 kB	+48 B (+0.21%)
`./dist/assets/js/googlesitekit-modules-search-console-********************.js`	58.1 kB	+27 B (+0.05%)
`./dist/assets/js/googlesitekit-modules-tagmanager-********************.js`	30.5 kB	+367 B (+1.22%)
`./dist/assets/js/googlesitekit-settings-********************.js`	60.4 kB	+692 B (+1.16%)
`./dist/assets/js/googlesitekit-splash-********************.js`	72.5 kB	+834 B (+1.16%)
`./dist/assets/js/googlesitekit-user-input-********************.js`	47.6 kB	+756 B (+1.61%)
`./dist/assets/js/googlesitekit-vendor-********************.js`	317 kB	+7 B (0%)
`./dist/assets/js/googlesitekit-widgets-********************.js`	33.7 kB	+373 B (+1.12%)
`./dist/assets/js/googlesitekit-wp-dashboard-********************.js`	60 kB	-110 B (-0.18%)
`./dist/assets/js/optin-monster-********************.js`	669 B	+35 B (+5.52%)	🔍
`./dist/assets/js/runtime-********************.js`	1.3 kB	-4 B (-0.31%)
`./dist/assets/js/woocommerce-********************.js`	655 B	+42 B (+6.85%)	🔍
`./dist/assets/js/wpforms-********************.js`	634 B	+39 B (+6.55%)	🔍
`./dist/assets/js/mailchimp-********************.js`	632 B	+632 B (new file)	🆕
`./dist/assets/js/popup-maker-********************.js`	634 B	+634 B (new file)	🆕

ℹ️ View Unchanged

Filename	Size
`./dist/assets/css/googlesitekit-adminbar-css-********************.min.css`	11.2 kB
`./dist/assets/css/googlesitekit-authorize-application-css-********************.min.css`	731 B
`./dist/assets/css/googlesitekit-wp-dashboard-css-********************.min.css`	7.48 kB
`./dist/assets/js/29-********************.js`	2.8 kB
`./dist/assets/js/30-********************.js`	2.28 kB
`./dist/assets/js/31-********************.js`	3.72 kB
`./dist/assets/js/32-********************.js`	929 B
`./dist/assets/js/33-********************.js`	888 B
`./dist/assets/js/analytics-advanced-tracking-********************.js`	778 B
`./dist/assets/js/googlesitekit-i18n-********************.js`	3.92 kB
`./dist/assets/js/googlesitekit-polyfills-********************.js`	379 B

_{compressed-size-action}

assets/sass/components/dashboard/_googlesitekit-subtle-notification.scss

hussain-t

Excellent work, @techanvil 🎖️

I've left a few minor comments. Could you take a look?

...onents/audience-segmentation/dashboard/AudienceSegmentationSetupSuccessSubtleNotification.js

assets/sass/components/dashboard/_googlesitekit-subtle-notification.scss

assets/js/modules/analytics-4/datastore/audiences.test.js

Co-authored-by: Hussain Thajutheen <hussain.thajutheen@10up.com>

…d before use.

...analytics-4/components/audience-segmentation/dashboard/AudienceSegmentationSetupCTAWidget.js

hussain-t

Excellent work, @techanvil. LGTM 🥇 👍

kuasha420

Thank you @techanvil, amazing work here. LGTM. 🎉

techanvil added 24 commits May 10, 2024 10:39

Set configuredAudiences to null by default.

bb6d949

Show the AudienceSegmentationSetupCTAWidget on the dashboard.

61f0d81

Pending additional conditionality.

Add enableAudienceGroups action, pending audience and custom dimens…

b5cd89b

…ion creation.

Add Site Kit audience definitions.

da438b6

Add support for custom report args to hasZeroData().

1abcf7e

Create audiences and custom dimension in enableAudienceGroups.

da2e77f

Rename enableAudienceGroups -> enableAudienceGroup.

0f4f875

Show the Audience Segmentation Setup CTA Widget on the main dashboard.

209c0fa

Address a couple of minor issues flagged on PR #8606 post-merge.

d8110e2

Add tests for hasZeroData() with custom report args.

dd5bbb6

Add AudienceSegmentationSetupSuccessSubtleNotification component.

66505c3

Add JSDoc for function.

6640f7a

Minor tweaks.

fa9bbc2

Fix subtle notification button styling.

37beec1

Add JSDoc for *enableAudienceGroup() action.

463bfb6

Rename variable.

62e8dc0

Add first test for *enableAudienceGroup() action.

75c2b82

Outline the remaining tests.

Add test for populating configuredAudiences with user audiences.

6c5a784

Extend tests for populating configuredAudiences with user audiences.

b397855

Add test for populating configuredAudiences with pre-existing SK-crea…

b4a50e0

…ted audiences.

Extend tests for populating configuredAudiences with pre-existing SK-…

3355bd4

…created audiences.

Add test for creating SK-created audiences.

5c2b1e6

When creating custom dimension set gathering data state and resync.

1f863f2

Add test for creating custom dimension required for audiences.

5ea2d61

techanvil commented May 10, 2024

View reviewed changes

assets/js/modules/analytics-4/datastore/audiences.js Show resolved Hide resolved

techanvil commented May 10, 2024

View reviewed changes

assets/js/modules/analytics-4/datastore/audiences.test.js Show resolved Hide resolved

Fix test setup.

68920f2

Fix story & VRTs.

8631c73

techanvil added 2 commits May 10, 2024 23:01

Tweak comments.

bc10290

Fix typo.

0f1fcc8

techanvil commented May 10, 2024

View reviewed changes

assets/sass/components/dashboard/_googlesitekit-subtle-notification.scss Show resolved Hide resolved

techanvil commented May 10, 2024

View reviewed changes

assets/sass/components/dashboard/_googlesitekit-subtle-notification.scss Outdated Show resolved Hide resolved

techanvil added 4 commits May 10, 2024 23:23

Add VRT reference images.

0ede652

Merge branch 'develop' into enhancement/8131-setup-banner-happy-path.

5f102b2

Update VRT reference images.

1bcffda

Move the enableAudienceGroup() action to the audiences store.

1e4d8fc

hussain-t requested changes May 21, 2024

View reviewed changes

techanvil and others added 6 commits May 21, 2024 17:37

Use SCSS variable rather than literal value.

a30644e

Co-authored-by: Hussain Thajutheen <hussain.thajutheen@10up.com>

Remove copy/pasted comment.

1c0969d

Move functions before variable definitions, ensure function is define…

0bced28

…d before use.

Rename test helper functions.

1bda6ea

Reuse custom dimension definition constant in tests.

f8c17fc

Prevent banner from displaying when audience settings are still loading.

51540e5

techanvil commented May 21, 2024

View reviewed changes

...analytics-4/components/audience-segmentation/dashboard/AudienceSegmentationSetupCTAWidget.js Show resolved Hide resolved

hussain-t approved these changes May 22, 2024

View reviewed changes

kuasha420 approved these changes May 22, 2024

View reviewed changes

kuasha420 merged commit 4943677 into develop May 22, 2024
28 of 29 checks passed

kuasha420 deleted the enhancement/8131-setup-banner-happy-path branch May 22, 2024 17:57

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner. #8694

Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner. #8694

techanvil commented May 10, 2024 •

edited by hussain-t

github-actions bot commented May 10, 2024 •

edited

github-actions bot commented May 10, 2024 •

edited

hussain-t left a comment

hussain-t left a comment

kuasha420 left a comment

Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner. #8694

Implement the happy path for creating audiences and the custom dimension via the Setup CTA Banner. #8694

Conversation

techanvil commented May 10, 2024 • edited by hussain-t

Summary

Relevant technical choices

PR Author Checklist

Code Reviewer Checklist

Merge Reviewer Checklist

github-actions bot commented May 10, 2024 • edited

github-actions bot commented May 10, 2024 • edited

hussain-t left a comment

Choose a reason for hiding this comment

hussain-t left a comment

Choose a reason for hiding this comment

kuasha420 left a comment

Choose a reason for hiding this comment

techanvil commented May 10, 2024 •

edited by hussain-t

github-actions bot commented May 10, 2024 •

edited

github-actions bot commented May 10, 2024 •

edited