[FE] VSA - UI add edit controls to path navigation

Why are we doing this work

To properly utilise the screen space for VSA, we should move the navigation to a horizontal layout above the page, in order to achieve this, we need to implemnt some additional functionality that exists in the table based navigation

  • Currently, there is duplication/redundancy for value stream stages with previous vertical and new horizontal layouts
  • The vertical layout leaves the graphs quite far below the fold... potentially meaning that users miss these features

This issue covers the changes need to Edit a value stream

Screenshots

edit value stream

Relevant links

Implementation plan

  • The edit button is available when you've selected a custom value stream
  • The form loads with the stages in the order you have set
  • The radio buttons for From default template / From scratch don't appear
  • The restore defaults button appears next to the value stream name, this will remove all custom fields + restore the default stages to their original order and unhide any that are hidden
  • Default stages will have the up/down arrows + a hide button
  • Custom stages will have the up/down arrows + a delete button, then the fields for their event
  • A visual divider to split the fields for editing, from the list used for restoring hidden stages
  • Hidden stages (if there are any) will appear at the bottom with a restore button next to them - Needs investigation

Non-functional requirements

  • Documentation:
  • Feature flag: :value_stream_analytics_extended_form
  • Performance:
  • Testing:
Edited by Ezekiel Kigbo