* split warnings and info annotations in API response
Signed-off-by: Jeanette Tan <jeanette.tan@grafana.com>
* update according to code review
Signed-off-by: Jeanette Tan <jeanette.tan@grafana.com>
* minimal UI change: show infos in different colour
Signed-off-by: Jeanette Tan <jeanette.tan@grafana.com>
* Update web/ui/react-app/src/pages/graph/Panel.tsx
Co-authored-by: Julius Volz <julius.volz@gmail.com>
Signed-off-by: zenador <zenador@users.noreply.github.com>
---------
Signed-off-by: Jeanette Tan <jeanette.tan@grafana.com>
Signed-off-by: zenador <zenador@users.noreply.github.com>
Co-authored-by: Julius Volz <julius.volz@gmail.com>
* Allow copying label-value pair to buffer on click
Kept similar DOM structure to keep test compatibility.
Using `navigator.clipboard` API since it is used by the current standard browsers.
React hot toast is used to notify that the text was successfully copied into clipboard.
Signed-off-by: lpessoa <luisalmeida@yape.com.pe>
* Using reactstrap for toast notification
Using the bootstrap toast notification provided by reactstrap.
Clipboard handling is managed using React.Context via a shared callback.
Updated css according to CR suggestions.
Signed-off-by: lpessoa <luisalmeida@yape.com.pe>
* Changes from CR comments
Cleaning up renderFormatted method.
Renamed Clipboard to ToastContext.
Updated tests.
Signed-off-by: Luis Pessoa <luisalmeida@yape.com.pe>
Signed-off-by: lpessoa <luisalmeida@yape.com.pe>
Signed-off-by: Luis Pessoa <luisalmeida@yape.com.pe>
* Tweak colors in the dark theme to improve contrast
Some colors from the dark theme used in the query editor have a very low
contrast ratio with the background.
Signed-off-by: Jorge Luis Betancourt Gonzalez <jorge-luis.betancourt@trivago.com>
* Avoid duplicated function call when in dark mode
Co-authored-by: Julius Volz <julius.volz@gmail.com>
Signed-off-by: Jorge Luis Betancourt Gonzalez <jorge-luis.betancourt@trivago.com>
* Apply styles for the matching bracket when focused in dark mode
Signed-off-by: Jorge Luis Betancourt Gonzalez <jorge-luis.betancourt@trivago.com>
* Improve style of the matching brackets when focused
Signed-off-by: Jorge Luis Betancourt Gonzalez <jorge-luis.betancourt@trivago.com>
Co-authored-by: Julius Volz <julius.volz@gmail.com>
* Allow formatting PromQL expressions in the UI
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Improve error handling, also catch HTTP errors
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Remove now-unneeded async property
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Disable format button when already formatted
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Disable format button when there are linter errors
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Remove disabling of format button again for linter errors
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* bump codemirror to v0.20.x and lezer to v.0.16.x
Signed-off-by: Augustin Husson <husson.augustin@gmail.com>
* bump codemirror to v6 and lezer to v1
Signed-off-by: Augustin Husson <husson.augustin@gmail.com>
* stop treating warning as error for UI
Signed-off-by: Augustin Husson <husson.augustin@gmail.com>
* Fix DataTable tests and missing value key warning
Fixes issues introduced in https://github.com/prometheus/prometheus/pull/10376
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Fix more DataTable brokenness
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Add a tooltip for unix times (ISO strings)
Signed-off-by: Ondrej Kokes <ondrej.kokes@gmail.com>
* Leverage useLocalTime to adjust ISO string tooltips
Signed-off-by: Ondrej Kokes <ondrej.kokes@gmail.com>
* revert pre styling removal
Signed-off-by: Ondrej Kokes <ondrej.kokes@gmail.com>
* Upgrade create-react-app to v5
Some other dependencies needs to be upgraded as well, plus some typescript errors fixed.
Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
* Use ESM imports for codemirror-promql
Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
* Update FontAwesome to v6
Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
* Fix bug that sets the range input to the resolution
Signed-off-by: Julius Volz <julius.volz@gmail.com>
* Address review comments
Signed-off-by: Julius Volz <julius.volz@gmail.com>
This updates React, TypeScript, and some other node packages (but not
everything).
A couple of notes:
- `enzyme-adapter-react-16` does not have a React 17 equivalent yet, so I
switched to the fork `@wojtekmaj/enzyme-adapter-react-17`
- A bunch of tests are still failing because I think in the enzyme testing
environment, a browser API (`ResizeObserver`) is missing, and maybe for other
reasons. This needs to be explored + fixed.
- The TypeScript update introduced more stringent rules, which required fixing
up a bunch of pieces of code a bit.
- The `use-media` package doesn't work with React 17 yet, so I just built our
own minimal `useMedia` hook instead (just a couple of lines).
- I commented out part of the code in `withStartingIndicator.tsx` because it
fails the now-stricter lint checks. It needs to be fixed (and not commented
out).
Signed-off-by: Julius Volz <julius.volz@gmail.com>
This updates React, TypeScript, and some other node packages (but not
everything).
A couple of notes:
- `enzyme-adapter-react-16` does not have a React 17 equivalent yet, so I
switched to the fork `@wojtekmaj/enzyme-adapter-react-17`
- A bunch of tests are still failing because I think in the enzyme testing
environment, a browser API (`ResizeObserver`) is missing, and maybe for other
reasons. This needs to be explored + fixed.
- The TypeScript update introduced more stringent rules, which required fixing
up a bunch of pieces of code a bit.
- The `use-media` package doesn't work with React 17 yet, so I just built our
own minimal `useMedia` hook instead (just a couple of lines).
- I commented out part of the code in `withStartingIndicator.tsx` because it
fails the now-stricter lint checks. It needs to be fixed (and not commented
out).
Signed-off-by: Julius Volz <julius.volz@gmail.com>