Dashboard arm

.changeset/warm-wasps-boil.md

@@ -0,0 +1,7 @@
+---
+"@azure-tools/cadl-ranch-coverage-sdk": minor
+"@azure-tools/cadl-ranch-dashboard": minor
+"@azure-tools/cadl-ranch": minor
+---
+
+Add dashboard for Azure Resource Manager.

packages/cadl-ranch-coverage-sdk/src/constants.ts

@@ -1 +1,4 @@
-export const GeneratorMode: string[] = ["azure", "standard"];
+export enum GeneratorMode {
+  azure = "azure",
+  standard = "standard",
+}

packages/cadl-ranch-dashboard/README.md

@@ -3,11 +3,11 @@
 ## Dev
 
 ```bash
-npm start
+npm run start
 # or
-npm dev
+npm run dev
 ```
 
 ## Show the test generator
 
-Add `?showtest=true` query parameter to url https://localhost:5173/?showtest=true
+Add `?showtest=true` query parameter to url http://localhost:5173/?showtest=true

packages/cadl-ranch-dashboard/src/apis.ts

@@ -1,9 +1,11 @@
 import {
   CadlRanchCoverageClient,
+  GeneratorMode,
   ResolvedCoverageReport,
+  ScenarioData,
   ScenarioManifest,
-  GeneratorMode,
 } from "@azure-tools/cadl-ranch-coverage-sdk";
+import { TableConfig, TableConfigs } from "./constants.js";
 
 const storageAccountName = "azuresdkcadlranch";
 
@@ -35,7 +37,7 @@ const generatorNames: GeneratorNames[] = [
 export interface CoverageSummary {
   manifest: ScenarioManifest;
   generatorReports: Record<GeneratorNames, ResolvedCoverageReport | undefined>;
-  mode: string;
+  tableConfig: TableConfig;
 }
 
 let client: CadlRanchCoverageClient | undefined;
@@ -57,34 +59,42 @@ export async function getCoverageSummaries(): Promise<CoverageSummary[]> {
     coverageClient.manifest.get(),
     loadReports(coverageClient, generatorNames),
   ]);
-  return GeneratorMode.map((mode) => ({
-    manifest,
-    generatorReports: generatorReports[mode],
-    mode,
-  }));
+  return TableConfigs.map((config) => {
+    const copiedManifest: ScenarioManifest = JSON.parse(JSON.stringify(manifest));
+    copiedManifest.scenarios = manifest.scenarios.filter((scenarioData: ScenarioData) =>
+      config.scenarioFilter ? config.scenarioFilter(scenarioData.name) : () => true,
+    );
+    return {
+      manifest: copiedManifest,
+      generatorReports: generatorReports[config.mode],
+      tableConfig: config,
+    };
+  });
 }
 
 async function loadReports(
   coverageClient: CadlRanchCoverageClient,
   generatorNames: GeneratorNames[],
 ): Promise<{ [mode: string]: Record<GeneratorNames, ResolvedCoverageReport | undefined> }> {
   const results = await Promise.all(
-    GeneratorMode.map(async (mode): Promise<[string, Record<GeneratorNames, ResolvedCoverageReport | undefined>]> => {
-      const items = await Promise.all(
-        generatorNames.map(async (generatorName): Promise<[GeneratorNames, ResolvedCoverageReport | undefined]> => {
-          try {
-            const report = await coverageClient.coverage.getLatestCoverageFor(generatorName, mode);
-            return [generatorName, report];
-          } catch (error) {
-            // eslint-disable-next-line no-console
-            console.error("Error resolving report", error);
+    Object.keys(GeneratorMode).map(
+      async (mode): Promise<[string, Record<GeneratorNames, ResolvedCoverageReport | undefined>]> => {
+        const items = await Promise.all(
+          generatorNames.map(async (generatorName): Promise<[GeneratorNames, ResolvedCoverageReport | undefined]> => {
+            try {
+              const report = await coverageClient.coverage.getLatestCoverageFor(generatorName, mode);
+              return [generatorName, report];
+            } catch (error) {
+              // eslint-disable-next-line no-console
+              console.error("Error resolving report", error);
 
-            return [generatorName, undefined];
-          }
-        }),
-      );
-      return [mode, Object.fromEntries(items) as any];
-    }),
+              return [generatorName, undefined];
+            }
+          }),
+        );
+        return [mode, Object.fromEntries(items) as any];
+      },
+    ),
   );
 
   return results.reduce<{ [mode: string]: Record<GeneratorNames, ResolvedCoverageReport | undefined> }>(

packages/cadl-ranch-dashboard/src/components/dashboard-table.tsx

@@ -144,9 +144,15 @@ const DashboardHeaderRow: FunctionComponent<DashboardHeaderRowProps> = ({ covera
     }
     return [language, getCompletedRatio(coverageSummary.manifest.scenarios, report), report];
   });
+  let tableHeader;
+  if (coverageSummary.tableConfig.name) {
+    tableHeader = <th>Scenario name ({coverageSummary.tableConfig.name})</th>;
+  } else {
+    tableHeader = <th>Scenario name ({coverageSummary.tableConfig.mode})</th>;
+  }
   return (
     <tr>
-      <th>Scenario name (mode: {coverageSummary.mode})</th>
+      {tableHeader}
       {data.map(([lang, status, report]) => (
         <GeneratorHeaderCell key={lang} status={status} report={report} language={lang} />
       ))}
@@ -286,5 +292,19 @@ function createTree(manifest: ScenarioManifest): ManifestTreeNode {
 
     current.scenario = scenario;
   }
-  return root;
+
+  return cutTillMultipleChildren(root);
+}
+
+function cutTillMultipleChildren(node: ManifestTreeNode): ManifestTreeNode {
+  let newRoot: ManifestTreeNode = node;
+  while (newRoot.children) {
+    if (Object.keys(newRoot.children).length === 1) {
+      newRoot = Object.values(newRoot.children)[0];
+    } else {
+      break;
+    }
+  }
+
+  return newRoot;
 }

packages/cadl-ranch-dashboard/src/constants.ts

@@ -1,3 +1,5 @@
+import { GeneratorMode } from "@azure-tools/cadl-ranch-coverage-sdk";
+
 export const Colors = {
   bgSubtle: "#f7f7f7",
   borderDefault: "#f0f0f0",
@@ -38,3 +40,22 @@ export const ScenarioStatusColors = {
   notSupported: Colors.borderDefault,
   fail: Colors.error,
 };
+
+export const TableConfigs: TableConfig[] = [
+  {
+    mode: GeneratorMode.azure,
+    scenarioFilter: (name) => !name.startsWith("Azure_ResourceManager_"),
+    name: "Azure DPG",
+  },
+  { mode: GeneratorMode.azure, scenarioFilter: (name) => name.startsWith("Azure_ResourceManager_"), name: "Azure MPG" },
+  {
+    mode: GeneratorMode.standard,
+    scenarioFilter: (name) => !name.startsWith("Azure_ResourceManager_"),
+  },
+];
+
+export interface TableConfig {
+  mode: GeneratorMode;
+  scenarioFilter?: (scenarioName: string) => boolean;
+  name?: string;
+}

packages/cadl-ranch/src/coverage/scenario-manifest.ts

@@ -38,6 +38,6 @@ export function createScenarioManifest(
       };
       return { name, scenarioDoc, location };
     }),
-    modes: GeneratorMode,
+    modes: Object.values(GeneratorMode),
   };
 }