Properties filtering

As a Studio app builder, I can filter out the list of properties that I can drag and drop

AC

• search input contains a placeholder "search - property name, widget and more"
• When typing something, properties list is filtered out
  • Results shown should contain what is typed (i.e. not only begin with)
  • Results are case insensitive

• Results are filtered based on
  • Property name
  • Schema name
  • Schema prefix
  • Available widgets for a property

• Results show
  • property name
  • path and widget type (document / schema / widget type)
    • when too long, an ellipsis is made on the left (i.e. ... / schema / widget type)

• Results are ordered
  • Alphabetically (schema_prefix:property)
  • Then by widget name alphabetically
• When no results are available, a message is shown "no results found

• A result can be drag and dropped into a layout

• Analytics event is sent when d&d a widget from the results
  • Category: Described according to NXS-5742
  • Event: Widget drag and drop (results list)
  • Label: [Widget name]

• Removing the filter goes back to the tree

• Analytics event is sent when a filtering is triggered
  • Event is sent after the user stops typing for a period (TBD https://stackoverflow.com/questions/42361485/how-long-should-you-debounce-text-input )
  • Category: Described according to NXS-5742
  • Event: Widget filtering
  • Label: [number of results returned]
    (goal: future UX optimization - better show results depending on their usual numbers, see if indexing is relevant)