mirror of
https://github.com/prometheus/prometheus.git
synced 2024-11-17 11:04:05 -08:00
95554074d8
* React UI: Support custom path prefixes The challenge was that the path prefix can be set dynamically as a flag on Prometheus, but the React app bundle is statically compiled in to expect a given path prefix. By adding a placeholder value to the React app's index.html and replacing it in Prometheus with the right path prefix during serving, this injects Prometheus's path prefix into the React app via a global const. Threading the path prefix into the different React components could have been done with React's Contexts (https://reactjs.org/docs/context.html), but I found the consumer side of context values to be a bit cumbersome (wrapping entire components in context consumers), so I ended up preferring direct threading of the path prefix values to components that needed them. Also, using contexts in tests is more verbose than just passing in path prefix values directly. Fixes https://github.com/prometheus/prometheus/issues/6163 Signed-off-by: Julius Volz <julius.volz@gmail.com> * Review feedback Signed-off-by: Julius Volz <julius.volz@gmail.com>
50 lines
1.9 KiB
HTML
Executable file
50 lines
1.9 KiB
HTML
Executable file
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, shrink-to-fit=no"
|
|
/>
|
|
<meta name="theme-color" content="#000000" />
|
|
|
|
<!--
|
|
This constant's placeholder magic value is replaced during serving by Prometheus
|
|
and set to Prometheus's external URL path. It gets prepended to all links back
|
|
to Prometheus, both for asset loading as well as API accesses.
|
|
-->
|
|
<script>const PATH_PREFIX='PATH_PREFIX_PLACEHOLDER';</script>
|
|
|
|
<!--
|
|
manifest.json provides metadata used when your web app is added to the
|
|
homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
|
-->
|
|
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
|
<!--
|
|
Notice the use of %PUBLIC_URL% in the tags above.
|
|
It will be replaced with the URL of the `public` folder during the build.
|
|
Only files inside the `public` folder can be referenced from the HTML.
|
|
|
|
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
|
|
work correctly both with client-side routing and a non-root public URL.
|
|
Learn how to configure a non-root public URL by running `npm run build`.
|
|
-->
|
|
<title>Prometheus Expression Browser</title>
|
|
</head>
|
|
<body>
|
|
<noscript>You need to enable JavaScript to run this app.</noscript>
|
|
<div id="root"></div>
|
|
<!--
|
|
This HTML file is a template.
|
|
If you open it directly in the browser, you will see an empty page.
|
|
|
|
You can add webfonts, meta tags, or analytics to this file.
|
|
The build step will place the bundled scripts into the <body> tag.
|
|
|
|
To begin the development, run `npm start` or `yarn start`.
|
|
To create a production bundle, use `npm run build` or `yarn build`.
|
|
-->
|
|
</body>
|
|
</html>
|