Improve UX to subscribe to starter tier.

[iskerrett]

Description

The current UX for the someone to subscribe to the Starter tier is not obvious. The current workflow is as follows:

1. Create an account that starts a free trial.
2. Go to Team Billings or go to Team Setting > Edit Team Setting > click on change team type that leads to the same Team Billings page
3. Click on Setup Payment Details
4. The Stripe page then shows $0 for the Trail Starter Team.

There are a number of issues with this UX.

1. It doesn't appear to be possible for someone to setup a $15/month charge for the Starter tier before the trial period ends. We should be encouraging people to start paying for FF Cloud as soon as possible.
2. Team Billings should really be just Billings. The Starter tier is aimed as individuals so they won't be thinking in terms of Teams. In fact, I don't think we should be talking about different billing tiers/packages and not be using Teams for the term.
3. On the billing page, it would seem we should list the 3 tiers so people select which on they want to purchase before they enter their credit card details. I suggest we should always be showing the monthly cost before we ask for someone credit card number.

The ideal work flow to subscribe to the start tier.

1. Create an account that starts a free trial.
2. Click on Billing, to get a list of different pricing tiers/packages. The starter tier being one of these listed.
3. Use selected Starter tier.
4. Clicks Setup Payment details.
5. Stripe page shows $15/month and request credit card info.
6. After they credit card info is entered, the user exists trial mode and has the starter tier.

As a bonus, it would be great to have a url that we can embed into an email that say 'Upgrade to Starter Now' that will take the user to the Billing page.

### Tasks
- [ ] https://github.com/FlowFuse/flowfuse/pull/2963
- [ ] https://github.com/FlowFuse/flowfuse/issues/2970
- [ ] https://github.com/FlowFuse/flowfuse/issues/3105

Epic/Story

No response

Have you provided an initial effort estimate for this issue?

I have provided an initial effort estimate

[MarianRaphael]

First iterartion:

• End Trial, if a user provides cc information
• 15 $ for Starter Package would be displayed in Stripe

Next Iteration:

• Selection Screen for the tier

[knolleary]

See also #2904 which is related.

[knolleary]

2328 contains designs relevant to this. Still need to scope down a bit, but gives a better UX for the process around first setting up billing and leaving trial mode.

[knolleary]

Having refreshed my working knowledge of how trials are handled, I can confirm the first iteration of this is a fairly small piece of work - less than a day's work. We can ship that this week if in agreement.

The second iteration requires a but more involved UX work - so we need to prioritise against the other current tasks.

[knolleary]

First iteration addressed by https://github.com/FlowFuse/flowfuse/pull/2963

[knolleary]

I have raised #2970 to cover the UX improvements of the Setup Billing page.

[knolleary]

The final piece is to bring the Change Team Type UX inline with the designs - #3105

[joepavitt]

@knolleary this is marked as "in progress" but not sure there is any active development going on with #3105 at the moment? Worth parking back to the backlog?

[knolleary]

@joepavitt yeah, I think this dropped off the board when it's milestone was cleared.

3105 is the actual task that needs scheduling. I suggest we close this issue off (as the bulk of the intended work is complete), and then use 3105 to track that follow up piece.

[joepavitt]

Will leave it open, as technically the Epic isn't finished, but have removed from the Dev board