New feature flag creation flow

[corywatilo]

@annikaschmid and I have been brainstorming an improve feature flag creation flow.

Note: This UI set within the context of the PostHog 3000, but the concept should be easily adaptable to what we have now, assuming we want to ship it sooner than that.

Step 1: Info

• Key should be automatically generated (as a valid string) based on name
• Shouldn't allow special characters to be typed (today we do, then it gets validated and shows an error)

Step 2: Code

• When selecting multiple variants, you'd be asked to enter your variant keys
• The code block is at the bottom so we can automatically insert the variant keys into the code snippet so you don't have to do this manually

Step 3: Release conditions (Option A: Developer mode)

• By default, NO one has the flag enabled except the person creating it. (This removes our need to have the Enable flag option we have today.)

Step 3: Release conditions (Option B: Live mode)

• When toggling to LIVE mode, it shows the Release conditions section. I'd imagine if you ever switch back to Developer mode, it preserves the conditions you've added here, so you don't have to recreate them when you toggle the flag back on.
• This version shows the Custom permissions form being open

[neilkakkar]

A part I don't like about having multistep forms like the above for feature flags:

When I already know what I want, it's frustrating to go to multiple steps in a form, clicking next, next, next, publish; to create a flag.

The key here being that most of these steps are optional. All you need for a fully fledged feature flag is the name, and that's it.

I think a workflow like this makes sense when in tutorial mode, i.e. we're showing you what all is possible with flags, and here's how to use them. But doesn't make too much sense to me in 'work mode', where I'm aware of the capabilities and just want to get my work done.

Example: In the current form, I can type in the key, click Save, and I'm done:

I love that I don't have to scroll down to anything, unless I really want to. (This is exactly what I do when developing locally and I just want the flag enabled)

[patleeman]

A copy "code snippet to clipboard" in Step 2 would save a bit of work.

Also a nice enhancement would be syntax highlighting in the code block.