Updates to settings screen for Functional Prototype sprint

[LevinMedia]

For now we'll use the style of the existing screen. Eventually this will be updated to match forthcoming WooCommerce Admin styles.

Settings to include:

Activate / deactivate WooCommerce Payments
Title [Credit Card]
Description [Enter your card details]
Business / payment details - link to stripe express dashboard
View deposits - link to stripe express dashboard
Manual Capture on / off
test mode on / off

Existing screen for reference:

Acceptance criteria:

All settings must function as expected.

[scottysimpson]

Quick question: Are we keeping "Title [Credit Card] and Description [Enter your card details]" for a particular reason? We are already removing Stripe branding from this description woocommerce/woocommerce-gateway-stripe#933 so should we allow merchants to add in any text that could be misinterpreted by customers?

[allendav]

Great question @scottysimpson - we offer that for all (most?) of our payment gateways to give merchants a means to modify buyer facing text. I'm OK with us leaving those out until we get pushback.

[luizreis]

@LevinMedia - it seems like the only login link we can create is for the Express Dashboard [1] [2], which in turn has the edit business/payments details button. Given this, do you think it makes sense to have both Business / payments details and View deposits, as they would be pointing to the same URL?

Edit: Just to clarify, we could use the login URL and extend it with the routes to the pages we want, however there are some complications, such as needing the external_account_id from the accounts endpoint and the fact that the frontend URLs could change. However it is possible to achieve that, in case we want to pursue it in the future.

[LevinMedia]

In this case:
lets change the label for the setting to "Account"
lets make the link say "View payouts & account details"

[scottysimpson]

@LevinMedia @luizreis I've mocked up the settings screen. I'm not 100% sure about mentioning another "account" but for this super mvp I feel its ok to just go with it since we're mentioning Stripe anyway. BTW if you feel we shouldn't mention stripe do you think its ok to have a link that doesn't describe where it goes? Especially if it redirects to another product.

https://cld.wthms.co/WK0Ftw

[LevinMedia]

That looks great @scottysimpson thanks!

Per my comment right above, @luizreis is going to update the account details label to simply say "Account" and the message will be a single link to view payouts and business details.

We had a follow up chat - and decided that if the merchant hasn't completed the KYC data flow, they'll get a different message for that setting, that mirrors the message in the WP-notification:

Account: Accept credit cards online. Simply verify your business details to activate WooCommerce Payments. [get started] <-link to KYC flow

Again, this message would only display if the merchant hasn't completed the stripe KYC flow.

Last minor piece of feedback - I'd like to move enable disable to the bottom, so that account is at the very top.

[luizreis]

@LevinMedia @scottysimpson - updated #211 with latest changes! Included some screenshots in the description. 🎉

[dechov]

@LevinMedia Was this change intended to a) add the description "Enter your card details" above the credit card form, and b) remove the setting to change it? The description had previously been removed in #154 after being deemed unnecessary (#57 (comment)) so I just wanted to make sure.