test

torchci/clickhouse_queries/benchmark_v3/list_commit_query/params.json

@@ -0,0 +1,16 @@
+{
+  "params": {
+    "repo": "String",
+    "benchmarkNames": "Array<String>",
+    "branches": "Array<String>",
+    "models": "Array(String)",
+    "startTime": "DateTime64(3)",
+    "stopTime": "DateTime64(3)",
+    "backends": "Array(String)",
+    "arch": "String",
+    "dtype": "String",
+    "device": "String",
+    "mode": "String"
+  },
+  "tests": []
+}

torchci/clickhouse_queries/benchmark_v3/list_commit_query/query.sql

@@ -0,0 +1,42 @@
+SELECT
+    replaceAll(head_branch, 'refs/heads/', '') AS branch,
+    head_sha AS commit,
+    workflow_id,
+    toStartOfHour(min(fromUnixTimestamp(timestamp))) AS date
+FROM benchmark.oss_ci_benchmark_metadata
+PREWHERE
+    timestamp >= toUnixTimestamp({startTime: DateTime64(3)})
+    AND timestamp <  toUnixTimestamp({stopTime:  DateTime64(3)})   -- ← closed )
+WHERE
+    repo = {repo: String}
+    AND (
+        has({branches: Array(String)}, replaceAll(head_branch, 'refs/heads/', ''))
+        OR empty({branches: Array(String)})
+    )
+    AND (benchmark_dtype = {dtype: String} OR empty({dtype: String}))
+    AND (
+        has({benchmarkNames: Array(String)}, benchmark_name)
+        OR empty({benchmarkNames: Array(String)})
+    )
+    AND notEmpty(metric_name)
+    AND notEmpty(device)
+    AND (
+        arch LIKE concat('%', {arch: String}, '%')
+        OR {arch: String} = ''
+    )
+    AND (
+        has({models: Array(String) }, model_name)
+        OR empty({models: Array(String) })
+    )
+    AND (
+        has({backends: Array(String) }, model_backend)
+        OR empty({backends: Array(String) })
+    )
+    AND (
+        startsWith({device: String }, device)
+        OR {device: String } = ''
+    )
+GROUP BY
+    branch, commit, workflow_id
+ORDER BY
+    branch, date

torchci/clickhouse_queries/compilers_benchmark_api_commit_query/params.json

@@ -7,8 +7,7 @@
     "mode": "String",
     "startTime": "DateTime64(3)",
     "stopTime": "DateTime64(3)",
-    "suites": "Array(String)",
-    "workflowIds": "Array(Int64)"
+    "suites": "Array(String)"
   },
   "tests": []
 }

torchci/clickhouse_queries/compilers_benchmark_api_query/params.json

@@ -3,6 +3,7 @@
     "branches": "Array(String)",
     "commits": "Array(String)",
     "compilers": "Array(String)",
+    "workflows": "Array(UInt64)",
     "device": "String",
     "arch": "Array(String)",
     "dtype": "String",

torchci/clickhouse_queries/compilers_benchmark_api_query/query.sql

@@ -18,7 +18,7 @@ SELECT
         AS granularity_bucket
 FROM benchmark.oss_ci_benchmark_torchinductor
 WHERE
