Add VSA settings page with preset filters to custom value streams

Problem

Value Stream Analytics provide high value to the executives and software leaders. However, VSA require specific filters to be applied to be relevant. The executives' time is very valuable and they may not be as familiar with how to use GitLab to see the insights that are relevant to their organization / Groups / Projects. In a similar way to boards, teams also want to use filtered labels with saved value streams.

Today persistency is missing - All users should have the same results and context when clicking on a link to the dashboard. 

Related to #222449 (comment 362855265)

JTBD & Persona

MAP - When I am establishing practices to measure my value stream, I want to define the flow of work required to ship value to my end users so that we can visualize how efficiently and reliably value is delivered.

Persona - Dakota (Application Development Director), Delaney (Development Team Lead), Parker (Product Manager)

Proposal

This is the original proposal, for the design solution please see Solution

View original proposal

1. Create Value Stream settings page to replace the VSA edit, or reuse the existing VSA edit page.
2. Add preset filters input in the settings page - with similar option as we have in the VSA page:

• Filter bar.
• Option to filter for projects.
• Select time period.

VSA settings page	Board example

User experience goals:

1. When creating a new custom value stream I need option to save preset of "labels filter".
2. When creating a new custom value stream I need option to save preset of "projects filter".
3. When creating a new custom value stream I need option to save preset of "time period" - last week, last month, last 90 days.
4. When using VSA, all filters should be applied so that I can review the data in the correct context.

However, once the user start to analyze deeply the stream performance we have a new goal:

5. When I use VSA to analyze stream performance, I need to slice and dice the data with filters. By using these filters, I can break down the data into smaller parts and to examine it from different viewpoints.

Future iteration path

1. Add settings for Tasks by type chart.
2. Add setting to custom drilling down link form VSA stage to other analytics pages (e.g.Insights ).

Open questions

• Should we remove the VSA filter bar (similar to boars?)
• How to ensure good performance also for larger groups and projects? larger volume of issues and labels - The value stream edit page opens slowly (#361331 - closed)?
• How this new setting should be aligned with new types and new work item.

Solution

🖌 ✨ Design specs in Figma

---

Create value stream

Flow: VSA page, value stream dropdown, user clicks Create new value stream button → User lands on create page → Create value stream button → Lands on the new value stream page

---

Edit value stream

Flow: VSA page, user clicks Edit button → User lands on edit page → Clicks Save value stream button → Remains on the edit page → clicks View value stream button → Lands on the value stream page

Additional designs

• Select projects dropdown
• Selected projects listed in input field
• Time period dropdown

Mobile designs

Create value stream	Edit value stream

To make the long and complex forms of creating/editing value streams more usable on mobile we should make the buttons stick to the bottom of a mobile screen:

sticky_buttons