Merge pull request #34245 from storybookjs/chore/root_oxfmt

Cleanup: Unify oxlint at root and add more file to format
(cherry picked from commit b31240c)

Author: huang-julien

.github/workflows/nx.yml

@@ -32,7 +32,7 @@ jobs:
 
     runs-on: ubuntu-latest
     env:
-      ALL_TASKS: compile,check,knip,test,pretty-docs,lint,sandbox,build,e2e-tests,e2e-tests-dev,test-runner,vitest-integration,check-sandbox,e2e-ui,jest,vitest,playwright-ct,cypress
+      ALL_TASKS: compile,check,knip,test,lint,sandbox,build,e2e-tests,e2e-tests-dev,test-runner,vitest-integration,check-sandbox,e2e-ui,jest,vitest,playwright-ct,cypress
     steps:
       - uses: actions/checkout@v4
         with:

.husky/pre-commit

@@ -1,7 +1,3 @@
 if [ -z "$SKIP_STORYBOOK_GIT_HOOKS" ]; then
-  cd code
-  yarn lint-staged
-
-  cd ../scripts
   yarn lint-staged
 fi

.lintstagedrc.mjs

@@ -0,0 +1,11 @@
+import { detectAgent } from 'std-env';
+
+const fmtCmd = detectAgent().name ? 'oxfmt' : 'oxfmt --check';
+
+export default {
+  'code/**/*.{js,jsx,mjs,ts,tsx,html,json}': [fmtCmd, 'yarn --cwd code lint:js:cmd'],
+  'scripts/**/*.{html,js,json,jsx,mjs,ts,tsx}': ['yarn --cwd scripts lint:js:cmd'],
+  'docs/_snippets/**/*.{js,jsx,mjs,ts,tsx,html,json}': [fmtCmd],
+  '**/*.ejs': ['yarn --cwd scripts exec ejslint'],
+  '**/package.json': ['yarn --cwd scripts lint:package'],
+};

.nx/workflows/distribution-config.yaml

@@ -14,7 +14,6 @@ assignment-rules:
       - compile
       - check
       - lint
-      - pretty-docs
       - knip
     run-on:
       - agent: linux-js

.oxfmtrc.json

@@ -1,4 +1,5 @@
 {
+  "$schema": "./node_modules/oxfmt/configuration_schema.json",
   "printWidth": 100,
   "tabWidth": 2,
   "bracketSpacing": true,
@@ -7,20 +8,61 @@
   "arrowParens": "always",
   "sortPackageJson": false,
   "ignorePatterns": [
-    "code",
-    "test-storybooks",
-    "node_modules",
+    "*.bundle.js",
+    "*.js.map",
     ".yarn",
-    ".nx",
     ".vscode",
-    ".github",
-    "*.md",
-    "*.mdx",
+    ".nx/cache",
+    ".nx/workspace-data",
+    "dist",
+    "build",
+    "bench",
+    "coverage",
+    "node_modules",
+    "storybook-static",
+    "built-storybooks",
+    "ember-output",
+    "code/core/assets",
+    "code/core/report",
+    "code/core/src/core-server/presets/common-manager.ts",
+    "code/core/src/core-server/utils/__search-files-tests__",
+    "code/core/src/core-server/utils/__mockdata__/src/Empty.stories.ts",
+    "code/lib/codemod/src/transforms/__testfixtures__",
+    "code/frameworks/angular/template/**",
+    "code/lib/eslint-plugin",
+    ".prettierrc",
+    "test-storybooks",
     "*.yml",
     "*.yaml",
-    "docs/versions",
-    "CHANGELOG*",
-    "MIGRATION*",
-    "CONTRIBUTING*"
+    "*.md",
+    "*.mdx",
+    "!docs/_snippets/**"
+  ],
+  "overrides": [
+    {
+      "files": ["docs/_snippets/**"],
+      "options": {
+        "trailingComma": "all"
+      }
+    },
+    {
+      "files": ["*.md", "*.mdx"],
+      "options": {
+        "importOrderSeparation": false,
+        "importOrderSortSpecifiers": false
+      }
+    },
+    {
+      "files": ["*.component.html"],
+      "options": {
+        "parser": "angular"
+      }
+    },
+    {
+      "files": ["**/frameworks/angular/src/**/*.ts", "**/frameworks/angular/template/**/*.ts"],
+      "options": {
+        "parser": "babel-ts"
+      }
+    }
   ]
 }

.vscode/extensions.json

@@ -3,6 +3,7 @@
     "dbaeumer.vscode-eslint",
     "EditorConfig.EditorConfig",
     "unifiedjs.vscode-mdx",
