diff --git a/.gitignore b/.gitignore
index e85d766b0..f4ed7242b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,7 +22,8 @@ benchmark.txt
/documentation/examples/remote_storage/example_write_adapter/example_write_adapter
npm_licenses.tar.bz2
-/web/ui/static/react
+/web/ui/static/react-app
+/web/ui/static/mantine-ui
/vendor
/.build
diff --git a/Makefile b/Makefile
index ab229f931..f9a02fc28 100644
--- a/Makefile
+++ b/Makefile
@@ -48,6 +48,10 @@ ui-bump-version:
.PHONY: ui-install
ui-install:
cd $(UI_PATH) && npm install
+ # The old React app has been separated from the npm workspaces setup to avoid
+ # issues with conflicting dependencies. This is a temporary solution until the
+ # new Mantine-based UI is fully integrated and the old app can be removed.
+ cd $(UI_PATH)/react-app && npm install
.PHONY: ui-build
ui-build:
@@ -64,6 +68,10 @@ ui-test:
.PHONY: ui-lint
ui-lint:
cd $(UI_PATH) && npm run lint
+ # The old React app has been separated from the npm workspaces setup to avoid
+ # issues with conflicting dependencies. This is a temporary solution until the
+ # new Mantine-based UI is fully integrated and the old app can be removed.
+ cd $(UI_PATH)/react-app && npm run lint
.PHONY: assets
assets: ui-install ui-build
diff --git a/cmd/prometheus/main.go b/cmd/prometheus/main.go
index e36665857..05553bfa0 100644
--- a/cmd/prometheus/main.go
+++ b/cmd/prometheus/main.go
@@ -230,6 +230,9 @@ func (c *flagConfig) setFeatureListOptions(logger log.Logger) error {
continue
case "promql-at-modifier", "promql-negative-offset":
level.Warn(logger).Log("msg", "This option for --enable-feature is now permanently enabled and therefore a no-op.", "option", o)
+ case "new-ui":
+ c.web.UseNewUI = true
+ level.Info(logger).Log("msg", "Serving experimental new web UI.")
default:
level.Warn(logger).Log("msg", "Unknown option for --enable-feature", "option", o)
}
@@ -446,7 +449,7 @@ func main() {
a.Flag("scrape.discovery-reload-interval", "Interval used by scrape manager to throttle target groups updates.").
Hidden().Default("5s").SetValue(&cfg.scrape.DiscoveryReloadInterval)
- a.Flag("enable-feature", "Comma separated feature names to enable. Valid options: agent, auto-gomemlimit, exemplar-storage, expand-external-labels, memory-snapshot-on-shutdown, promql-at-modifier, promql-negative-offset, promql-per-step-stats, promql-experimental-functions, remote-write-receiver (DEPRECATED), extra-scrape-metrics, new-service-discovery-manager, auto-gomaxprocs, no-default-scrape-port, native-histograms, otlp-write-receiver. See https://prometheus.io/docs/prometheus/latest/feature_flags/ for more details.").
+ a.Flag("enable-feature", "Comma separated feature names to enable. Valid options: agent, auto-gomemlimit, exemplar-storage, expand-external-labels, memory-snapshot-on-shutdown, promql-at-modifier, promql-negative-offset, promql-per-step-stats, promql-experimental-functions, remote-write-receiver (DEPRECATED), extra-scrape-metrics, new-service-discovery-manager, auto-gomaxprocs, no-default-scrape-port, native-histograms, otlp-write-receiver, new-ui. See https://prometheus.io/docs/prometheus/latest/feature_flags/ for more details.").
Default("").StringsVar(&cfg.featureList)
promlogflag.AddFlags(a, &cfg.promlogConfig)
diff --git a/docs/feature_flags.md b/docs/feature_flags.md
index 04d9ff365..bb75811bb 100644
--- a/docs/feature_flags.md
+++ b/docs/feature_flags.md
@@ -193,7 +193,7 @@ This should **only** be applied to metrics that currently produce such labels.
`--enable-feature=otlp-write-receiver`
The OTLP receiver allows Prometheus to accept [OpenTelemetry](https://opentelemetry.io/) metrics writes.
-Prometheus is best used as a Pull based system, and staleness, `up` metric, and other Pull enabled features
+Prometheus is best used as a Pull based system, and staleness, `up` metric, and other Pull enabled features
won't work when you push OTLP metrics.
## Experimental PromQL functions
@@ -224,3 +224,9 @@ When the `concurrent-rule-eval` feature flag is enabled, rules without any depen
This has the potential to improve rule group evaluation latency and resource utilization at the expense of adding more concurrent query load.
The number of concurrent rule evaluations can be configured with `--rules.max-concurrent-rule-evals`, which is set to `4` by default.
+
+## Experimental new web UI
+
+Enables the new experimental web UI instead of the old and stable web UI. The new UI is a complete rewrite and aims to be cleaner, less cluttered, and more modern under the hood. It is not feature complete yet and is still under active development.
+
+`--enable-feature=new-ui`
diff --git a/scripts/ui_release.sh b/scripts/ui_release.sh
index ea4423d25..c1b872fd3 100755
--- a/scripts/ui_release.sh
+++ b/scripts/ui_release.sh
@@ -30,8 +30,8 @@ function publish() {
cmd+=" --dry-run"
fi
for workspace in ${workspaces}; do
- # package "app" is private so we shouldn't try to publish it.
- if [[ "${workspace}" != "react-app" ]]; then
+ # package "mantine-ui" is private so we shouldn't try to publish it.
+ if [[ "${workspace}" != "mantine-ui" ]]; then
cd "${workspace}"
eval "${cmd}"
cd "${root_ui_folder}"
diff --git a/web/ui/build_ui.sh b/web/ui/build_ui.sh
index f0b496efd..62568aaa3 100644
--- a/web/ui/build_ui.sh
+++ b/web/ui/build_ui.sh
@@ -30,10 +30,19 @@ function buildModule() {
}
function buildReactApp() {
+ echo "build react-app"
+ cd react-app
+ npm run build
+ cd ..
+ rm -rf ./static/react-app
+ mv ./react-app/build ./static/react-app
+}
+
+function buildMantineUI() {
echo "build mantine-ui"
npm run build -w @prometheus-io/mantine-ui
- rm -rf ./static/react
- mv ./mantine-ui/dist ./static/react
+ rm -rf ./static/mantine-ui
+ mv ./mantine-ui/dist ./static/mantine-ui
}
for i in "$@"; do
@@ -41,6 +50,7 @@ for i in "$@"; do
--all)
buildModule
buildReactApp
+ buildMantineUI
shift
;;
--build-module)
diff --git a/web/ui/mantine-ui/index.html b/web/ui/mantine-ui/index.html
index f54cf951c..deb5f7f56 100644
--- a/web/ui/mantine-ui/index.html
+++ b/web/ui/mantine-ui/index.html
@@ -2,7 +2,7 @@
-
+