feat(build): migrate from Prettier to Oxfmt for performant code formatting (#42434)

docs/src/theme/ApiExplorer/MethodEndpoint/index.tsx

@@ -24,10 +24,10 @@
  * so SSG can render the page without a store context.
  */
 
-import React from "react";
+import React from 'react';
 
-import BrowserOnly from "@docusaurus/BrowserOnly";
-import { useSelector } from "react-redux";
+import BrowserOnly from '@docusaurus/BrowserOnly';
+import { useSelector } from 'react-redux';
 
 interface ServerVariable {
   default?: string;
@@ -44,20 +44,20 @@ interface StoreState {
 
 function colorForMethod(method: string) {
   switch (method.toLowerCase()) {
-    case "get":
-      return "primary";
-    case "post":
-      return "success";
-    case "delete":
-      return "danger";
-    case "put":
-      return "info";
-    case "patch":
-      return "warning";
-    case "head":
-      return "secondary";
-    case "event":
-      return "secondary";
+    case 'get':
+      return 'primary';
+    case 'post':
+      return 'success';
+    case 'delete':
+      return 'danger';
+    case 'put':
+      return 'info';
+    case 'patch':
+      return 'warning';
+    case 'head':
+      return 'secondary';
+    case 'event':
+      return 'secondary';
     default:
       return undefined;
   }
@@ -66,7 +66,7 @@ function colorForMethod(method: string) {
 export interface Props {
   method: string;
   path: string;
-  context?: "endpoint" | "callback";
+  context?: 'endpoint' | 'callback';
 }
 
 // Inner component rendered only in the browser, where the Redux store exists.
@@ -74,11 +74,11 @@ function ServerUrl() {
   const serverValue = useSelector((state: StoreState) => state.server.value);
 
   if (serverValue && serverValue.variables) {
-    let serverUrlWithVariables = serverValue.url.replace(/\/$/, "");
-    Object.keys(serverValue.variables).forEach((variable) => {
+    let serverUrlWithVariables = serverValue.url.replace(/\/$/, '');
+    Object.keys(serverValue.variables).forEach(variable => {
       serverUrlWithVariables = serverUrlWithVariables.replace(
         `{${variable}}`,
-        serverValue.variables?.[variable].default ?? ""
+        serverValue.variables?.[variable].default ?? '',
       );
     });
     return <>{serverUrlWithVariables}</>;
@@ -93,8 +93,8 @@ function ServerUrl() {
 
 function MethodEndpoint({ method, path, context }: Props) {
   const renderServerUrl = () => {
-    if (context === "callback") {
-      return "";
+    if (context === 'callback') {
+      return '';
     }
     return <BrowserOnly>{() => <ServerUrl />}</BrowserOnly>;
   };
@@ -102,13 +102,13 @@ function MethodEndpoint({ method, path, context }: Props) {
   return (
     <>
       <pre className="openapi__method-endpoint">
-        <span className={"badge badge--" + colorForMethod(method)}>
-          {method === "event" ? "Webhook" : method.toUpperCase()}
-        </span>{" "}
-        {method !== "event" && (
+        <span className={'badge badge--' + colorForMethod(method)}>
+          {method === 'event' ? 'Webhook' : method.toUpperCase()}
+        </span>{' '}
+        {method !== 'event' && (
           <h2 className="openapi__method-endpoint-path">
             {renderServerUrl()}
-            {`${path.replace(/{([a-z0-9-_]+)}/gi, ":$1")}`}
+            {`${path.replace(/{([a-z0-9-_]+)}/gi, ':$1')}`}
           </h2>
         )}
       </pre>

docs/src/theme/DocVersionBadge/index.js

@@ -75,9 +75,13 @@ export default function DocVersionBadge() {
         if (afterBase.startsWith('/')) {
           const segments = afterBase.substring(1).split('/');
           // Check if first segment is a version (e.g., "1.1.0", "next")
-          if (segments[0] && (segments[0].match(/^\d+\.\d+\.\d+$/) || segments[0] === 'next')) {
+          if (
+            segments[0] &&
+            (segments[0].match(/^\d+\.\d+\.\d+$/) || segments[0] === 'next')
+          ) {
             // Skip the version segment
-            relativePath = segments.length > 1 ? '/' + segments.slice(1).join('/') : '';
+            relativePath =
+              segments.length > 1 ? '/' + segments.slice(1).join('/') : '';
           } else {
             // No version in path (e.g., /docs/intro for current version with empty path)
             relativePath = afterBase;

docs/src/theme/Playground/Preview/index.tsx

@@ -75,7 +75,7 @@ function PlaygroundLivePreview(): ReactNode {
       {() => (
         <>
           <ErrorBoundary
-            fallback={(params) => (
+            fallback={params => (
               <ErrorBoundaryErrorMessageFallback {...params} />
             )}
           >

docs/src/theme/ReactLiveScope/index.tsx

@@ -52,12 +52,21 @@ if (isBrowser) {
     // eslint-disable-next-line @typescript-eslint/no-require-imports
     const { Alert } = require('@apache-superset/core/components');
 
-    console.log('[ReactLiveScope] SupersetComponents keys:', Object.keys(SupersetComponents || {}).slice(0, 10));
-    console.log('[ReactLiveScope] Has Button?', 'Button' in (SupersetComponents || {}));
+    console.log(
+      '[ReactLiveScope] SupersetComponents keys:',
+      Object.keys(SupersetComponents || {}).slice(0, 10),
+    );
+    console.log(
+      '[ReactLiveScope] Has Button?',
+      'Button' in (SupersetComponents || {}),
+    );
 
     Object.assign(ReactLiveScope, SupersetComponents, { Alert });
 
-    console.log('[ReactLiveScope] Final scope keys:', Object.keys(ReactLiveScope).slice(0, 20));
+    console.log(
+      '[ReactLiveScope] Final scope keys:',
+      Object.keys(ReactLiveScope).slice(0, 20),
+    );
   } catch (e) {
     console.error('[ReactLiveScope] Failed to load Superset components:', e);
   }

docs/src/theme/Root.js

@@ -21,10 +21,27 @@ import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 
 // File extensions to track as downloads
 const DOWNLOAD_EXTENSIONS = [
-  'pdf', 'zip', 'tar', 'gz', 'tgz', 'bz2',
-  'exe', 'dmg', 'pkg', 'deb', 'rpm',
-  'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx',
-  'csv', 'json', 'yaml', 'yml',
+  'pdf',
+  'zip',
+  'tar',
+  'gz',
+  'tgz',
+  'bz2',
+  'exe',
+  'dmg',
+  'pkg',
+  'deb',
+  'rpm',
+  'doc',
+  'docx',
+  'xls',
+  'xlsx',
+  'ppt',
+  'pptx',
+  'csv',
+  'json',
+  'yaml',
+  'yml',
 ];
 
 // Scroll depth milestones to track
@@ -38,7 +55,9 @@ export default function Root({ children }) {
     const { matomoUrl, matomoSiteId } = customFields;
 
     if (typeof window !== 'undefined') {
-      const devMode = ['localhost', '127.0.0.1', '::1', '0.0.0.0'].includes(window.location.hostname);
+      const devMode = ['localhost', '127.0.0.1', '::1', '0.0.0.0'].includes(
+        window.location.hostname,
+      );
 
       // Initialize the _paq array
       window._paq = window._paq || [];
@@ -50,7 +69,10 @@ export default function Root({ children }) {
       window._paq.push(['setSiteId', matomoSiteId]);
 
       // Track downloads with custom extensions
-      window._paq.push(['setDownloadExtensions', DOWNLOAD_EXTENSIONS.join('|')]);
+      window._paq.push([
+        'setDownloadExtensions',
+        DOWNLOAD_EXTENSIONS.join('|'),
+      ]);
 
       // Now load the matomo.js script
       const script = document.createElement('script');
@@ -69,7 +91,11 @@ export default function Root({ children }) {
       // Helper to track site search
       const trackSiteSearch = (keyword, category, resultsCount) => {
         if (devMode) {
-          console.log('Matomo trackSiteSearch:', { keyword, category, resultsCount });
+          console.log('Matomo trackSiteSearch:', {
+            keyword,
+            category,
+            resultsCount,
+          });
         }
         window._paq.push(['trackSiteSearch', keyword, category, resultsCount]);
       };
@@ -82,9 +108,8 @@ export default function Root({ children }) {
         window._paq.push(['trackPageView']);
       };
 
-
       // Track external link clicks using domain as category (vendor-agnostic)
-      const handleLinkClick = (event) => {
+      const handleLinkClick = event => {
         const link = event.target.closest('a');
         if (!link) return;
 
@@ -106,20 +131,22 @@ export default function Root({ children }) {
 
       // Track Algolia search queries
       const setupAlgoliaTracking = () => {
-        const observer = new MutationObserver((mutations) => {
-          mutations.forEach((mutation) => {
-            mutation.addedNodes.forEach((node) => {
+        const observer = new MutationObserver(mutations => {
+          mutations.forEach(mutation => {
+            mutation.addedNodes.forEach(node => {
               if (node.nodeType === Node.ELEMENT_NODE) {
-                const searchInput = node.querySelector?.('.DocSearch-Input') ||
-                                   (node.classList?.contains('DocSearch-Input') ? node : null);
+                const searchInput =
+                  node.querySelector?.('.DocSearch-Input') ||
+                  (node.classList?.contains('DocSearch-Input') ? node : null);
                 if (searchInput) {
                   let debounceTimer;
-                  searchInput.addEventListener('input', (e) => {
+                  searchInput.addEventListener('input', e => {
                     clearTimeout(debounceTimer);
                     debounceTimer = setTimeout(() => {
                       const query = e.target.value.trim();
                       if (query.length >= 3) {
-                        const results = document.querySelectorAll('.DocSearch-Hit');
+                        const results =
+                          document.querySelectorAll('.DocSearch-Hit');
                         trackSiteSearch(query, 'Documentation', results.length);
                       }
                     }, 1000);
@@ -135,21 +162,26 @@ export default function Root({ children }) {
       };
 
       // Track video plays
-      const handleVideoPlay = (event) => {
+      const handleVideoPlay = event => {
         if (event.target.tagName === 'VIDEO') {
-          const videoSrc = event.target.currentSrc || event.target.src || 'unknown';
+          const videoSrc =
+            event.target.currentSrc || event.target.src || 'unknown';
           trackEvent('Video', 'Play', videoSrc);
         }
       };
 
       // Track CTA button clicks
-      const handleCTAClick = (event) => {
-        const button = event.target.closest('.get-started-button, .default-button-theme');
+      const handleCTAClick = event => {
+        const button = event.target.closest(
+          '.get-started-button, .default-button-theme',
+        );
         if (button) {
           const buttonText = button.textContent?.trim() || 'Unknown';
           const clickedLink = event.target.closest?.('a');
           const href =
-            clickedLink?.getAttribute('href') || button.getAttribute('href') || '';
+            clickedLink?.getAttribute('href') ||
+            button.getAttribute('href') ||
+            '';
           trackEvent('CTA', 'Click', `${buttonText} - ${href}`);
         }
       };
@@ -158,15 +190,23 @@ export default function Root({ children }) {
       let scrollMilestonesReached = new Set();
       const handleScroll = () => {
         const scrollTop = window.scrollY;
-        const docHeight = document.documentElement.scrollHeight - window.innerHeight;
+        const docHeight =
+          document.documentElement.scrollHeight - window.innerHeight;
         if (docHeight <= 0) return;
 
         const scrollPercent = Math.round((scrollTop / docHeight) * 100);
 
         SCROLL_MILESTONES.forEach(milestone => {
-          if (scrollPercent >= milestone && !scrollMilestonesReached.has(milestone)) {
+          if (
+            scrollPercent >= milestone &&
+            !scrollMilestonesReached.has(milestone)
+          ) {
             scrollMilestonesReached.add(milestone);
-            trackEvent('Scroll Depth', `${milestone}%`, window.location.pathname);
+            trackEvent(
+              'Scroll Depth',
+              `${milestone}%`,
+              window.location.pathname,
+            );
           }
         });
       };
@@ -178,9 +218,13 @@ export default function Root({ children }) {
 
       // Track 404 pages
       const track404 = () => {
-        const is404 = document.querySelector('.theme-doc-404') ||
-                      document.title.toLowerCase().includes('not found') ||
-                      document.querySelector('h1')?.textContent?.toLowerCase().includes('not found');
+        const is404 =
+          document.querySelector('.theme-doc-404') ||
+          document.title.toLowerCase().includes('not found') ||
+          document
+            .querySelector('h1')
+            ?.textContent?.toLowerCase()
+            .includes('not found');
         if (is404) {
           trackEvent('Error', '404', window.location.pathname);
           if (devMode) {
@@ -190,19 +234,27 @@ export default function Root({ children }) {
       };
 
       // Track copy-to-clipboard events on code blocks
-      const handleCopy = (event) => {
+      const handleCopy = event => {
         const codeBlock = event.target.closest('pre, code, .prism-code');
         if (codeBlock) {
           const codeText = window.getSelection()?.toString() || '';
-          const codeSnippet = codeText.substring(0, 100) + (codeText.length > 100 ? '...' : '');
-          trackEvent('Code', 'Copy', `${window.location.pathname}: ${codeSnippet}`);
+          const codeSnippet =
+            codeText.substring(0, 100) + (codeText.length > 100 ? '...' : '');
+          trackEvent(
+            'Code',
+            'Copy',
+            `${window.location.pathname}: ${codeSnippet}`,
+          );
         }
       };
 
       // Track color mode preference (as event, no admin config needed)
       const trackColorMode = () => {
-        const colorMode = document.documentElement.getAttribute('data-theme') ||
-                         (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
+        const colorMode =
+          document.documentElement.getAttribute('data-theme') ||
+          (window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : 'light');
         trackEvent('User Preference', 'Color Mode', colorMode);
       };
 
@@ -289,11 +341,14 @@ export default function Root({ children }) {
       window.addEventListener('scroll', handleScroll, { passive: true });
 
       // Watch for color mode changes
-      const colorModeObserver = new MutationObserver((mutations) => {
-        mutations.forEach((mutation) => {
+      const colorModeObserver = new MutationObserver(mutations => {
+        mutations.forEach(mutation => {
           if (mutation.attributeName === 'data-theme') {
-            trackEvent('User Preference', 'Color Mode Change',
-              document.documentElement.getAttribute('data-theme'));
+            trackEvent(
+              'User Preference',
+              'Color Mode Change',
+              document.documentElement.getAttribute('data-theme'),
+            );
           }
         });
       });