Site Activity: adds contextual popover menu item to add site credentials

[keoshi]

Changes proposed in this Pull Request

• Adds contextual popover menu item to add site credentials in backup events on the site activity.
• Adds new calypso_activitylog_event_add_credentials tracks event for this new item.

We’re currently disabling the “Restore to this point” option on the site activity without explaining why, and I’d assume people would not co-relate the banner at the top telling them to add server credentials and the fact that restores are not available.

Before

After, normal state

After, selected state

After adding server credentials, the restore option is enabled and this one goes away

Testing instructions

• Fire up this PR locally or using jurassic.ninja.
• Connect Jetpack.
• Go to your site activity in Calypso; e.g.: http://calypso.localhost:3000/activity-log/SITE_URL.
• Ensure you see the new option and that it sends you to the correct place to set up site credentials.
• Validate that the option isn't visible once you've added working credentials.

[matticbot]

Test live: https://calypso.live/?branch=add/jetpack-activity-server-credentials-menu-item

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

Sections (~182 bytes added 📈 [gzipped])

name      parsed_size           gzip_size
stats          +340 B  (+0.0%)      +91 B  (+0.0%)
activity       +340 B  (+0.1%)      +91 B  (+0.1%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~91 bytes added 📈 [gzipped])

name                                 parsed_size           gzip_size
async-load-signup-steps-clone-point       +340 B  (+0.2%)      +91 B  (+0.3%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.

[folletto]

This was long overdue! Thanks for adding the clarification and the next step right where the user would expect it and avoiding a dead end. #nodeadends! :D

Design wise 👍

[enejb]

Should add some analytics to this new link?

[enejb]

Nice improvement @keoshi !

I think adding the analytics can be done in a different PR as well.

[keoshi]

@enejb Would appreciate another review after adding tracking in 9cb6427

Here it is working:

[jeffgolenski]

@keoshi Brilliant refinement. Well done!

[robertf4]

Excellent! With analytics in, I'm approving. Great PR @keoshi!

[keoshi]

Woohoo, thank you all! 🙌 Merging now.