#5647767 Prevent credentials edition for sites with no purchases

Changes proposed in this Pull Request

Sites that never had any purchased plan or product can’t currently have user credentials be saved. See 1164141197617539-as-1199981665376903. This PR improves the user experience a bit by showing an empty state if the site has no purchased plans nor products.

Implementation notes

Changing site

When making a request to fetch a site purchases, information about the state of the request (ongoing and completed) is stored in the state independently of the site (respectively state.purchases.isFetchingSitePurchases and state.purchases.hasLoadedSitePurchasesFromServer). This is limiting in our case, since the loading condition in HasSitePurchasesSwitch will keep returning false after switching site.

To prevent this, we could isolate the site specific request information in the state (e.g. state.purchases.requests[siteId].isFetching), but that’s too big of a change, at least for the scope of this PR.

A simpler solution is to detect the site switch in HasSitePurchasesSwitch, and to reset the isFetchingSitePurchases and hasLoadedSitePurchasesFromServer values.

Testing

Unit tests were added for the newly created components. Most of them doesn’t include any logic, so I’ve just included snapshots to make sure further changes are intentional.

Testing instructions

• Download the PR and run cloud
• Create a new self-hosted Jetpack site, and connect it (don’t purchase any plan or product)
• Visit /settings/:site
• Notice the loading placeholder while purchases are being fetched, then the empty state (see video below)
• Check that the button links to jetpack.com/pricing
• Switch section back and forth, and check that you see the empty state instantly
• Select another site that has a purchased product or plan
• Check that you can add your credentials
• Remove any purchased product or plan
• Make sure you can still remove or edit the credentials

Screenshots