Skip to content

[Flamegraph] Add properties to externally control the search text #2067

@cauemarcondes

Description

@cauemarcondes

Is your feature request related to a problem? Please describe.
On Profiling, we'd like to filter the flamegraph when navigating from one page to another. That means I need to save in the URL the search value the user provides and pass it down to the flamegraph component. In case the user edits or clears out the search value I need to update its value in the URL too.

Describe the solution you'd like
The solution I propose is to expose two new properties: searchText and onSearchTextChange.

The first one searchText, is an optional string that will be used to pass down the searched value.
The second one onSearchTextChange, is an optional callback function with the new searched value, in case the user edited, or undefined, in case the user cleared the search.

<Flame
    id={id}
    columnarData={columnarData.viewModel}
    valueAccessor={(d: Datum) => d.value as number}
    valueFormatter={(value) => `${value}`}
    animation={{ duration: 100 }}
    searchText={searchText}
    onSearchTextChange={(newSearchText: string | undefined) => {
      //update url based on the new text
    }}
  />

Describe alternatives you've considered
N/A

Additional context
N/A

Kibana Cross Issues
https://github.com/elastic/prodfiler/issues/3126

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions