Search aggregation: Support new non-proactive variation for the sidebar aggregation UI

Created by: vovakulikov

Screenshots

The area in the red rectangle will be hidden if all of the following criteria are true:

• Feature flag: disable-proactive-insight-aggregation enabled
• Any group by is active.
  • By default all of the group-by buttons will be inactive. When the user clicks a button the chart will render.

Dynamic content

• Buttons show an active state depending on the URL using useSyncedWithURLState
• Chart is pulled from API call TBD currently just pulling mock data
• Chart section visibility is dependent upon feature flag

Reqs

• Create a new feature flag disable-proactive-insight-aggregation false by default
• Active button needs to support "none" state if flag is active. See client/search-ui/src/results/aggregation/hooks.ts:aggregationModeDeserializer
• Hide the chart section in client/search-ui/src/results/sidebar/SearchAggregations.tsx if feature flag is enabled and no grouping is selected
• Currently, the app is using static mock data. Add a way to only pull this data based on feature flag Not needed. Vova's PR will be easy to integrate later.
  • Right now it hides all of the UI if search-aggregation-filters is disabled. This will obviously not make any API call. But we need to make sure the proactive call is also behind the new disable-proactive-insight-aggregation
    • tldr: Only make API call on page load if both flags are true

Developing

• Feature flag search-aggregation-filters need to be enabled
  • Go to site-admin/feature-flags create a boolean feature flag called search-aggregation-filters set to true
• Run any search and the aggregation card should be visible in the side bar

Testing

• Need unit tests asserting chart is only hidden when expected
  • feature flag enabled plus no grouping

Reviewing

• Feature flag search-aggregation-filters need to be enabled
  • Go to site-admin/feature-flags create a boolean feature flag called search-aggregation-filters set to true
• Search for anything. i.e. "hello" Confirm aggregation card shows in the side panel
• Enable disable-proactive-insight-aggregation
  • Go to site-admin/feature-flags create a boolean feature flag called disable-proactive-insight-aggregation set to true
• Run any search
• Confirm only buttons show in the side bar and explanatory text show

• Select a grouping mode by clicking one of the buttons
• Confirm chart displays

Context

Figma Desings

From Figma

Option with no proactive request to the BE (depending on how the prototype is going to turn out). The user needs to choose one of the options to the group.

According to this statement, one of the possible aggregation UI configurations here is to render aggregation controls only and not render the chart until users explicitly click on one of the aggregation controls and pick the aggregation type. This action should trigger the aggregation chart appearance and BE query run.

A separate user experimental feature flag should control this non-proactive UI configuration. So it should have its own user-set feature flag.

/cc @joelkw @felixfbecker @vovakulikov @unclejustin