Prettier fixes

Author: bdls-jamal

Eplant/config.ts

@@ -36,7 +36,7 @@ const userViews = [
   ExperimentEFP,
   WorldEFP,
   ChromosomeViewer,
-  NavigatorView
+  NavigatorView,
 ]
 
 // List of views that are used to lookup a view by id

Eplant/tutorial.md

@@ -372,14 +372,18 @@ const views = [...genericViews, ...userViews]
 
 #### View Switching Functionality
 
-If your new view has function to swap to a different view and/or gene available on ePlant, you may benefit from the generalized view switching component file (name tbd). 
+If your new view has function to swap to a different view and/or gene available on ePlant, you may benefit from the generalized view switching component file (name tbd).
 
 To utilize the component:
-1. Import createViewSwitchProvider into your index file and export it: 
+
+1. Import createViewSwitchProvider into your index file and export it:
+
 ```
 export const ViewSwitchProvider = createViewSwitchProvider();
 ```
+
 2. Import your exported provider into your view's main component and wrap your component in the view's return statement:
+
 ```
 const App = () => {
   return (
@@ -389,9 +393,11 @@ const App = () => {
   );
 };
 ```
+
 3.  Import and use useViewSwitch in your main component whenever you want to invoke the switching functionality. For example: `switchViewAndGene('Cell eFP', geneName);`
 
 There are 3 main swithing functions you can invoke based on needs.
+
 ```
   /** Function to switch view only */
   switchViewOnly: (viewId: string) => Promise<void>;
@@ -401,18 +407,19 @@ There are 3 main swithing functions you can invoke based on needs.
 
   /** Function to switch both view and gene */
   switchViewAndGene: (viewId: string, geneName: string, speciesUrl?: string) => Promise<void>;
-  ```
+```
 
 ## Documentation and Commenting Style
 
 It is important to maintain a common standard for commenting code and documentation. If you want to make contributions to the project, we ask that you follow the TSdoc(typescript) commenting style. As an example this includes adding function/class headers and comments as seen below:
+
 ```
 /**
  * Extracts the primary gene identifier from the API URL
- * 
+ *
  * @param url - The complete API URL containing query parameters
  * @returns The primary gene identifier, or an empty string not found
- * 
+ *
  * Uses regex to find the primaryGene parameter in the URL
  */
 function extractPrimaryGene(url: string): string {

Eplant/util/ErrorBoundary/index.tsx

@@ -8,7 +8,11 @@ export default class ErrorBoundary extends Component<
     this.state = { hasError: false }
   }
   componentDidCatch(error: Error, info: ErrorInfo) {
-    console.log("Error caught by ErrorBoundary:", error.message, info.componentStack);
+    console.log(
+      'Error caught by ErrorBoundary:',
+      error.message,
+      info.componentStack
+    )
     this.setState({ hasError: true })
   }
   render() {

Eplant/views/ViewGeneSwitching.tsx

@@ -1,25 +1,34 @@
-import { createContext, useContext, useEffect, useState } from 'react';
-import _ from 'lodash';
+import { createContext, useContext, useEffect, useState } from 'react'
+import _ from 'lodash'
+
+import { useConfig } from '@eplant/config'
+import GeneticElement from '@eplant/GeneticElement'
+import {
+  useGeneticElements,
+  useSetActiveGeneId,
+  useSetActiveViewId,
+  useSpecies,
+} from '@eplant/state'
+import { View } from '@eplant/View'
 
-import { useConfig } from '@eplant/config';
-import GeneticElement from '@eplant/GeneticElement';
-import { useGeneticElements, useSetActiveGeneId, useSetActiveViewId, useSpecies } from '@eplant/state';
-import { View } from '@eplant/View';
-
-/** 
+/**
  * Interface defining the shape of the ViewSwitch context
  */
 interface ViewSwitchContextType {
   /** Currently active view */
-  activeView: View | null;
+  activeView: View | null
   /** Currently active genetic element */
-  activeGene: GeneticElement | null;
+  activeGene: GeneticElement | null
   /** Function to switch view only */
-  switchViewOnly: (viewId: string) => Promise<void>;
+  switchViewOnly: (viewId: string) => Promise<void>
   /** Function to switch gene only */
-  switchGeneOnly: (geneName: string) => Promise<void>;
+  switchGeneOnly: (geneName: string) => Promise<void>
   /** Function to switch both view and gene */
-  switchViewAndGene: (viewId: string, geneName: string, species?: string) => Promise<void>;
+  switchViewAndGene: (
+    viewId: string,
+    geneName: string,
+    species?: string
+  ) => Promise<void>
 }
 
 /** Default context value */
@@ -29,10 +38,10 @@ const ViewSwitchContext = createContext<ViewSwitchContextType>({
   switchViewOnly: async () => {},
   switchGeneOnly: async () => {},
   switchViewAndGene: async () => {},
-});
+})
 
 /** Hook to access the ViewSwitch context */
