chore(js): Format fixes

Author: jstirnaman

assets/js/components/diagram.js

@@ -6,62 +6,68 @@ export default function Diagram({ component }) {
   if (!mermaidPromise) {
     mermaidPromise = import('mermaid');
   }
-  mermaidPromise.then(({ default: mermaid }) => {
-    // Configure mermaid with InfluxData theming
-    mermaid.initialize({
-      startOnLoad: false, // We'll manually call run()
-      theme: document.body.classList.contains('dark-theme') ? 'dark' : 'default',
-      themeVariables: {
-        fontFamily: 'Proxima Nova',
-        fontSize: '16px',
-        lineColor: '#22ADF6',
-        primaryColor: '#22ADF6',
-        primaryTextColor: '#545454',
-        secondaryColor: '#05CE78',
-        tertiaryColor: '#f4f5f5',
-      },
-      securityLevel: 'loose', // Required for interactive diagrams
-      logLevel: 'error'
+  mermaidPromise
+    .then(({ default: mermaid }) => {
+      // Configure mermaid with InfluxData theming
+      mermaid.initialize({
+        startOnLoad: false, // We'll manually call run()
+        theme: document.body.classList.contains('dark-theme')
+          ? 'dark'
+          : 'default',
+        themeVariables: {
+          fontFamily: 'Proxima Nova',
+          fontSize: '16px',
+          lineColor: '#22ADF6',
+          primaryColor: '#22ADF6',
+          primaryTextColor: '#545454',
+          secondaryColor: '#05CE78',
+          tertiaryColor: '#f4f5f5',
+        },
+        securityLevel: 'loose', // Required for interactive diagrams
+        logLevel: 'error',
+      });
+
+      // Process the specific diagram component
+      try {
+        mermaid.run({ nodes: [component] });
+      } catch (error) {
+        console.error('Mermaid diagram rendering error:', error);
+      }
+
+      // Store reference to mermaid for theme switching
+      if (!window.mermaidInstances) {
+        window.mermaidInstances = new Map();
+      }
+      window.mermaidInstances.set(component, mermaid);
+    })
+    .catch((error) => {
+      console.error('Failed to load Mermaid library:', error);
     });
-    
-    // Process the specific diagram component
-    try {
-      mermaid.run({ nodes: [component] });
-    } catch (error) {
-      console.error('Mermaid diagram rendering error:', error);
-    }
-    
-    // Store reference to mermaid for theme switching
-    if (!window.mermaidInstances) {
-      window.mermaidInstances = new Map();
-    }
-    window.mermaidInstances.set(component, mermaid);
-  }).catch(error => {
-    console.error('Failed to load Mermaid library:', error);
-  });
-  
+
   // Listen for theme changes to refresh diagrams
   const observer = new MutationObserver((mutations) => {
     mutations.forEach((mutation) => {
-      if (mutation.attributeName === 'class' && 
-          document.body.classList.contains('dark-theme') !== window.isDarkTheme) {
+      if (
+        mutation.attributeName === 'class' &&
+        document.body.classList.contains('dark-theme') !== window.isDarkTheme
+      ) {
         window.isDarkTheme = document.body.classList.contains('dark-theme');
-        
+
         // Reload this specific diagram with new theme
         if (window.mermaidInstances?.has(component)) {
           const mermaid = window.mermaidInstances.get(component);
           mermaid.initialize({
-            theme: window.isDarkTheme ? 'dark' : 'default'
+            theme: window.isDarkTheme ? 'dark' : 'default',
           });
           mermaid.run({ nodes: [component] });
         }
       }
     });
   });
-  
+
   // Watch for theme changes on body element
   observer.observe(document.body, { attributes: true });
-  
+
   // Return cleanup function to be called when component is destroyed
   return () => {
     observer.disconnect();

assets/js/components/sidebar-search.js

@@ -1,6 +1,6 @@
-import SearchInteractions from '../utils/search-interactions';
+import SearchInteractions from '../utils/search-interactions.js';
 
 export default function SidebarSearch({ component }) {
   const searchInput = component.querySelector('.sidebar--search-field');
   SearchInteractions({ searchInput });
-}
+}

assets/js/list-filters.js

@@ -1,19 +1,21 @@
 // Count tag elements
 function countTag(tag) {
-  return $(".visible[data-tags*='" + tag + "']").length
+  return $(".visible[data-tags*='" + tag + "']").length;
 }
 
 function getFilterCounts($labels) {
-  $labels.each(function() {
-    var tagName = $('input', this).attr('name').replace(/[\W/]+/, "-");
+  $labels.each(function () {
+    var tagName = $('input', this)
+      .attr('name')
+      .replace(/[\W/]+/, '-');
     var tagCount = countTag(tagName);
     $(this).attr('data-count', '(' + tagCount + ')');
     if (tagCount <= 0) {
       $(this).fadeTo(200, 0.25);
     } else {
       $(this).fadeTo(400, 1.0);
     }
-  })
+  });
 }
 
 export default function ListFilters({ component }) {
@@ -22,30 +24,41 @@ export default function ListFilters({ component }) {
 
   getFilterCounts($labels);
 
-  $inputs.click(function() {
-
+  $inputs.click(function () {
     // List of tags to hide
-    var tagArray = $(component).find("input:checkbox:checked").map(function(){
-        return $(this).attr('name').replace(/[\W]+/, "-");
-      }).get();
+    var tagArray = $(component)
+      .find('input:checkbox:checked')
+      .map(function () {
+        return $(this).attr('name').replace(/[\W]+/, '-');
+      })
+      .get();
 
     // List of tags to restore
-    var restoreArray = $(component).find("input:checkbox:not(:checked)").map(function(){
-        return $(this).attr('name').replace(/[\W]+/, "-");
-      }).get();
+    var restoreArray = $(component)
+      .find('input:checkbox:not(:checked)')
+      .map(function () {
+        return $(this).attr('name').replace(/[\W]+/, '-');
+      })
+      .get();
 
     // Actions for filter select
-    if ( $(this).is(':checked') ) {
-      $.each( tagArray, function( index, value ) {
-        $(".filter-item.visible:not([data-tags~='" + value + "'])").removeClass('visible').fadeOut()
-      })
+    if ($(this).is(':checked')) {
+      $.each(tagArray, function (index, value) {
+        $(".filter-item.visible:not([data-tags~='" + value + "'])")
+          .removeClass('visible')
+          .fadeOut();
+      });
     } else {
-      $.each( restoreArray, function( index, value ) {
-        $(".filter-item:not(.visible)[data-tags~='" + value + "']").addClass('visible').fadeIn()
-      })
-      $.each( tagArray, function( index, value ) {
-        $(".filter-item.visible:not([data-tags~='" + value + "'])").removeClass('visible').hide()
-      })
+      $.each(restoreArray, function (index, value) {
+        $(".filter-item:not(.visible)[data-tags~='" + value + "']")
+          .addClass('visible')
+          .fadeIn();
+      });
+      $.each(tagArray, function (index, value) {
+        $(".filter-item.visible:not([data-tags~='" + value + "'])")
+          .removeClass('visible')
+          .hide();
+      });
     }
 
     // Refresh filter count

assets/js/main.js

@@ -62,20 +62,20 @@ const componentRegistry = {
   'ask-ai-trigger': AskAITrigger,
   'code-placeholder': CodePlaceholder,
   'custom-time-trigger': CustomTimeTrigger,
-  'diagram': Diagram,
+  diagram: Diagram,
   'doc-search': DocSearch,
   'feature-callout': FeatureCallout,
   'flux-group-keys-demo': FluxGroupKeysDemo,
   'flux-influxdb-versions-trigger': FluxInfluxDBVersionsTrigger,
-  'keybinding': KeyBinding,
+  keybinding: KeyBinding,
   'list-filters': ListFilters,
   'product-selector': ProductSelector,
   'release-toc': ReleaseToc,
   'search-button': SearchButton,
   'sidebar-search': SidebarSearch,
   'sidebar-toggle': SidebarToggle,
-  'theme': Theme,
-  'theme-switch': ThemeSwitch
+  theme: Theme,
+  'theme-switch': ThemeSwitch,
 };
 
 /**
@@ -93,12 +93,12 @@ function initGlobals() {
   window.influxdatadocs.pageContext = pageContext;
   window.influxdatadocs.toggleModal = modals.toggleModal;
   window.influxdatadocs.componentRegistry = componentRegistry;
-  
+
   // Re-export jQuery to global namespace for legacy scripts
   if (typeof window.jQuery === 'undefined') {
     window.jQuery = window.$ = $;
   }
-  
+
   return window.influxdatadocs;
 }
 
@@ -108,32 +108,35 @@ function initGlobals() {
  */
 function initComponents(globals) {
   const components = document.querySelectorAll('[data-component]');
-  
+
   components.forEach((component) => {
     const componentName = component.getAttribute('data-component');
     const ComponentConstructor = componentRegistry[componentName];
-    
+
     if (ComponentConstructor) {
       // Initialize the component and store its instance in the global namespace
       try {
         const instance = ComponentConstructor({ component });
         globals[componentName] = ComponentConstructor;
-        
+
         // Optionally store component instances for future reference
         if (!globals.instances) {
           globals.instances = {};
         }
-        
+
         if (!globals.instances[componentName]) {
           globals.instances[componentName] = [];
         }
-        
+
         globals.instances[componentName].push({
           element: component,
-          instance
+          instance,
         });
       } catch (error) {
-        console.error(`Error initializing component "${componentName}":`, error);
+        console.error(
+          `Error initializing component "${componentName}":`,
+          error
+        );
       }
     } else {
       console.warn(`Unknown component: "${componentName}"`);
@@ -163,10 +166,10 @@ function initModules() {
 function init() {
   // Initialize global namespace and expose core modules
   const globals = initGlobals();
-  
+
   // Initialize non-component UI modules
   initModules();
-  
+
   // Initialize components from registry
   initComponents(globals);
 }
@@ -175,4 +178,4 @@ function init() {
 document.addEventListener('DOMContentLoaded', init);
 
 // Export public API
-export { initGlobals, componentRegistry };
+export { initGlobals, componentRegistry };

assets/js/utils/user-agent-platform.js

@@ -12,18 +12,24 @@ export function getPlatform() {
   // Try to use modern User-Agent Client Hints API first (Chrome 89+, Edge 89+)
   if (navigator.userAgentData && navigator.userAgentData.platform) {
     const platform = navigator.userAgentData.platform.toLowerCase();
-    
+
     if (platform.includes('mac')) return 'osx';
     if (platform.includes('win')) return 'win';
     if (platform.includes('linux')) return 'linux';
   }
-  
+
   // Fall back to userAgent string parsing
   const userAgent = navigator.userAgent.toLowerCase();
-  
-  if (userAgent.includes('mac') || userAgent.includes('iphone') || userAgent.includes('ipad')) return 'osx';
+
+  if (
+    userAgent.includes('mac') ||
+    userAgent.includes('iphone') ||
+    userAgent.includes('ipad')
+  )
+    return 'osx';
   if (userAgent.includes('win')) return 'win';
-  if (userAgent.includes('linux') || userAgent.includes('android')) return 'linux';
-  
+  if (userAgent.includes('linux') || userAgent.includes('android'))
+    return 'linux';
+
   return 'other';
-}
+}

assets/js/version-selector.js

@@ -1,21 +1,21 @@
 export default function ProductSelector({ component }) {
   // Select the product dropdown and dropdown items
-  const productDropdown = component.querySelector("#product-dropdown");
-  const dropdownItems = component.querySelector("#dropdown-items");
+  const productDropdown = component.querySelector('#product-dropdown');
+  const dropdownItems = component.querySelector('#dropdown-items');
 
   // Expand the menu on click
   if (productDropdown) {
-    productDropdown.addEventListener("click", function() {
-      productDropdown.classList.toggle("open");
-      dropdownItems.classList.toggle("open");
+    productDropdown.addEventListener('click', function () {
+      productDropdown.classList.toggle('open');
+      dropdownItems.classList.toggle('open');
     });
   }
 
   // Close the dropdown by clicking anywhere else
-  document.addEventListener("click", function(e) {
+  document.addEventListener('click', function (e) {
     // Check if the click was outside of the '.product-list' container
     if (!e.target.closest('.product-list')) {
-      dropdownItems.classList.remove("open");
+      dropdownItems.classList.remove('open');
     }
   });
 }