Ensure the "Top content" CTA for creating the custom dimension appears when the corresponding report error shows the custom dimension is missing

[techanvil]

Feature Description

The Audience Tile's "Top content" metric area has a CTA for creating the googlesitekit_post_type custom dimension if it doesn't exist.

However, it doesn't have logic in place to determine if the custom dimension doesn't exist when requesting the report for the metric. At present it's reliant on the list of available custom dimensions being synced somewhere, which only happens during Audience Segmentation setup, or in the Key Metrics feature.

We should ensure that, if the report for the "Top content" metric returns an error because the custom dimension doesn't exist, the list of custom dimensions is resynced so the tile will immediately know that the dimension is missing and show the CTA to create it.

---

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

Acceptance criteria

• If the reports for the Audience Tile's "Top content" metric return an error because the custom dimension doesn't exist:
  • For an authenticated user:
  • The list of available custom dimensions should be resynced.
  • The Audience Tiles should remain in the loading state while the resync is happening.
  • Once the resync has finished the populated tiles should show with the CTA for creating the googlesitekit_post_type present in the "Top content" metric area (already implemented via https://github.com/google/site-kit-wp/issues/8153).
  • For a view-only user, the "Top content" metric area should not be displayed.
  • This is because a view-only user doesn't have permission to sync custom dimensions, and we are not going to show the "Top content" metric to them if the custom dimension doesn't exist (see https://github.com/google/site-kit-wp/issues/8175), so the logical thing to do here is not to display the metric area if the custom dimension state can't be determined.

Implementation Brief

Add Missing Custom Dimension to Top Content Report

• [ ] Add the googlesitekit_post_type dimension filter to the top content report options:

  dimensionFilters: { 
  'customEvent:googlesitekit_post_type': { 
      filterType: 'stringFilter', 
      matchType: 'EXACT', 
      value: 'post', 
  }, 
  }, 

  https://github.com/google/site-kit-wp/blob/119747b9e3be9bb8310faec37b7ea41c6b4ea89f/assets/js/modules/analytics-4/hooks/useAudienceTilesReports.js#L322-L329 https://github.com/google/site-kit-wp/blob/119747b9e3be9bb8310faec37b7ea41c6b4ea89f/assets/js/modules/analytics-4/hooks/useAudienceTilesReports.js#L346-L353

Authenticated User Context

• [ ] Update assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTiles.js (note the new useAudienceTilesReports custom hook merged in #8144):
  • [ ] Add a useEffect with topContentReportErrors as a dependency.
    • [ ] Check if the topContentReportErrors contains any invalid custom dimension errors using the .find prototype, and use the isInvalidCustomDimensionError util to identify this error type.
    • [ ] If an invalid custom dimension error exists, dispatch the action fetchSyncAvailableCustomDimensions.
  • [ ] Create a new boolean constant isSyncingAvailableCustomDimensions containing the value of the isFetchingSyncAvailableCustomDimensions selector: https://github.com/google/site-kit-wp/blob/56feb1f6ca227cc9fc6da3511a96fb2f4bf9d3b0/assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTile/AudienceTilePagesMetric.js#L94-L96
    • [ ] Update the loading statement to include isSyncingAvailableCustomDimensions: https://github.com/google/site-kit-wp/blob/41f0bbaec9736ba334cccc7b469ce1a5e2cdfc71/assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTiles.js#L419-L427
  • [ ] Filter out invalid custom dimension errors from topCitiesReportErrors here, using the isInvalidCustomDimensionError util, so that the Top Cities Audience Tile will be rendered if there is only an invalid custom dimension error: https://github.com/google/site-kit-wp/blob/b2d47c854a1c23eaba82690c88812972ba730bed/assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTiles.js#L320

View-Only Context

• [ ] Update assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTile/index.js, use the getErrorForSelector selector to get any errors for the top content report for the audienceResourceName of the current tile.
  • [ ] Update this conditional block to not render the Top Cities metric if the user is in the view-only context and the there is a invalid custom dimension error for the Top Cities report: https://github.com/google/site-kit-wp/blob/b2d47c854a1c23eaba82690c88812972ba730bed/assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTile/index.js#L261

Test Coverage

• Update the tests that fail due to the addition of the custom dimension filter for the Top Content queries.
• Create a VRT when the tile is in the view-only context with an invalid custom dimension error for the Top Cities report.

QA Brief

Changelog entry

[techanvil]

Hi @benbowler, thanks for drafting this IB. A couple of points:

• Thinking about https://github.com/google/site-kit-wp/issues/8175, I've realised there's an edge case for view-only users that we should handle in this issue, although it wasn't explicitly captured in the AC. I hope you don't mind, but I've amended the AC to include this.

... selectors to monitor syncAvailableCustomDimensions selector/resolver like so:

• As we're dispatching the fetchSyncAvailableCustomDimensions() action, this doesn't seem right. We'll probably want to use isFetchingSyncAvailableCustomDimensions(), e.g.:

https://github.com/google/site-kit-wp/blob/56feb1f6ca227cc9fc6da3511a96fb2f4bf9d3b0/assets/js/modules/analytics-4/components/audience-segmentation/dashboard/AudienceTilesWidget/AudienceTile/AudienceTilePagesMetric.js#L94-L96

[techanvil]

Hi @benbowler, thanks for updating the IB. A few more points:

For the view-only context:

• We shouldn't need to check isSyncingAvailableCustomDimensions in the AudienceTile component because the AudienceTileLoading component will be rendered instead due to including this value in the loading condition.
• We need to filter out invalid custom dimension errors from the list that determines the individualTileErrors value, in order to avoid showing the whole tile in the error state, but still need to flag that there was an invalid custom dimension error to the AudienceTile so it can avoid rendering the "Top content" metric area.

More fundamentally, though - I've noticed the googlesitekit_post_type custom dimension is actually missing from the "Top content" report options:

https://github.com/google/site-kit-wp/blob/119747b9e3be9bb8310faec37b7ea41c6b4ea89f/assets/js/modules/analytics-4/hooks/useAudienceTilesReports.js#L322-L329

https://github.com/google/site-kit-wp/blob/119747b9e3be9bb8310faec37b7ea41c6b4ea89f/assets/js/modules/analytics-4/hooks/useAudienceTilesReports.js#L346-L353

It needs to be added as a dimension filter, like we do here, but with value: 'post':

https://github.com/google/site-kit-wp/blob/119747b9e3be9bb8310faec37b7ea41c6b4ea89f/assets/js/modules/analytics-4/components/widgets/PopularProductsWidget.js#L79-L85

This will be needed for this issue to be complete and testable, so we should include the fix here too. There's likely to be a number of tests that need updating as a result which we should factor into the estimate.

[benbowler]

I chose to use the getErrorForSelector selector within the AudienceTile component instead of adding another new prop to this component, we could instead create a new prop such as hasTopContentCustomDimensionError instead if prefered.

I've increased the estimate a couple of bands because the scope has expanded slightly as we've discussed required fixes/additions to be able to work on this ticket.