-    "yzhang.markdown-all-in-one"
+    "yzhang.markdown-all-in-one",
+    "oxc.oxc-vscode"
   ]
-}
+}

.vscode/settings.json

@@ -1,30 +1,25 @@
 {
-  "[javascript]": {
-    "editor.defaultFormatter": "dbaeumer.vscode-eslint",
-    "editor.formatOnSave": true
-  },
-  "[javascriptreact]": {
-    "editor.defaultFormatter": "dbaeumer.vscode-eslint",
-    "editor.formatOnSave": true
-  },
-  "[typescript]": {
+  "[javascript][javascriptreact][typescript][typescriptreact][json][jsonc]": {
     "editor.defaultFormatter": "oxc.oxc-vscode",
     "editor.formatOnSave": true
   },
-  "[typescriptreact]": {
-    "editor.defaultFormatter": "dbaeumer.vscode-eslint",
-    "editor.formatOnSave": true
-  },
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": "explicit"
+    "source.fixAll.eslint": "explicit",
+    "source.fixAll.oxc": "explicit"
   },
   "editor.formatOnSave": true,
   "editor.tabSize": 2,
-  "eslint.format.enable": true,
   "eslint.options": {
     "cache": true,
     "cacheLocation": ".cache/eslint",
-    "extensions": [".js", ".jsx", ".mjs", ".json", ".ts", ".tsx"]
+    "extensions": [
+      ".js",
+      ".jsx",
+      ".mjs",
+      ".json",
+      ".ts",
+      ".tsx"
+    ]
   },
   "eslint.useESLintClass": true,
   "eslint.validate": [
@@ -35,9 +30,13 @@
     "typescript",
     "typescriptreact"
   ],
-  "eslint.workingDirectories": ["./code", "./scripts"],
+  "eslint.workingDirectories": [
+    "./code",
+    "./scripts"
+  ],
   "files.associations": {
-    "*.js": "javascriptreact"
+    "*.js": "javascriptreact",
+    ".oxfmtrc.json": "json"
   },
   "javascript.preferences.importModuleSpecifier": "relative",
   "javascript.preferences.quoteStyle": "single",
@@ -51,4 +50,6 @@
   "typescript.tsdk": "./typescript/lib",
   "vitest.workspaceConfig": "./code/vitest.workspace.ts",
   "vitest.rootConfig": "./code/vitest.workspace.ts",
-}
+  "oxc.fmt.configPath": ".oxfmtrc.json",
+  "oxc.enable.oxlint": false,
+}

AGENTS.md

@@ -243,6 +243,8 @@ Use Storybook loggers instead of raw `console.*` in normal code paths:
 - Server-side: `storybook/internal/node-logger`
 - Client-side: `storybook/internal/client-logger`
 
+The pre-commit hook automatically detects AI agents (via `std-env`) and switches from check-only to write mode, so formatting is auto-fixed when agents commit.
+
 Avoid `console.log`, `console.warn`, and `console.error` unless the file is isolated enough that importing the logger is not reasonable.
 
 ## Troubleshooting

code/.oxfmtrc.json

@@ -70,10 +70,10 @@
         if (hostname !== 'localhost' && globalThis.CONFIG_TYPE === 'DEVELOPMENT') {
           const message = `Failed to load the Storybook preview file 'vite-app.js':
 
-It looks like you're visiting the Storybook development server on another hostname than localhost: '${hostname}', but you haven't configured the necessary security features to support this.
-Please re-run your Storybook development server with the '--host ${hostname}' flag, or manually configure your Vite allowedHosts configuration with viteFinal.
+      It looks like you're visiting the Storybook development server on another hostname than localhost: '${hostname}', but you haven't configured the necessary security features to support this.
+      Please re-run your Storybook development server with the '--host ${hostname}' flag, or manually configure your Vite allowedHosts configuration with viteFinal.
 
-See:`;
+      See:`;
           const docs = [
             'https://storybook.js.org/docs/api/cli-options#dev',
             'https://storybook.js.org/docs/api/main-config/main-config-vite-final',
@@ -85,7 +85,7 @@
             `<p style="color: red; max-width: 70ch">${message.replaceAll(
               '\n',
               '<br/>'
-            )}<ul>${docs.map((doc) => `<li><a href='${doc}' target='_blank'>${doc}</a></li>`).join('')}<ul></p>`;
+            )}<ul>${docs.map((doc) => `<li><a href='${doc}' target='_blank'>${doc}</a></li>`).join('')}</ul></p>`;
           return;
         }
       }