diff --git a/app/vmui/packages/vmui/.env b/app/vmui/packages/vmui/.env new file mode 100644 index 000000000..39cc24b68 --- /dev/null +++ b/app/vmui/packages/vmui/.env @@ -0,0 +1 @@ +FAST_REFRESH=false \ No newline at end of file diff --git a/app/vmui/packages/vmui/README.md b/app/vmui/packages/vmui/README.md index fef9a3c8a..55328dc46 100644 --- a/app/vmui/packages/vmui/README.md +++ b/app/vmui/packages/vmui/README.md @@ -9,7 +9,8 @@ In the project directory, you can run: ### `npm start` Runs the app in the development mode.\ -Open [http://localhost:3000](http://localhost:3000) to view it in the browser. +Open [http://localhost:3000](http://localhost:3000) to view it in the browser.\ +Open [http://localhost:3000/#/icons](http://localhost:3000/#/icons) to view the icons used in the project. The page will reload if you make edits.\ You will also see any lint errors in the console. diff --git a/app/vmui/packages/vmui/src/App.tsx b/app/vmui/packages/vmui/src/App.tsx index 9709a1df5..86f0e3cea 100644 --- a/app/vmui/packages/vmui/src/App.tsx +++ b/app/vmui/packages/vmui/src/App.tsx @@ -10,6 +10,8 @@ import TopQueries from "./pages/TopQueries"; import ThemeProvider from "./components/Main/ThemeProvider/ThemeProvider"; import Spinner from "./components/Main/Spinner/Spinner"; import TracePage from "./pages/TracePage"; +import ExploreMetrics from "./pages/ExploreMetrics"; +import PreviewIcons from "./components/Main/Icons/PreviewIcons"; const App: FC = () => { @@ -50,6 +52,14 @@ const App: FC = () => { path={router.trace} element={} /> + } + /> + } + /> diff --git a/app/vmui/packages/vmui/src/api/explore-metrics.ts b/app/vmui/packages/vmui/src/api/explore-metrics.ts new file mode 100644 index 000000000..35713ed11 --- /dev/null +++ b/app/vmui/packages/vmui/src/api/explore-metrics.ts @@ -0,0 +1,16 @@ +import { TimeParams } from "../types"; + +export const getJobsUrl = (server: string, period: TimeParams): string => + `${server}/api/v1/label/job/values?start=${period.start}&end=${period.end}`; + +export const getInstancesUrl = (server: string, period: TimeParams, job: string): string => + `${server}/api/v1/label/instance/values?match[]={job="${encodeURIComponent(job)}"}&start=${period.start}&end=${period.end}`; + +export const getNamesUrl = (server: string, job: string, instance: string): string => { + const match = Object.entries({ job, instance }) + .filter(val => val[1]) + .map(([key, val]) => `${key}="${val}"`) + .join(","); + + return `${server}/api/v1/label/__name__/values?match[]={${encodeURIComponent(match)}}`; +}; diff --git a/app/vmui/packages/vmui/src/components/Layout/Footer/Footer.tsx b/app/vmui/packages/vmui/src/components/Layout/Footer/Footer.tsx index bd383a054..451148fc1 100644 --- a/app/vmui/packages/vmui/src/components/Layout/Footer/Footer.tsx +++ b/app/vmui/packages/vmui/src/components/Layout/Footer/Footer.tsx @@ -8,7 +8,7 @@ const Footer: FC = () => { return