-export const useViewSwitch = () => useContext(ViewSwitchContext);
+export const useViewSwitch = () => useContext(ViewSwitchContext)
 
 /**
  * Creates a ViewSwitch provider component
@@ -44,155 +53,164 @@ export const createViewSwitchProvider = () => {
    * @param props - Component props
    */
   const ViewSwitchProvider = ({ children }: { children: React.ReactNode }) => {
-    const [activeView, setActiveView] = useState<View | null>(null);
-    const [activeGene, setActiveGene] = useState<GeneticElement | null>(null);
-    const [geneticElements, setGeneticElements] = useGeneticElements();
-    
-    const { userViews } = useConfig();
-    const setActiveViewId = useSetActiveViewId();
-    const setActiveGeneId = useSetActiveGeneId();
-    const [speciesList] = useSpecies();
-    const species = speciesList.length ? speciesList[0] : undefined;
+    const [activeView, setActiveView] = useState<View | null>(null)
+    const [activeGene, setActiveGene] = useState<GeneticElement | null>(null)
+    const [geneticElements, setGeneticElements] = useGeneticElements()
+
+    const { userViews } = useConfig()
+    const setActiveViewId = useSetActiveViewId()
+    const setActiveGeneId = useSetActiveGeneId()
+    const [speciesList] = useSpecies()
+    const species = speciesList.length ? speciesList[0] : undefined
 
     /**
      * Adds genetic elements to the state, ensuring uniqueness
      * @param genes - Array of genetic elements to add
      */
     const addGeneticElements = (genes: GeneticElement[]) => {
       setGeneticElements((prev) => {
-        const updatedGenes = _.uniqBy([...prev, ...genes], (gene) => gene.id);
-        return updatedGenes;
-      });
+        const updatedGenes = _.uniqBy([...prev, ...genes], (gene) => gene.id)
+        return updatedGenes
+      })
 
       if (genes.length > 0) {
-        setActiveGeneId(genes[0].id);
+        setActiveGeneId(genes[0].id)
       }
-    };
+    }
 
     // Ensure genetic elements remain unique
     useEffect(() => {
-      const uniqueGenes = _.uniqBy(geneticElements, (gene) => gene.id);
+      const uniqueGenes = _.uniqBy(geneticElements, (gene) => gene.id)
       if (uniqueGenes.length !== geneticElements.length) {
-        setGeneticElements(uniqueGenes);
+        setGeneticElements(uniqueGenes)
       }
-    }, [geneticElements, setGeneticElements]);
+    }, [geneticElements, setGeneticElements])
 
     /**
      * Validates and retrieves a view by ID
      * @param viewId - The ID of the view to validate
      * @returns The validated view or null
      */
     const validateView = (viewId: string): View | null => {
-      const targetView = userViews.find((view) => view.id === viewId);
+      const targetView = userViews.find((view) => view.id === viewId)
       if (!targetView) {
-        console.warn(`View with ID ${viewId} not found`);
-        return null;
+        console.warn(`View with ID ${viewId} not found`)
+        return null
       }
-      return targetView;
-    };
+      return targetView
+    }
 
     /**
      * Loads a gene by name
      * @param geneName - The name of the gene to load
      * @returns The loaded genetic element or null
      */
-    const loadGene = async (geneName: string): Promise<GeneticElement | null> => {
+    const loadGene = async (
+      geneName: string
+    ): Promise<GeneticElement | null> => {
       if (!species) {
-        console.error("Species configuration is missing.");
-        return null;
+        console.error('Species configuration is missing.')
+        return null
       }
 
       try {
-        const loadedGene = await species.api.searchGene(geneName);
-        return loadedGene as GeneticElement;
+        const loadedGene = await species.api.searchGene(geneName)
+        return loadedGene as GeneticElement
       } catch (error) {
-        console.error(`Error loading gene ${geneName}:`, error);
-        return null;
+        console.error(`Error loading gene ${geneName}:`, error)
+        return null
       }
-    };
+    }
 
     /**
      * Handles navigation to external species links
      * @param speciesUrl - The URL to navigate to
      * @param geneName - The gene identifier
      */
