Jetpack Cloud: Create Fix all threats - add credentials modal

[rcanepa]

Changes proposed in this Pull Request

• The goal of this is to create the Threat Card used on the main screen when threats are found.

Important note

We are not checking if the provided credentials are valid. We move the user to next step in the progress regardless of the result. This is for testing purposes only.

Testing instructions

• Navigate to http://jetpack.cloud.localhost:3000/scan/?scan-state=threats
• Click the "Open Fix All Threats Dialog" button

See 1151678672052943-as-1165787355206381.

Expected result

We need credentials

If credentials were already supplied

Fixing all threats (notice that the buttons are disabled)

[matticbot]

Test live: https://calypso.live/?branch=add/fix-all-threats-add-credentials-dialog

[matticbot]

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

Sections (~7414 bytes added 📈 [gzipped])

name  parsed_size            gzip_size
scan     +31910 B  (+33.1%)    +7414 B  (+28.2%)

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

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.

[enejb]

This tested really well for me.

Some thing that I noticed

1. The in progress state when we are validating the credentials provided is shown in the notice. Which is a bit hidden. We should make it more prominent. (lets fix this in a follow up PR)
2. It is possible to close the dialog by clicking outside of the modal. When the form is validating the credentials. Which breaks the flow. Can we remove this?

[rcanepa]

I added tests that can be run with npm run test-client:watch landing/jetpack-cloud/components/with-server-credentials-form/test/index.js.

[rcanepa]

Hey @enejb !

1. The in progress state when we are validating the credentials provided is shown in the notice. Which is a bit hidden. We should make it more prominent. (lets fix this in a follow up PR)

I agree.

2. It is possible to close the dialog by clicking outside of the modal. When the form is validating the credentials. Which breaks the flow. Can we remove this?

Done.

I also added tests around the HOC. Let me know what you think.

[enejb]

Thanks for adding the test. This works really nicely now!