perf: optimize CI format job + widen lefthook + add ruff for Python (CopilotKit#4812)

## Summary

- **lefthook**: Widen pre-commit glob from JS/TS-only to match CI's full
file
coverage (json, md, css, yml, yaml, html, vue, py). Add `ruff format`
for
  Python files.
- **CI format job**: Replace full `pnpm install` (~8min) with standalone
binary
installs (`oxfmt` + `ruff`, ~10s). Add Python formatting to both PR and
  push-to-main paths.

## Why

The format job took 8+ minutes because it ran `pnpm install
--frozen-lockfile`
to get the oxfmt binary. oxfmt and ruff are both standalone Rust
binaries that
don't need the monorepo's node_modules. Local lefthook only covered
JS/TS
extensions, so JSON/YAML/MD/Python formatting was only enforced in CI —
after
the push.

## Test plan

- [x] lefthook.yml YAML validates
- [x] static_quality.yml YAML validates
- [ ] CI format job runs in <30s (was ~8min)
- [ ] Lefthook pre-commit catches formatting in JSON/MD/Python files

Author: jpr5

.github/workflows/static_quality.yml

@@ -27,7 +27,7 @@ env:
 jobs:
   format:
     runs-on: ubuntu-latest
-    timeout-minutes: 10
+    timeout-minutes: 5
     permissions:
       contents: write
 
@@ -41,21 +41,11 @@ jobs:
           # tip to scope the formatter to PR-changed files.
           fetch-depth: 0
 
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v4
-        with:
-          version: "10.13.1"
+      - name: Install oxfmt
+        run: npm install -g oxfmt@0.36
 
-      - name: Use Node.js 20
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20.x
-          # setup-node built-in cache is fork-safe (fork PRs can't write to base repo cache)
-          cache: "pnpm"
-          cache-dependency-path: "**/pnpm-lock.yaml"
-
-      - name: Install dependencies
-        run: pnpm install --frozen-lockfile
+      - name: Install ruff
+        run: pipx install ruff
 
       - name: Collect PR-changed files for formatting
         if: github.event_name == 'pull_request'
@@ -84,7 +74,7 @@ jobs:
             '*.js' '*.jsx' '*.ts' '*.tsx' '*.mjs' '*.cjs' \
             '*.json' '*.jsonc' '*.json5' \
             '*.md' \
-            '*.css' '*.yml' '*.yaml' '*.html' '*.vue' \
+            '*.css' '*.yml' '*.yaml' '*.html' '*.vue' '*.py' \
             ':!**/package-lock.json' ':!**/pnpm-lock.yaml' ':!**/yarn.lock' \
             > .pr-format-files.txt
           : > .pr-format-files.existing.txt
@@ -100,18 +90,29 @@ jobs:
         run: |
           if [ "${{ github.event_name }}" = "pull_request" ]; then
             if [ "${{ steps.changed.outputs.count }}" = "0" ]; then
-              echo "No formattable files changed in this PR — skipping oxfmt."
+              echo "No formattable files changed in this PR — skipping."
               exit 0
             fi
-            if ! xargs -a .pr-format-files.existing.txt pnpm exec oxfmt --no-error-on-unmatched-pattern --write; then
-              echo "::warning::Formatter exited with error — auto-fix may be incomplete"
+            # oxfmt: auto-fix JS/TS/JSON/MD/CSS/YAML/HTML/Vue
+            if ! xargs -a .pr-format-files.existing.txt oxfmt --no-error-on-unmatched-pattern --write; then
+              echo "::warning::oxfmt exited with error — auto-fix may be incomplete"
+            fi
+            # ruff: auto-fix Python
+            py_files=$(grep -E '\.py$' .pr-format-files.existing.txt || true)
+            if [ -n "$py_files" ]; then
+              echo "$py_files" | xargs ruff format || echo "::warning::ruff format exited with error"
             fi
             if [ -n "$(git diff --name-only)" ]; then
               echo "format_fixed=true" >> $GITHUB_ENV
             fi
-            xargs -a .pr-format-files.existing.txt pnpm exec oxfmt --no-error-on-unmatched-pattern --check
+            # Check mode: verify everything is formatted
+            xargs -a .pr-format-files.existing.txt oxfmt --no-error-on-unmatched-pattern --check
+            if [ -n "$py_files" ]; then
+              echo "$py_files" | xargs ruff format --check
+            fi
           else
-            pnpm run check-format
+            oxfmt --check .
+            ruff format --check .
           fi
 
       - name: Commit formatting fixes

lefthook.yml

@@ -29,7 +29,7 @@ pre-commit:
       # still invokes this hook with an empty expansion, and oxlint/oxfmt
       # would default to operating on the current directory, defeating the
       # scoping entirely. stage_fixed re-stages whatever the hooks modify.
-      glob: "*.{js,jsx,ts,tsx,mjs,cjs}"
+      glob: "*.{js,jsx,ts,tsx,mjs,cjs,json,jsonc,json5,md,css,yml,yaml,html,vue,py}"
       # Mirror the ignorePatterns in .oxlintrc.json / .oxfmtrc.json at the
       # hook layer. Without this, a docs-only commit expands {staged_files}
       # to a single docs/** path; oxlint silently processes 0 files, then
@@ -39,7 +39,9 @@ pre-commit:
         - "docs/**"
       run: |
         if [ -n "{staged_files}" ]; then
-          pnpm exec oxlint --fix {staged_files} && pnpm exec oxfmt --write {staged_files}
+          pnpm exec oxlint --fix {staged_files} &&
+          pnpm exec oxfmt --write {staged_files} ;
+          ruff format {staged_files} 2>/dev/null || true
         fi
       stage_fixed: true
     test-and-check-packages:

showcase/shell-dashboard/src/components/__tests__/compute-tally-detail.test.tsx

@@ -1,4 +1,4 @@
-import { describe, it, expect, vi, beforeEach } from "vitest";
+import { describe, it, expect, vi } from "vitest";
 import type { LiveStatusMap, StatusRow } from "@/lib/live-status";
 import type { Integration, Feature } from "@/lib/registry";
 
@@ -10,62 +10,27 @@ vi.mock("@/lib/registry", () => ({
   getFeatureCategories: vi.fn(() => []),
 }));
 
-// Mock live-status module before importing the function under test
-vi.mock("@/lib/live-status", async () => {
-  const actual =
-    await vi.importActual<typeof import("@/lib/live-status")>(
-      "@/lib/live-status",
-    );
-  return {
-    ...actual,
-    keyFor: vi.fn(actual.keyFor),
-    resolveCell: vi.fn(),
-  };
-});
-
 import { computeColumnTallyDetail } from "@/components/feature-grid";
-import { keyFor, resolveCell } from "@/lib/live-status";
-import type { CellState, BadgeRender } from "@/lib/live-status";
-
-const mockedResolveCell = vi.mocked(resolveCell);
 
 /* ------------------------------------------------------------------ */
 /*  Helpers                                                             */
 /* ------------------------------------------------------------------ */
 
-function makeRow(overrides: Partial<StatusRow> = {}): StatusRow {
+function makeRow(
+  key: string,
+  dimension: string,
+  state: StatusRow["state"],
+): StatusRow {
   return {
-    id: "row-1",
-    key: "health:test-slug",
-    dimension: "health",
-    state: "green",
+    id: key,
+    key,
+    dimension,
+    state,
     signal: null,
     observed_at: "2026-04-28T00:00:00Z",
     transitioned_at: "2026-04-28T00:00:00Z",
     fail_count: 0,
     first_failure_at: null,
-    ...overrides,
-  };
-}
-
-function makeBadge(tone: string): BadgeRender {
-  return {
-    tone: tone as BadgeRender["tone"],
-    label: tone,
-    tooltip: "",
-    row: null,
-  };
-}
-
-function makeCellState(e2eTone: string): CellState {
-  return {
-    e2e: makeBadge(e2eTone),
-    smoke: makeBadge("gray"),
-    health: makeBadge("gray"),
-    d2: makeBadge("gray"),
-    d5: makeBadge("gray"),
-    d6: makeBadge("gray"),
-    rollup: e2eTone as CellState["rollup"],
   };
 }
 
@@ -100,10 +65,6 @@ function makeFeature(id: string, name: string): Feature {
 /* ------------------------------------------------------------------ */
 
 describe("computeColumnTallyDetail", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
   it("returns unknown: true with empty arrays when connection is error", () => {
     const integration = makeIntegration("test-int", ["feat-1"]);
     const features = [makeFeature("feat-1", "Feature 1")];
@@ -122,27 +83,21 @@ describe("computeColumnTallyDetail", () => {
       red: [],
       unknown: true,
     });
-    // resolveCell should NOT be called when connection is error
-    expect(mockedResolveCell).not.toHaveBeenCalled();
   });
 
-  it("collects health green + 1 e2e green + 1 e2e red", () => {
+  it("green D3 cells land in green bucket", () => {
     const integration = makeIntegration("my-int", ["feat-a", "feat-b"]);
     const features = [
       makeFeature("feat-a", "Feature A"),
       makeFeature("feat-b", "Feature B"),
     ];
 
-    const healthKey = keyFor("health", "my-int");
+    // Both features have green D3 → achievedDepth=3, ceilingDepth=3 → green chip
     const liveStatus: LiveStatusMap = new Map([
-      [healthKey, makeRow({ key: healthKey, state: "green" })],
+      ["e2e:my-int/feat-a", makeRow("e2e:my-int/feat-a", "e2e", "green")],
+      ["e2e:my-int/feat-b", makeRow("e2e:my-int/feat-b", "e2e", "green")],
     ]);
 
-    // feat-a e2e → green, feat-b e2e → red
-    mockedResolveCell
-      .mockReturnValueOnce(makeCellState("green"))
-      .mockReturnValueOnce(makeCellState("red"));
-
     const result = computeColumnTallyDetail(
       integration,
       features,
@@ -152,27 +107,26 @@ describe("computeColumnTallyDetail", () => {
 
     expect(result.unknown).toBe(false);
     expect(result.green).toEqual([
-      { label: "Health (Up)", dimension: "health" },
       { label: "Feature A", dimension: "e2e", featureId: "feat-a" },
-    ]);
-    expect(result.red).toEqual([
       { label: "Feature B", dimension: "e2e", featureId: "feat-b" },
     ]);
     expect(result.amber).toEqual([]);
+    expect(result.red).toEqual([]);
   });
 
-  it("collects amber e2e features when no health data exists", () => {
-    const integration = makeIntegration("no-health", ["feat-x", "feat-y"]);
+  it("red D3 cells are gray (achievedDepth=0) and excluded", () => {
+    const integration = makeIntegration("my-int", ["feat-a", "feat-b"]);
     const features = [
-      makeFeature("feat-x", "Feature X"),
-      makeFeature("feat-y", "Feature Y"),
+      makeFeature("feat-a", "Feature A"),
+      makeFeature("feat-b", "Feature B"),
     ];
-    const liveStatus: LiveStatusMap = new Map();
 
-    // Both features → amber
-    mockedResolveCell
-      .mockReturnValueOnce(makeCellState("amber"))
-      .mockReturnValueOnce(makeCellState("amber"));
+    // feat-a: D3=red → achievedDepth=0, ceilingDepth=3 → gray (skipped)
+    // feat-b: D3=green → green chip
+    const liveStatus: LiveStatusMap = new Map([
+      ["e2e:my-int/feat-a", makeRow("e2e:my-int/feat-a", "e2e", "red")],
+      ["e2e:my-int/feat-b", makeRow("e2e:my-int/feat-b", "e2e", "green")],
+    ]);
 
     const result = computeColumnTallyDetail(
       integration,
@@ -182,24 +136,24 @@ describe("computeColumnTallyDetail", () => {
     );
 
     expect(result.unknown).toBe(false);
-    expect(result.green).toEqual([]);
-    expect(result.red).toEqual([]);
-    expect(result.amber).toEqual([
-      { label: "Feature X", dimension: "e2e", featureId: "feat-x" },
-      { label: "Feature Y", dimension: "e2e", featureId: "feat-y" },
+    expect(result.green).toEqual([
+      { label: "Feature B", dimension: "e2e", featureId: "feat-b" },
     ]);
+    expect(result.amber).toEqual([]);
+    expect(result.red).toEqual([]);
   });
 
-  it("skips features that have no matching demo", () => {
+  it("features without demos are gray (unwired) and excluded", () => {
     // Integration only has demo for feat-1, not feat-2
     const integration = makeIntegration("partial", ["feat-1"]);
     const features = [
       makeFeature("feat-1", "Feature 1"),
       makeFeature("feat-2", "Feature 2"),
     ];
-    const liveStatus: LiveStatusMap = new Map();
 
-    mockedResolveCell.mockReturnValueOnce(makeCellState("green"));
+    const liveStatus: LiveStatusMap = new Map([
+      ["e2e:partial/feat-1", makeRow("e2e:partial/feat-1", "e2e", "green")],
+    ]);
 
     const result = computeColumnTallyDetail(
       integration,
@@ -209,23 +163,20 @@ describe("computeColumnTallyDetail", () => {
     );
 
     expect(result.unknown).toBe(false);
-    // Only feat-1 appears (has a demo); feat-2 is absent
+    // Only feat-1 appears (has a demo); feat-2 is unwired → gray → excluded
     expect(result.green).toEqual([
       { label: "Feature 1", dimension: "e2e", featureId: "feat-1" },
     ]);
     expect(result.amber).toEqual([]);
     expect(result.red).toEqual([]);
-    // resolveCell was only called once (for feat-1)
-    expect(mockedResolveCell).toHaveBeenCalledTimes(1);
   });
 
-  it("routes degraded health to amber bucket", () => {
-    const integration = makeIntegration("degraded-int", []);
+  it("health-only data produces no tally items (health not in cell model)", () => {
+    const integration = makeIntegration("health-only", []);
     const features: Feature[] = [];
 
-    const healthKey = keyFor("health", "degraded-int");
     const liveStatus: LiveStatusMap = new Map([
-      [healthKey, makeRow({ key: healthKey, state: "degraded" })],
+      ["health:health-only", makeRow("health:health-only", "health", "red")],
     ]);
 
     const result = computeColumnTallyDetail(
@@ -235,21 +186,26 @@ describe("computeColumnTallyDetail", () => {
       "live",
     );
 
-    expect(result.amber).toEqual([
-      { label: "Health (Up)", dimension: "health" },
-    ]);
+    // No features → no cells → nothing counted
     expect(result.green).toEqual([]);
+    expect(result.amber).toEqual([]);
     expect(result.red).toEqual([]);
     expect(result.unknown).toBe(false);
   });
 
-  it("routes red health to red bucket", () => {
-    const integration = makeIntegration("red-int", []);
-    const features: Feature[] = [];
+  it("not_supported_features are gray and excluded", () => {
+    const integration = {
+      ...makeIntegration("ns-int", ["feat-a", "feat-b"]),
+      not_supported_features: ["feat-b"],
+    };
+    const features = [
+      makeFeature("feat-a", "Feature A"),
+      makeFeature("feat-b", "Feature B"),
+    ];
 
-    const healthKey = keyFor("health", "red-int");
     const liveStatus: LiveStatusMap = new Map([
-      [healthKey, makeRow({ key: healthKey, state: "red" })],
+      ["e2e:ns-int/feat-a", makeRow("e2e:ns-int/feat-a", "e2e", "green")],
+      ["e2e:ns-int/feat-b", makeRow("e2e:ns-int/feat-b", "e2e", "green")],
     ]);
 
     const result = computeColumnTallyDetail(
@@ -259,9 +215,12 @@ describe("computeColumnTallyDetail", () => {
       "live",
     );
 
-    expect(result.red).toEqual([{ label: "Health (Up)", dimension: "health" }]);
-    expect(result.green).toEqual([]);
-    expect(result.amber).toEqual([]);
     expect(result.unknown).toBe(false);
+    // feat-a: green; feat-b: unsupported → gray → excluded
+    expect(result.green).toEqual([
+      { label: "Feature A", dimension: "e2e", featureId: "feat-a" },
+    ]);
+    expect(result.amber).toEqual([]);
+    expect(result.red).toEqual([]);
   });
 });