-        const handleExternalSpecies = (speciesUrl: string, geneName: string): void => {
-          /** const fullUrl = `${speciesUrl}${geneName}`; */ 
-          const fullUrl = `${speciesUrl}`;
-          window.open(fullUrl, '_blank');
-        };
+    const handleExternalSpecies = (
+      speciesUrl: string,
+      geneName: string
+    ): void => {
+      /** const fullUrl = `${speciesUrl}${geneName}`; */
+      const fullUrl = `${speciesUrl}`
+      window.open(fullUrl, '_blank')
+    }
 
     /**
      * Switches only the view, keeping the current gene
      * @param viewId - ID of the view to switch to
      */
     const switchViewOnly = async (viewId: string): Promise<void> => {
-      
-      const targetView = validateView(viewId);
-      
+      const targetView = validateView(viewId)
+
       if (targetView) {
-        setActiveViewId(targetView.id);
-        setActiveView(targetView);
+        setActiveViewId(targetView.id)
+        setActiveView(targetView)
       }
-    };
+    }
 
     /**
      * Switches only the gene, keeping the current view
      * @param geneName - Name of the gene to switch to
      */
-    const switchGeneOnly = async (geneName: string, speciesUrl?: string): Promise<void> => {
-      
+    const switchGeneOnly = async (
+      geneName: string,
+      speciesUrl?: string
+    ): Promise<void> => {
       if (speciesUrl) {
-        handleExternalSpecies(speciesUrl, geneName);
+        handleExternalSpecies(speciesUrl, geneName)
       }
-      
-      const geneticElement = await loadGene(geneName);
-      
+
+      const geneticElement = await loadGene(geneName)
+
       if (geneticElement) {
-        addGeneticElements([geneticElement]);
-        setActiveGeneId(geneticElement.id);
-        setActiveGene(geneticElement);
+        addGeneticElements([geneticElement])
+        setActiveGeneId(geneticElement.id)
+        setActiveGene(geneticElement)
       }
-    };
+    }
 
     /**
      * Switches both view and gene
      * @param viewId - ID of the view to switch to
      * @param geneName - Name of the gene to switch to
      */
-    const switchViewAndGene = async (viewId: string, geneName: string, speciesUrl?: string): Promise<void> => {
-      
+    const switchViewAndGene = async (
+      viewId: string,
+      geneName: string,
+      speciesUrl?: string
+    ): Promise<void> => {
       if (speciesUrl) {
-        handleExternalSpecies(speciesUrl, geneName);
+        handleExternalSpecies(speciesUrl, geneName)
       }
 
-      const targetView = validateView(viewId);
-      const geneticElement = await loadGene(geneName);
+      const targetView = validateView(viewId)
+      const geneticElement = await loadGene(geneName)
 
       if (targetView && geneticElement) {
-        addGeneticElements([geneticElement]);
-        setActiveViewId(targetView.id);
-        setActiveView(targetView);
-        setActiveGeneId(geneticElement.id);
-        setActiveGene(geneticElement);
+        addGeneticElements([geneticElement])
+        setActiveViewId(targetView.id)
+        setActiveView(targetView)
+        setActiveGeneId(geneticElement.id)
+        setActiveGene(geneticElement)
       }
-    };
+    }
 
     return (
-      <ViewSwitchContext.Provider 
-        value={{ 
-          activeView, 
-          activeGene, 
+      <ViewSwitchContext.Provider
+        value={{
+          activeView,
+          activeGene,
           switchViewOnly,
           switchGeneOnly,
-          switchViewAndGene
+          switchViewAndGene,
         }}
       >
         {children}
       </ViewSwitchContext.Provider>
-    );
-  };
+    )
+  }
 
-  ViewSwitchProvider.displayName = 'ViewSwitchProvider';
-  return ViewSwitchProvider;
-};
+  ViewSwitchProvider.displayName = 'ViewSwitchProvider'
+  return ViewSwitchProvider
+}