Caused by the return and loading spinner icons having different widths. Used fa-fw helper class to ensure fixed width on icons. Also, made the spacing between icon and button label slightly smaller, as the rotated level-down icon used as return icon has significantly smaller width compared to the loading spinner and it looked oddly far from the label as compared to timepicker's icon
A logging query has a selector part and a regexp. The regexp matches are highlighted when results return.
This change adds live preview to matches when modifying the regexp in a search field.
- delegate retrieval of match query to datasource
- datasource returns search expressions to be used to highlight a live preview of matches
- logs row now takes preview highlights
- logs row renders preview highlights with dotted line to distinguish from query run matches (solid line)
- fix react-highlight-words version to ensure custom chunk matcher
- custom chunk matcher can now also take incomplete regexps, eg, `(level` without inifinte looping
- perf: debounce of live preview to 500ms
- perf: only top 100 rows get the live preview
- preview is only supported with one query row (multiple rows semantic makes this tricky: regexp for row n should only filter results for query n)
- added filter and stats icons to log stream labels
- removed click handler from label itself
- click on stats icon calculates label value distribution across loaded logs lines
- show stats in hover
- stats have indicator which value is the current one
- showing top 5 values for the given label
- if selected value is not among top 5, it is added
- summing up remaining label value distribution as Other
- moved from grid to flexbox
- calculate Explore results only when query transactions change to prevent expensive re-renders
- split up rendering of graph and log data
- render log results in 2 stages
- adds a custom label renderer to Logs viewer in Explore
- labels are no longer treated as strings, they are passed as parsed objects to the log row
- label renderer supports onClick handler for an action
- renamed Explore's `onClickTableCell` to `onClickLabel` and wired up log label renderers
- reuse Prometheus `addLabelToSelector` to modify Logging queries via click on label
- added tests to `addLabelToSelector`, changed to include the surrounding `{}`
- use label render also for common labels in the controls panel
- logging meta data section has now a custom renderer that can render numbers, strings, and labels
- style adjustments
- add `onToggleSeries` to Explore Graph props
- toggling a Logging Graph series from the legend propagates its hidden series to Logs
- Logs translates hidden series alias to LogLevels
- Logs filters out hidden log levels
- added dedup switches to logs view
- strategy 'exact' matches rows that are exact (except for dates)
- strategy 'numbers' strips all numbers
- strategy 'signature' strips all letters and numbers to that only whitespace and punctuation remains
- added duplication indicator next to log level
- replace the Graph/Table buttons with toggle control in a wrapper panel
- moved toggle control to left to be close to the label
- removed panel styles from Logs and Graph viewer
- moved loader animation to panel
A z-index value of less than 1020 is needed because the time selection
dropdown shares the latter value via inheritance. Arbitrarily picked
1015 because it is a notch down.
Related: #14004
- Logging gets a graph for log distribution (currently per stream, but I
think I'll change that to per log-level)
- added grid columns for timestamp and unique labels
- show common labels of streams
- View options to show/hide time columns, label columns
- created `--small` modifier for Switch CSS classes
- merging of streams is now a datasource responsibility
- changed `start()` to return promise on main language feature task
- promise resolves to list of secondary tasks
- speeds up time to interaction of metric selector
- lazy loading of certain metric selector and log label selector items
- loading indication of metric and log label selectors
this is a fix-up PR that cleans up Explore Logging after the recent
restructuring.
- log results need to be merged since query transactions have been
introduced
- logging DS has its own language provider, query field, and start page
(some of them based on prometheus components)
- added loader animation to log viewer
- removed logging logic from prometheus components
- when instantiating a datasource, the datasource service checks if the
plugin module exports Explore components, and if so, attaches them to
the datasource
- Explore component makes all major internal pluggable from a datasource
`exploreComponents` property
- Moved Prometheus query field to promehteus datasource and registered
it as an exported Explore component
- Added new Start page for Explore, also exported from the datasource
- use global range types
- add ErrorBoundary around individual Explore components
- fix table merge on empty results
- fix TimePicker date parsing on ISO dates
- fix TimePicker range string after relative move
Existing querying was grouped together before handed over to the
datasource. This slowed down result display to however long the slowest
query took.
- create one query transaction per result viewer (graph, table, etc.)
and query row
- track latencies for each transaction
- show results as soon as they are being received
- loading indicator on graph and query button to indicate that queries
are still running and that results are incomplete
- properly discard transactions when removing or changing queries
- adds react-table as dependency
- replaces custom table component in Explore
- vendors react-table styles and overrides them (currently in
explore.scss)
* Explore: Query hints for prometheus
- time series are analyzed on response
- hints are shown per query
- some hints have fixes
- fix rendered as link after hint
- click on fix executes the fix action
* Added tests for determineQueryHints()
* Fix index for rate hints in explore
- load all histogrammable metrics on start, based on `{le!=''}` series
query
- select dropdown shows all those metrics as well as histograms in a
special group
- select a metric will write fill the metric in the query box
- if a histogram is chosen, it will write a complete
`histogram_quantile` query
- added new dependency: rc-cascader
- Clear All button to clear all queries and results
- moved result viewer buttons below query rows to make it more clear
that they govern result options
* Add click on explore table cell to add filter to query
- move query state from query row to explore container to be able to set
modified queries
- added TS interface for columns in table model
- plumbing from table cell click to datasource
- add modifyQuery to prometheus datasource
- implement addFilter as addLabelToQuery with tests
* Review feedback
- using airbnb style for Cell declaration
- fixed addLabelToQuery for complex label values
- new builtin datasource plugin "Logging" (likely going to be renamed)
- plugin implements no panel ctrls yet, only ships datasource
- new models for logging data as first class citizen (aside from table
and time_series model)
- Logs as new view for Explore
- JSON view for development
Testable only against existing logish deployment.
Then test with queries like `{job="..."} regexp`.
Adds a datasource selector to the Explore UI. Only datasource plugins
that have `explore: true` in their `plugin.json` can be selected.
- adds datasource selector (based on react-select) to explore UI
- adds getExploreSources to datasource service
- new `explore` flag in datasource plugins model
- Prometheus plugin enabled explore
* button to bring a up a duplicate explore area to compare
* side by side rendering of two explore components
* right component has close button
* left component has page title
* style header like other grafana components
* use panel container for graph and same styles for query field
* fix typeahead CSS selector (was created outside of .explore)
* use navbar buttons for +/- of rows
* moved elapsed time under run query button
* fix JS error on multiple timeseries being returned
* fix color for graph lines
* show prometheus query errors
* time selector for explore section
* mostly ported the angular time selector, but left out the timepicker
(3rd-party angular component)
* can be initialised via url parameters (jump from panels to explore)
* refreshing not implemented for now
* moved the forward/backward nav buttons around the time selector
If #11939 is not merged in the patch release, then
this is a temporary fix for 5.1.3. It sets overflow to
hidden for larger screens and keeps the overflow set to
auto for mobiles and tablets.
Fixes#11937
* adds +/- buttons to query rows in the Explore section
* on Run Query all query expressions are submitted
* `generateQueryKey` and `ensureQueries` are helpers to ensure each
query field has a unique key for react.
