Commit graph

123 commits

Author SHA1 Message Date
Levi Harrison 1b4e4aa81a
Fix Blank TSDB Status Page (#8654)
* Check response and return alternate page if no statistics

Signed-off-by: Levi Harrison <git@leviharrison.dev>

* Added tests for alternate page

Signed-off-by: Levi Harrison <git@leviharrison.dev>

* Change error handling in unixToTime

Signed-off-by: Levi Harrison <git@leviharrison.dev>
2021-03-26 20:47:54 +01:00
Ben Kochie b524ca8447
Update react deps (#8637)
* Bump all yarn deps (rm yarn.lock ; yarn)

Signed-off-by: Ben Kochie <superq@gmail.com>
2021-03-24 10:44:24 +00:00
Julius Volz faacb619c0
Add new codemirror-promql-based expression editor (#8634)
* Add new codemirror-promql-based expression editor

This adds advanced autocompletion, syntax highlighting, and linting
for PromQL.

Fixes https://github.com/prometheus/prometheus/issues/6160
Fixes https://github.com/prometheus/prometheus/issues/5421

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Group new editor options and float them left

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Improve history autocompletion handling

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Only show info tooltips for unabbreviated completion items

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Rename "new editor" to "experimental editor"

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Add path prefix support

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Revert accidental check-in of go.sum changes

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Remove spurious console.log

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Fix completion item type icon styling

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2021-03-23 23:55:52 +01:00
Dustin Hooten 0d8db52954
Feature: Add collapse/expand all button to target page for react ui (#8486)
* Feature: Add collapse/expand all button to target page for react ui

Signed-off-by: Dustin Hooten <dustinhooten@gmail.com>

* update local storage key to prevent bad state

Signed-off-by: Dustin Hooten <dustinhooten@gmail.com>

* PR feedback

Signed-off-by: Dustin Hooten <dustinhooten@gmail.com>

* split big state object into smaller ones

Signed-off-by: Dustin Hooten <dustinhooten@gmail.com>

* fix duplication typo

Signed-off-by: Dustin Hooten <dustinhooten@gmail.com>
2021-03-22 11:54:12 +01:00
Łukasz Mierzwa e4f076f813
[UI] Fix small issues generating console errors (#8622)
* Checkbox should use onChange, not onClick

This fixes react console errors:

You provided a `checked` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultChecked`. Otherwise, set either `onChange` or `readOnly`.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>

* Correctly pass key in metrics exporer

Instead of passing metric variable we pass 'metric' string, which causes console errors due to duplicated keys.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>

* Update tests

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
2021-03-19 13:20:04 +01:00
Łukasz Mierzwa 36417663ea
Avoid overflow on /rules page (#8608)
If I have a rule with a very long name it will force the table to be wider then the viewport.
This forces the browser to wrap long rule names and uses smaller font, to avoid having overflow.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
2021-03-17 10:15:58 +01:00
Łukasz Mierzwa 8ca29cb636
Avoid overflow on /targets page (#8609)
Target errors are rendered as badges. If error text is very long it will expand the table since badges are not allowed to wrap.
Replace badge with a span which is allowed to wrap around.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
2021-03-17 10:14:47 +01:00
Matthias Loibl 369aae93a8
web/ui: Hitting enter on range input creates a new query (#8581)
Signed-off-by: Matthias Loibl <mail@matthiasloibl.com>
2021-03-11 14:37:26 +01:00
alex-petrov-vt 4f03df8c55
Fix inconsistent display of word 'ago' on rules page (#8566)
* Fix inconsistent display of word 'ago' in last evaluation column on rules page

Signed-off-by: Alex Petrov <alex.petrov.vt@gmail.com>

* Extract adding word 'ago' to relativeDuration util function

Signed-off-by: Alex Petrov <alex.petrov.vt@gmail.com>
2021-03-08 19:10:09 +01:00
Simon Pasquier fe23360d0f
web/ui/react-app: update dependencies (#8529)
Fix lodash security issue.

Signed-off-by: Simon Pasquier <spasquie@redhat.com>
2021-02-24 21:01:28 +01:00
Lucas Hild d35cf369f2
Add expression explorer (Closes #8211) (#8404)
* Add expression explorer

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Add final new line to all files

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Rename expression to metric

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Pass dedicated metrics array to metrics explorer

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix styling of button

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Use append instead of prepend

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Update max width of modal

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix code style

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix inconsistent variable naming

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix modal title

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix tests

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Prevent request from being cached

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Remove timestamp from request

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Update button selector in test

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Refactor passing down metric names and query history

Signed-off-by: Lucas Hild <git@lucas-hild.de>

* Fix code style

Signed-off-by: Lucas Hild <git@lucas-hild.de>
2021-02-19 23:42:20 +01:00
Ben Kochie f8779137d0
Update web UI package.json
Update several NPM version pinnings.

Signed-off-by: Ben Kochie <superq@gmail.com>
2021-02-11 15:51:56 +01:00
Julien Pivotto b61d7b3b69
Update javascript dependencies (#8465)
Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2021-02-10 18:00:20 +01:00
Julius Volz b6544c9048 Fix label name leak into class name
Similar to https://github.com/prometheus/prometheus/pull/7902, this could lead
to style bugs for label names that correspond to styled CSS class names.

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2021-02-08 22:24:49 +01:00
Łukasz Mierzwa 885674c5c0
[UI] Fix duplicated keys on /targets page (#8456)
* [UI] Add a test for duplicated keys in EndpointLink component

I've noticed that I'm getting warnings about multiple children with the same key on /targets page.
This adds a test that fails when that happens.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>

* [UI] Fix duplicated keys on /targets page

Since any URI we render on /targets page can have multi-value params we should use both name and value as components keys.

Signed-off-by: Łukasz Mierzwa <l.mierzwa@gmail.com>
2021-02-08 22:17:04 +01:00
alex-petrov-vt 91eef5e3bf
Added warnings into react Panel on the Graph page (#8427)
Signed-off-by: Alex Petrov <alex.petrov.vt@gmail.com>
2021-01-31 13:48:32 +01:00
Nguyen Le Vu Long cd1dafc2fd
tsdb: Expose total number of label pairs in head in TSDB stats page (#8343)
* tsdb: Expose total number of label pairs in head

Signed-off-by: Nguyen Le Vu Long <vulongvn98@gmail.com>

* fix: add comment for NumLabelPairs

Signed-off-by: Nguyen Le Vu Long <vulongvn98@gmail.com>

* fix: remove comment

Signed-off-by: Nguyen Le Vu Long <vulongvn98@gmail.com>
2021-01-07 12:11:32 +05:30
beorn7 2346fd934c Update React dependencies prior to v2.24 release
Signed-off-by: beorn7 <beorn@grafana.com>
2020-12-30 00:15:12 +01:00
dependabot[bot] abe85ce052
Bump ini from 1.3.5 to 1.3.8 in /web/ui/react-app
Bumps [ini](https://github.com/isaacs/ini) from 1.3.5 to 1.3.8.
- [Release notes](https://github.com/isaacs/ini/releases)
- [Commits](https://github.com/isaacs/ini/compare/v1.3.5...v1.3.8)

Signed-off-by: dependabot[bot] <support@github.com>
2020-12-15 22:50:00 +00:00
Ganesh Vernekar c2ce236de1
Upgrade react deps (#8207)
Signed-off-by: Ganesh Vernekar <cs15btech11018@iith.ac.in>
2020-11-19 17:10:29 +01:00
Julien Pivotto f97fba7cc9
React UI: Change "metrics autocomplete" with "autocomplete" (#8174)
- First, it is currently not only removing "metric" autocomplete, but
also "query history autocomplete", so the checkbox is confusing.
- Then, in the future, we will want also "functions" autocomplete.

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-11-12 11:48:48 +01:00
Julien Pivotto 8dd0a3e9a3
Fix button display when there is no panels (#8155)
Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-11-06 16:34:35 +01:00
Julius Volz 3470ee1fbf
Make React UI the default, keep old UI under /classic (#8142)
The React app's assets are now served under /assets, while all old
custom web assets (including the ones for console templates) are now
served from /classic/static.

I tested different combinations of --web.external-url and
--web.route-prefix with proxies in front, and I couldn't find a problem
yet with the routing. Console templates also still work.

While migrating old endpoints to /classic, I noticed that /version was
being treated like a lot of the old UI pages, with readiness check
handler in front of it, etc. I kept it in /version and removed that
readiness wrapper, since it doesn't seem to be needed for that endpoint.

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2020-11-03 14:51:48 +01:00
Jarod Watkins 388a2d20c9
UI: Add toggle to enable/disable metric autocomplete (#8134)
* UI: Add toggle to enable/disable metric autocomplete

This change adds a toggle to enable or disable the metric autocomplete
functionality. By default it is enabled. This is a port of a change I
did in [Thanos][1].

[1]: https://github.com/thanos-io/thanos/pull/3381

Signed-off-by: Jarod Watkins <jarod@42lines.net>

* Adding full variable name

Signed-off-by: Jarod Watkins <jarod@42lines.net>
2020-11-02 16:16:54 +01:00
James Ranson 1cffda5de7
react updates for pathPrefix (#7979)
* dynamically determine path prefix

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* minor changes per PR review

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* use Context for apiPath and pathPrefix

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* remove unhandled "/version" path

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* only process index once instead of on every req

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* remove unneeded tag fragment

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* switch api path to const

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* revert

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* update tests

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* linter updates

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* simplify

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>

* updates per peer review

Signed-off-by: James Ranson <james_ranson@cable.comcast.com>
2020-10-22 17:22:32 +02:00
Frederic Branczyk b97a1bb7d1
web/ui/react-app/yarn.lock: Update UI dependencies
Signed-off-by: Frederic Branczyk <fbranczyk@gmail.com>
2020-10-08 09:32:17 +02:00
Dustin Hooten 916dbd4c8a
React UI: Implement missing TSDB head stats section (#7876)
* React UI: Implement missing TSDB head stats section

Signed-off-by: Dustin Hooten <dhooten@splunk.com>

* Add break

Signed-off-by: Dustin Hooten <dhooten@splunk.com>
2020-09-29 22:05:33 +02:00
Luke Chen 68d65a8ac5
Add the "assets" make target and change directory note in readme (#7908)
* add the "assets" make target and change directory note in readme

Signed-off-by: Luke Chen <showuon@gmail.com>

* address reviewer's comment

Signed-off-by: Luke Chen <showuon@gmail.com>
2020-09-16 15:01:48 +02:00
Julien Pivotto a6ee1f8517
Merge pull request #7913 from prometheus/release-2.21
Merge release 2.21 into master
2020-09-09 11:08:32 +02:00
Julius Volz 01daddeb75
Fix styling bug for target labels with special names (#7902)
Adding the label name as a CSS class can break styling and other
behavior when the label name has a special meaning in CSS. E.g. the
"container" label was displayed at 100% width because it was interpreted
to be a bootstrap container layout element.

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2020-09-06 22:10:25 +02:00
Jaga Santagostino 3ebffa7e20
add key to StatusWithStatusIndicator component in loop (#6879)
Signed-off-by: Jaga Santagostino <jagasantagostino@gmail.com>
2020-08-31 16:47:35 +02:00
Stefan Büringer d30f202c08
Fix Experimental UI for cookie based authentication (#7827)
We're using Prometheus behind a reverse proxy which authenticates everything based on cookies.
Without this attribute the cookie is not send with the request for the manifest.json

Signed-off-by: Stefan Bueringer <sbueringer@gmail.com>
2020-08-27 22:50:32 +02:00
Julien Pivotto 88d563eb2e
Fix react UI bug with series going on and off (#7804)
* Fix react UI bug with series going on and off

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-08-22 21:03:19 +02:00
Ben Kochie b9437cba50
Bump various react versions (#7820)
Update several `yarn outdated` pacakges.

Signed-off-by: Ben Kochie <superq@gmail.com>
2020-08-22 21:02:50 +02:00
Julius Volz a1601274ba
Support new duration format in graph range input (#7833)
* Support new duration format in graph range input

This is to make the duration parsing and formatting in the graph range
input field consistent with the new duration formatting introduced for
the configuration and PromQL
(https://github.com/prometheus/prometheus/pull/7713).

Ranges were previously handled in seconds - these are now handled in
milliseconds everywhere, as this makes things nicer / easier.

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Fixups

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2020-08-21 11:53:11 +02:00
Ben Kochie 8cccbf5b0e
Update various UI components (#7807)
* Correct jquery version in prom.lib.
* Update to bootstrap 4.5.2.
* Bump yarn versions.

Signed-off-by: Ben Kochie <superq@gmail.com>
2020-08-15 22:31:30 +02:00
Julius Volz 818bd96381
Fix detail swatch glitch (#7805)
* Bump jquery and @types/jquery

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Properly close color box span in graph hover detail

jQuery 3.5.0 introcuded a breaking change that was necessary to fix HTML
security issues
(https://blog.jquery.com/2020/04/10/jquery-3-5-0-released/), and as a
result the detail-swatch span wasn't closed properly anymore, because
spans are not valid self-closing tags in
XHTML.

Fixes https://github.com/prometheus/prometheus/issues/7803

Signed-off-by: Julius Volz <julius.volz@gmail.com>

* Fix up tests

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2020-08-15 01:44:13 +02:00
Simon Pasquier 1380e6c885
web/ui/react-app: bump version of create-react-app (#7778)
Signed-off-by: Simon Pasquier <spasquie@redhat.com>
2020-08-11 17:49:09 +02:00
Julien Pivotto a92ae7196b
React: update dependencies (#7709)
- Fix lodash security issue
- Fix minors style issues detected by the upgrade

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-08-04 23:30:35 +02:00
Julien Pivotto 38fec5345d
React UI: Multiple improvements on /rules page (#7606)
* Add duration on rules page, hide annotation and labels if empty

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-07-21 11:55:09 +02:00
Julien Pivotto fe8d412ce9
React UI: Add duration, labels, annotations to alerts page (#7605)
* React UI: Add duration, labels, annotation to alerts page

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* lint

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* make expression shorter

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* Check for null

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* Use object.keys

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-07-21 10:49:33 +02:00
Julien Pivotto a3ac9fa5f5
Add custom title to React UI (#7607)
* Backport custom title to React UI

Backports #4841 into the new UI.

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>

* Fix typo

Signed-off-by: Julien Pivotto <roidelapluie@inuits.eu>
2020-07-21 10:48:29 +02:00
Simon Pasquier 3155642108
web/ui/react-app: bump elliptic package version (#7477)
Signed-off-by: Simon Pasquier <spasquie@redhat.com>
2020-06-29 10:28:05 +02:00
Mark Hansen f0a439bfc5
Web: Scroll hash-fragment links with navbar height (#7456)
Previously, hash-fragment links like this:
http://mark-t510:9090/targets#job-alertmanager

Would scroll to have the header at the top, obscured by the nav bar.

Tested in both old and new UIs.

Fixes #7434

Signed-off-by: Mark Hansen <markhansen@google.com>
2020-06-27 09:12:11 +02:00
Nuno Cardoso f97d2ddb6e
REACT UI: CollapsibleAlertPanel - value field more friendly human readable (scientific notation -> number) (#7426)
* value field more human readable

Signed-off-by: kisc <nuno_kisc@hotmail.com>

* fix typo

Signed-off-by: Nuno Cardoso <nuno_kisc@hotmail.com>

* add function convertSCToNumber

Signed-off-by: nunokisc <nuno_kisc@hotmail.com>

* add convertSCToNumber test

Signed-off-by: nunokisc <nuno_kisc@hotmail.com>

* normalize function name

Signed-off-by: kisc <nuno_kisc@hotmail.com>

* convertScientificNotationToNumber to parsePrometheusFloat

Signed-off-by: kisc <nuno_kisc@hotmail.com>
2020-06-23 20:10:56 +02:00
Lisa Carpenter dff31c2826
preserve state on page reload for alert status filters and annotations with useLocalStorage(), add toggleAnnotations method, and add passing tests (#7374)
Signed-off-by: Lisa Carpenter <carpenter.lisa@gmail.com>
2020-06-10 16:44:07 +02:00
Ben Kochie e963d953ea
Update yarn.lock (#7356)
Fixes websocket-extensions security warning.

Signed-off-by: Ben Kochie <superq@gmail.com>
2020-06-07 17:56:31 +02:00
Ben Kochie c7d9516695
Bump jquery to fix secuirty warning (#7311)
* Use major version dependency to make updates easier.
* Pin to >= 3.5.

Signed-off-by: Ben Kochie <superq@gmail.com>
2020-05-29 15:40:39 +02:00
Julius Volz 6e19c4697d
React UI: Don't null out data when clicking on current tab (#7243)
Fixes https://github.com/prometheus/prometheus/issues/7241

Signed-off-by: Julius Volz <julius.volz@gmail.com>
2020-05-15 14:03:15 +02:00
Chris Marchbanks 62bd77bf93
Fix react tests (#7077)
https://github.com/facebook/create-react-app/issues/8689 is causing our
tests to fail in the CI pipeline. As the comments suggest, downgrading
to react-scripts 3.4.0 fixes the problem.

In addition, fix a test warning due to a missing id field.

Signed-off-by: Chris Marchbanks <csmarchbanks@gmail.com>
2020-04-01 16:37:52 +02:00