Commit 0dd5fffe authored by Webb, Jake's avatar Webb, Jake
Browse files

Added a system information request for gauges

parent f35eafdd

src/App.tsx

+1 −0
Original line number Diff line number Diff line
@@ -33,6 +33,7 @@ kc.init({ 
        axios.defaults.headers.common = {

          Authorization: `Bearer ${kc.token}`,

        };

        console.log(import.meta.env.VITE_API_PATH);

        axios.defaults.baseURL = import.meta.env.VITE_API_PATH;

        axios.defaults.withCredentials = true;

      }

src/components/simulations/details/gauges.tsx

+6 −2
Original line number Diff line number Diff line
@@ -2,6 +2,8 @@ import { GraphHeader } from "../../shared/plots/graphHeader"; 
import { CoolingCDU } from "../../../models/CoolingCDU.model";

import { Gauge } from "../../shared/plots/gauge";

import { SimulationStatistic } from "../../../models/SimulationStatistic.model";

import { useQuery } from "@tanstack/react-query";

import { getFrontierSystemInformation } from "../../../util/queryOptions";



function GaugeWrapper(props: { children: React.ReactNode }) {

  return (
@@ -18,6 +20,8 @@ export function SimulationGauges({ 
  metrics?: CoolingCDU[];

  statistics?: SimulationStatistic;

}) {

  const { data } = useQuery(getFrontierSystemInformation());



  return (

    <>

      <div className="flex flex-col">
@@ -85,7 +89,7 @@ export function SimulationGauges({ 
            labels={{

              tickLabels: {

                type: "outer",

                ticks: [{ value: 500 }, { value: 1000 }, { value: 1500 }],

                ticks: [{ value: data?.peak_flops ?? 0 }],

              },

              valueLabel: {

                formatTextValue: (value) => value + " PFlop/s",
@@ -106,7 +110,7 @@ export function SimulationGauges({ 
            labels={{

              tickLabels: {

                type: "outer",

                ticks: [{ value: 500 }, { value: 1000 }, { value: 1500 }],

                ticks: [{ value: data?.g_flops_w_peak ?? 0 }],

              },

              valueLabel: {

                formatTextValue: (value) => value + " GFlops/watts",

src/routes/__root.tsx

+4 −0
Original line number Diff line number Diff line
@@ -2,12 +2,16 @@ import { Outlet, createRootRouteWithContext } from "@tanstack/react-router"; 
import { RouterContext } from "../App";

import { ReactQueryDevtools } from "@tanstack/react-query-devtools";

import { Nav } from "../components/shared/nav";

import { useQuery } from "@tanstack/react-query";

import { getFrontierSystemInformation } from "../util/queryOptions";



export const Route = createRootRouteWithContext<RouterContext>()({

  component: Root,

});



function Root() {

  useQuery(getFrontierSystemInformation());



  return (

    <div className="flex h-screen">

      <Nav />

src/util/queryOptions.ts

+13 −0
Original line number Diff line number Diff line
@@ -118,3 +118,16 @@ export const simulationSystemStatsQueryOptions = ({ 
      return res.data;

    },

  });



export const getFrontierSystemInformation = () =>

  queryOptions({

    queryKey: ["frontier", "system-info"],

    queryFn: async () => {

      const res = await axios.get<{

        peak_flops: number;

        peak_power: number;

        g_flops_w_peak: number;

      }>(`frontier/system-info`);

      return res.data;

    },

  });