-    head_sha IN ({commits: Array(String)})
+    workflow_id IN ({workflows: Array(UInt64)})
     AND (
         has(
             {branches: Array(String)},

torchci/components/benchmark/llms/LLMsBenchmarkPage.tsx

@@ -139,6 +139,7 @@ const MainPage = ({
     );
   }, [router.query]);
   const queryParams = getLLMsBenchmarkPropsQueryParameter(props);
+
   const { data, error, isLoading } = useBenchmarkPropsData(queryParams);
 
   // an error occured while fetching the benchmark props data

torchci/components/benchmark/v3/components/benchmarkSideBar/BenchmarkTopBar.tsx

@@ -1,15 +1,15 @@
 import { Divider, Paper, Typography } from "@mui/material";
 import { Stack } from "@mui/system";
-import { BenchmarkUI } from "../../configs/configBook";
 import { BenchmarkReportFeatureNotification } from "../dataRender/components/benchmarkRegressionReport/BenchmarkReportFeatureNotification";
 import { BenchmarkReportFeatureSidePanel } from "../dataRender/components/benchmarkRegressionReport/BenchmarkReportFeatureSidePanel";
-import { CommitWorflowSelectSection } from "./components/CommitWorkfowSelectSection";
+import { CommitWorflowSelectSection } from "./components/commitAndWorkflow/CommitWorkfowSelectSection";
+import { BenchmarkUIConfigHandler } from "lib/benchmark/store/benchmark_config_book";
 
 export function BenchmarkTopBar({
   config,
   title = "",
 }: {
-  config: BenchmarkUI;
+  config: BenchmarkUIConfigHandler;
   title?: string;
 }) {
   const reportFeature =

torchci/components/benchmark/v3/components/benchmarkSideBar/components/SideBarMainSection.tsx

@@ -9,15 +9,15 @@ import { UMCopyLink } from "components/uiModules/UMCopyLink";
 import { UMDateButtonPicker } from "components/uiModules/UMDateRangePicker";
 import { UMDenseButtonLight } from "components/uiModules/UMDenseComponents";
 import dayjs from "dayjs";
-import { useBenchmarkCommitsData } from "lib/benchmark/api_helper/apis/hooks";
+import { useBenchmarkCommitsData } from "lib/benchmark/api_helper/fe/hooks";
 import { useDashboardSelector } from "lib/benchmark/store/benchmark_dashboard_provider";
 import { useRouter } from "next/router";
 import { useEffect, useRef, useState } from "react";
-import { BenchmarkUIConfigBook } from "../../../configs/configBook";
 import { DenseAlert } from "../../common/styledComponents";
-import { BranchDropdowns } from "./BranchDropdown";
-import { SamplingSetting } from "./SamplingSetting";
+import { BranchDropdowns } from "./commitAndWorkflow/BranchDropdown";
+import { SamplingSetting } from "./sampling/SamplingSetting";
 import { useUrlStoreSync } from "./useUrlSync";
+import { useBenchmarkBook } from "lib/benchmark/store/benchmark_config_book";
 
 const styles = {
   root: {
@@ -68,13 +68,19 @@ export function SideBarMainSection() {
 
   // 1) Read benchmarkId (low-churn) to fetch config
   const benchmarkId = useDashboardSelector((s) => s.benchmarkId);
-  const config = BenchmarkUIConfigBook.instance.get(benchmarkId);
-  const dataBinding =
-    BenchmarkUIConfigBook.instance.getDataBinding(benchmarkId);
-  const required_filter_fields = config?.required_filter_fields ?? [];
+
+
+  const getConfig = useBenchmarkBook((s) => s.getConfig);
+  const config = getConfig(benchmarkId);
+  const dataBinding = config.dataBinding;
+
+
+  const required_filter_fields = config.raw?.required_filter_fields ?? [];
 
   // 2) One selector (with shallow inside useDashboardSelector) for the rest
   const {
+    repo,
+    benchmarkName,
     stagedTime,
     stagedFilters,
     stagedLbranch,
@@ -118,6 +124,9 @@ export function SideBarMainSection() {
     lcommit: s.lcommit,
     rcommit: s.rcommit,
 
+    repo: s.repo,
+    benchmarkName: s.benchmarkName,
+
     commitMainOptions: s.commitMainOptions,
     revertMainOptions: s.revertMainOptions,
   }));
@@ -147,9 +156,10 @@ export function SideBarMainSection() {
     (enableSamplingSetting ? !!stagedMaxSampling : true) &&
     required_filter_fields.every((k) => !!committedFilters[k]);
 
-  const params = BenchmarkUIConfigBook.instance
-    .getDataBinding(benchmarkId)
+  const params = dataBinding
     ?.toQueryParams({
+      repo: repo,
+      benchmarkName: benchmarkName,
       timeRange: stagedTime,
       filters: stagedFilters,
       maxSampling: enableSamplingSetting ? stagedMaxSampling : undefined,

torchci/components/benchmark/v3/components/benchmarkSideBar/components/BranchDropdown.tsx → torchci/components/benchmark/v3/components/benchmarkSideBar/components/commitAndWorkflow/BranchDropdown.tsx

@@ -1,6 +1,6 @@
 import { Box } from "@mui/system";
 import { UMDenseDropdown } from "components/uiModules/UMDenseComponents";
-import { DenseAlert } from "../../common/styledComponents";
+import { DenseAlert } from "../../../common/styledComponents";
 
 type BranchDropdownsProps = {
   type: string;

torchci/components/benchmark/v3/components/benchmarkSideBar/components/CommitWorkfowSelectSection.tsx → torchci/components/benchmark/v3/components/benchmarkSideBar/components/commitAndWorkflow/CommitWorkfowSelectSection.tsx

@@ -2,11 +2,11 @@ import { Typography } from "@mui/material";
 import { Stack } from "@mui/system";
 import { QueryParameterConverterInputs } from "components/benchmark/v3/configs/utils/dataBindingRegistration";
 import { UMDenseCommitDropdown } from "components/uiModules/UMDenseComponents";
-import { useBenchmarkCommitsData } from "lib/benchmark/api_helper/apis/hooks";
+import { useBenchmarkCommitsData } from "lib/benchmark/api_helper/fe/hooks";
 import { useDashboardSelector } from "lib/benchmark/store/benchmark_dashboard_provider";
 import { BenchmarkCommitMeta } from "lib/benchmark/store/benchmark_regression_store";
 import { useEffect, useState } from "react";
-import { BenchmarkUIConfigBook } from "../../../configs/configBook";
+import { useBenchmarkBook } from "lib/benchmark/store/benchmark_config_book";
 
 /**
  *
@@ -15,6 +15,8 @@ import { BenchmarkUIConfigBook } from "../../../configs/configBook";
  */
 export function CommitWorflowSelectSection() {
   const {
+    repo,
+    benchmarkName,
     benchmarkId,
     committedTime,
     committedFilters,
@@ -32,6 +34,8 @@ export function CommitWorflowSelectSection() {
     committedFilters: s.committedFilters,
     committedMaxSampling: s.committedMaxSampling,
     enableSamplingSetting: s.enableSamplingSetting,
+    repo: s.repo,
+    benchmarkName: s.benchmarkName,
     lcommit: s.lcommit,
     rcommit: s.rcommit,
     committedLBranch: s.committedLbranch,
@@ -43,10 +47,10 @@ export function CommitWorflowSelectSection() {
   const [leftList, setLeftList] = useState<BenchmarkCommitMeta[]>([]);
   const [rightList, setRightList] = useState<BenchmarkCommitMeta[]>([]);
 
-  const config = BenchmarkUIConfigBook.instance.get(benchmarkId);
-  const dataBinding =
-    BenchmarkUIConfigBook.instance.getDataBinding(benchmarkId);
-  const required_filter_fields = config?.required_filter_fields ?? [];
+  const getConfig = useBenchmarkBook((s) => s.getConfig);
+  const config = getConfig(benchmarkId);
+  const dataBinding = config.dataBinding
+  const required_filter_fields = config.raw?.required_filter_fields ?? [];
 
   const ready =
     !!committedTime?.start &&
@@ -67,6 +71,8 @@ export function CommitWorflowSelectSection() {
 
   // Convert to query params
   const params = dataBinding.toQueryParams({
+    repo: repo,
+    benchmarkName: benchmarkName,
     branches,
     timeRange: committedTime,
     filters: committedFilters,

torchci/components/benchmark/v3/components/benchmarkSideBar/components/filters/BenchmarkFilterDropdownGroup.tsx

@@ -0,0 +1,65 @@
+import { Stack } from "@mui/system";
+import { DTypePicker } from "components/benchmark/ModeAndDTypePicker";
+import { UMDenseDropdown, UMDenseDropdownOption } from "components/uiModules/UMDenseComponents";
+import { DropdownGroupItem } from "lib/benchmark/llms/types/dashboardPickerTypes";
+
+/**
+ * The enum type of benchmark dashboard dropgroup item
+ * this is used to render dropdowns dynamically in the LLMs Benchmark page.
+ * the field value must match the fields in LLMsBenchmarkProps
+ */
+export enum BenchmarkDropdownGroupItemType {
+  ModelName = "model",
+  BackendName = "backend",
+  ModeName = "modeN",
+  DtypeName = "dtype",
+  DeviceName = "deviceName",
+  ArchName = "arch",
+  Qps = "qps",
+}
+
+/**
+ * The input item for benchmark dashboard dropdown
+ * @property DropdownGroupItemType enum type
+ * @property options the list of options in the dropdown
+ * @property labelName the label name of the dropdown
+ */
+export interface BenchmarkDropdownGroupItem {
+  type: BenchmarkDropdownGroupItemType;
+  options: (string | UMDenseDropdownOption)[]
+  labelName: string;
+}
+
+export default function BenchmarkDropdownGroup({
+  onChange,
+  props,
+  optionListMap,
+}: {
+  onChange: (_key: string, _value: any) => void;
+  props: any;
+  optionListMap: BenchmarkDropdownGroupItem[];
+}) {
+  return (
+    <Stack spacing={1}>
+      {optionListMap.length > 1 &&
+        optionListMap.map((option, index) => {
+          const type = option.type;
+          const olist = option.options;
+          if (!olist || olist.length <= 1) {
+            return null;
+          }
+          return (
+            <UMDenseDropdown
+              key={index}
+              dtype={props[type]}
+              setDType={(val: any) => {
+                onChange(type, val);
+              }}
+              dtypes={olist}
+              label={option.labelName}
+            />
+          );
+        })}
+    </Stack>
+  );
+}

torchci/components/benchmark/v3/components/benchmarkSideBar/components/filters/DefaultSideBarMetricsDropdowns.tsx

@@ -0,0 +1,72 @@
+import LoadingPage from "components/common/LoadingPage";
+import { useBenchmarkConfigBook, useListBenchmarkMetadata } from "lib/benchmark/api_helper/fe/hooks";
+import { useDashboardSelector } from "lib/benchmark/store/benchmark_dashboard_provider";
+import { RenderRawContent } from "../../../common/RawContentDialog";
+import { Box } from "@mui/system";
+import BenchmarkDropdownGroup from "./BenchmarkFilterDropdownGroup";
+import { Alert } from "@mui/material";
+
+export default function DefaultMetricsDropdowns() {
+  const {
+      setStagedFilter,
+      repo,
+      benchmarkId,
+      benchmarkName,
+      stagedTime,
+      stagedFilters
+    } = useDashboardSelector((s) => ({
+      setStagedFilter: s.setStagedFilter,
+      repo: s.repo,
+      benchmarkName: s.benchmarkName,
+      benchmarkId: s.benchmarkId,
+      stagedTime: s.stagedTime,
+      stagedFilters: s.stagedFilters,
+    }));
+
+  const configHandler = useBenchmarkConfigBook(benchmarkId)
+  if (!configHandler) {
+    return  <LoadingPage />
+  }
+
+  const ready =!!stagedTime?.start && !!stagedTime?.end
+  // convert to the query params
+  const params = configHandler.dataBinding.toQueryParams({
+    repo: repo,
+    benchmarkName: benchmarkName,
+    timeRange: stagedTime,
+    filters: {},
+  });
+
+  const queryParams: any | null = ready ? params : null;
+  // fetch the bechmark data
+
+  const {
+    data: resp,
+    isLoading: isLoading,
+    error: error,
+  } = useListBenchmarkMetadata(benchmarkId, queryParams);
+
+  if (isLoading) {
+    return <LoadingPage />;
+  }
+
+  if (error) {
+    return <Alert severity="error"> DefaultMetricsDropdowns {error.message}</Alert>
+  }
+
+  const metadataList = resp?.data || [];
+
+  return <Box>
+    <RenderRawContent data={resp} type="json" title="tawta" buttonName="result"/>
+    <BenchmarkDropdownGroup optionListMap={metadataList} onChange={(_key:string, _value:any)=> {
+      if (_key == "deviceName"){
+        const v = _value.split("||");
+        if (v.length === 2) {
+          setStagedFilter("device", v[0]);
+          setStagedFilter("arch", v[1]);
+        }
+      }
+      setStagedFilter(_key, _value);
+    }} props={stagedFilters} />
+    </Box>
+}