Improve experience with recoverable modules for view-only users

Feature Description

Bug bash issue: https://app.asana.com/0/1202258919887896/1202445528223671 please refer to Asana issue for background

Improve the messaging & experience if an admin has connected a module, shared access, and then disconnects. If an admin has connected a module (ie. Analytics), shared view only access with other roles (include admins), and then disconnects they’ll be presented with an option to “Set Up” Site Kit or to access “View only” data.

If they choose to only view the data they’ll encounter the below message, which isn’t the most suitable (screenshot):

Data error in Analytics Site Kit can’t access the relevant data from Analytics because you haven’t granted all permissions requested during setup.

The reason is not suitable is that the user did provide access previously but they disconnected. They do actually have access to the Analytics property but they need to re-do the plugin setup, and there is no obvious link to do so (after choosing the “view only” dashboard).

The only way for the admin to re-do plugin set up is to click on the “View only” link and then “Sign in with Google” option. This isn’t very obvious, and would likely lead to many admins resetting the plugin.

Recording of experience

Improved recording of experience - showing all 3 CTA’s on the dashboard after disconnecting

Steps to recreate:

1. Connect SK with Google Analytics
2. Share Google Analytics with all roles
3. Disconnect from Site Kit
4. You’ll be present with the option to set up Site Kit once more, this time with 3 options (which can be confusing)
5. Select the option to “View limited data”
6. You’ll encounter the error, with no obvious way out other then that mentioned above

Related to #5354

---

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

Acceptance criteria

• When a module is in a recoverable state, all widgets associated with it (via their registration) should be replaced by a new component when viewed in the context of the view-only dashboard.
  • The recoverable state should look similar to the Data Unavailable state of the widget but has different title and message.
  • The title should be Data Unavailable
  • The message should be {Module} data was previously shared by an admin who no longer has access. Please contact another admin to restore it.
    • For widgets that require multiple recoverable modules, the message should read slightly differently: The data for the following modules was previously shared by an admin who no longer has access: {Module1, Module2, ...}. Please contact another admin to restore it.
• The new component when rendered should be treated as a special widget state, similar to gathering data, which when multiple adjacent widgets render the same state, they are combined into a single widget automatically
• Unlike other special widget states, this should be handled outside of the registered widget components but handled automatically by the widget infrastructure based on a widget’s registered modules and the current set of recoverable modules

Implementation Brief

• Add a new RecoverableModules component which takes moduleSlugs (string[] module slugs) as a prop
  • Renders a CTA with the title and message as defined in the AC informing about the recoverable modules
• Add a new WidgetRecoverableModules component, similar to WidgetReportError which renders RecoverableModules (passing through its props to it) and uses the useWidgetStateEffect hook internally to set the widget state on mount using RecoverableModules as the component and moduleSlugs as the metadata
• Update WidgetRenderer to conditionally override the widgetElement with a WidgetRecoverableModules if widget.modules contains any recoverable modules, if so, passing the intersection of module slugs as props.moduleSlugs to WidgetRecoverableModules
  • Note this should only happen in a view-only context (useViewOnly)
• Add the RecoverableModules to the list of special widget states

Test Coverage

• Add Jest tests to cover the basics of this functionality (essentially the alternate component rendered in place of the widget’s registered component);
• A basic test covering widget combination for adjacent widgets with the same state + metadata

QA Brief

• Site up Site Kit and enable the dashboardSharing feature flag.
• Put the Search Console and PageSpeed Insights modules into the recoverable state. This can be achieved by sharing them as a user and then disconnecting that user from Site Kit.
• View the Dashboard in view-only mode with a user whose role the modules were shared with.
• Widgets for the recoverable modules should be rendered using the RecoverableModules component:

Changelog entry

• Update view-only dashboard to use a new placeholder for widgets that rely on recoverable modules.

[techanvil]

Thanks @aaemnnosttv, sounds like a plan.

Update: I have created a follow-up issue for the multiple modules case: https://github.com/google/site-kit-wp/issues/5466

[aaemnnosttv]

Thanks for raising this @techanvil – I think at one point the engine combined widgets based on equivalent metadata rather than checking specific properties within it so I missed this detail when writing the IB.

In the interest of not increasing the scope here (and because most widgets have only a single module), I would suggest we join the widget’s modules into a single moduleSlug string when constructing the metadata, essentially shoehorning it into the current logic. This is a bit of a hack but it should be harmless and have the intended effect for most widgets. We can then open a follow-up issue for how we want to handle this for multi-module widgets.