diff --git a/src/frontend/src/components/genericIconComponent/index.tsx b/src/frontend/src/components/genericIconComponent/index.tsx
index 5c462add8..a5dc7f632 100644
--- a/src/frontend/src/components/genericIconComponent/index.tsx
+++ b/src/frontend/src/components/genericIconComponent/index.tsx
@@ -3,25 +3,24 @@ import { nodeIconsLucide, svgIcons } from "../../utils";
 
 export function IconFromLucide({ name }: IconProps): JSX.Element {
   const TargetIcon = nodeIconsLucide[name];
-  return (
-    <TargetIcon />
-  );
+  return <TargetIcon />;
 }
 
 export function IconFromSvg({ name }: IconProps): JSX.Element {
   const TargetSvg = svgIcons[name];
-  return (
-    <TargetSvg />
-  );
+  return <TargetSvg />;
 }
 
-export default function IconComponent({ method, name }: IconComponentProps): JSX.Element {
+export default function IconComponent({
+  method,
+  name,
+}: IconComponentProps): JSX.Element {
   switch (method) {
-    case 'SVG':
-      return <IconFromSvg name={ name } />
-    case 'LUCIDE':
-      return <IconFromLucide name={ name } />
+    case "SVG":
+      return <IconFromSvg name={name} />;
+    case "LUCIDE":
+      return <IconFromLucide name={name} />;
     default:
-      return 
+      return;
   }
 }
diff --git a/src/frontend/src/icons/Airbyte/Airbyte.jsx b/src/frontend/src/icons/Airbyte/Airbyte.jsx
index 7e0a19e89..a4d660434 100644
--- a/src/frontend/src/icons/Airbyte/Airbyte.jsx
+++ b/src/frontend/src/icons/Airbyte/Airbyte.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgAirbyte = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Anthropic/Anthropic.jsx b/src/frontend/src/icons/Anthropic/Anthropic.jsx
index 6f68808b8..c5615c062 100644
--- a/src/frontend/src/icons/Anthropic/Anthropic.jsx
+++ b/src/frontend/src/icons/Anthropic/Anthropic.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgAnthropic = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Anthropic/AnthropicBox.jsx b/src/frontend/src/icons/Anthropic/AnthropicBox.jsx
index 53080e5fe..223164ee0 100644
--- a/src/frontend/src/icons/Anthropic/AnthropicBox.jsx
+++ b/src/frontend/src/icons/Anthropic/AnthropicBox.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgAnthropicBox = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/AzLogo/AzLogo.jsx b/src/frontend/src/icons/AzLogo/AzLogo.jsx
index 9dc13765b..0aaa35014 100644
--- a/src/frontend/src/icons/AzLogo/AzLogo.jsx
+++ b/src/frontend/src/icons/AzLogo/AzLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgAzLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Bing/Bing.jsx b/src/frontend/src/icons/Bing/Bing.jsx
index 3f9f2128b..bf40f0dda 100644
--- a/src/frontend/src/icons/Bing/Bing.jsx
+++ b/src/frontend/src/icons/Bing/Bing.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgBing = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/ChromaIcon/Chroma.jsx b/src/frontend/src/icons/ChromaIcon/Chroma.jsx
index c93bc0ed0..2aa0660b3 100644
--- a/src/frontend/src/icons/ChromaIcon/Chroma.jsx
+++ b/src/frontend/src/icons/ChromaIcon/Chroma.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgChroma = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Cohere/Cohere.jsx b/src/frontend/src/icons/Cohere/Cohere.jsx
index b339380ec..6b78b2b13 100644
--- a/src/frontend/src/icons/Cohere/Cohere.jsx
+++ b/src/frontend/src/icons/Cohere/Cohere.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgCohere = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Evernote/EvernoteIcon.jsx b/src/frontend/src/icons/Evernote/EvernoteIcon.jsx
index ca76b7d3d..e3feab995 100644
--- a/src/frontend/src/icons/Evernote/EvernoteIcon.jsx
+++ b/src/frontend/src/icons/Evernote/EvernoteIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgEvernoteIcon = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/FacebookMessenger/FacebookMessengerLogo2020.jsx b/src/frontend/src/icons/FacebookMessenger/FacebookMessengerLogo2020.jsx
index bbb45a4e4..131f11cc0 100644
--- a/src/frontend/src/icons/FacebookMessenger/FacebookMessengerLogo2020.jsx
+++ b/src/frontend/src/icons/FacebookMessenger/FacebookMessengerLogo2020.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgFacebookMessengerLogo2020 = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/GitBook/GitbookSvgrepoCom.jsx b/src/frontend/src/icons/GitBook/GitbookSvgrepoCom.jsx
index 98b3a4870..151f1b552 100644
--- a/src/frontend/src/icons/GitBook/GitbookSvgrepoCom.jsx
+++ b/src/frontend/src/icons/GitBook/GitbookSvgrepoCom.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgGitbookSvgrepoCom = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Google/Google.jsx b/src/frontend/src/icons/Google/Google.jsx
index 92863046d..688796629 100644
--- a/src/frontend/src/icons/Google/Google.jsx
+++ b/src/frontend/src/icons/Google/Google.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgGoogle = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/HuggingFace/HfLogo.jsx b/src/frontend/src/icons/HuggingFace/HfLogo.jsx
index 617d64610..eab4c7e54 100644
--- a/src/frontend/src/icons/HuggingFace/HfLogo.jsx
+++ b/src/frontend/src/icons/HuggingFace/HfLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgHfLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/IFixIt/IfixitSeeklogoCom.jsx b/src/frontend/src/icons/IFixIt/IfixitSeeklogoCom.jsx
index 43898cc72..f20ac6062 100644
--- a/src/frontend/src/icons/IFixIt/IfixitSeeklogoCom.jsx
+++ b/src/frontend/src/icons/IFixIt/IfixitSeeklogoCom.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgIfixitSeeklogocom = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Meta/MetaIcon.jsx b/src/frontend/src/icons/Meta/MetaIcon.jsx
index cbbe8aac2..95f49089d 100644
--- a/src/frontend/src/icons/Meta/MetaIcon.jsx
+++ b/src/frontend/src/icons/Meta/MetaIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgMetaIcon = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Midjorney/MidjourneyEmblem.jsx b/src/frontend/src/icons/Midjorney/MidjourneyEmblem.jsx
index 58b1acbec..f42caaecc 100644
--- a/src/frontend/src/icons/Midjorney/MidjourneyEmblem.jsx
+++ b/src/frontend/src/icons/Midjorney/MidjourneyEmblem.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgMidjourneyEmblem = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/MongoDB/MongodbIcon.jsx b/src/frontend/src/icons/MongoDB/MongodbIcon.jsx
index c208b031c..99cdf326b 100644
--- a/src/frontend/src/icons/MongoDB/MongodbIcon.jsx
+++ b/src/frontend/src/icons/MongoDB/MongodbIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgMongodbIcon = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Notion/NotionLogo.jsx b/src/frontend/src/icons/Notion/NotionLogo.jsx
index 3c464438b..e0ac3e68c 100644
--- a/src/frontend/src/icons/Notion/NotionLogo.jsx
+++ b/src/frontend/src/icons/Notion/NotionLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgNotionLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/OpenAi/OpenAi.jsx b/src/frontend/src/icons/OpenAi/OpenAi.jsx
index 948305c58..8a69b7d58 100644
--- a/src/frontend/src/icons/OpenAi/OpenAi.jsx
+++ b/src/frontend/src/icons/OpenAi/OpenAi.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgOpenAi = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Pinecone/PineconeLogo.jsx b/src/frontend/src/icons/Pinecone/PineconeLogo.jsx
index 8e9186a64..033912309 100644
--- a/src/frontend/src/icons/Pinecone/PineconeLogo.jsx
+++ b/src/frontend/src/icons/Pinecone/PineconeLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgPineconeLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/PowerPoint/PowerPoint.jsx b/src/frontend/src/icons/PowerPoint/PowerPoint.jsx
index cffa66335..21c0cc5bc 100644
--- a/src/frontend/src/icons/PowerPoint/PowerPoint.jsx
+++ b/src/frontend/src/icons/PowerPoint/PowerPoint.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgPowerPoint = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/QDrant/QDrant.jsx b/src/frontend/src/icons/QDrant/QDrant.jsx
index c097615c2..0400bca7e 100644
--- a/src/frontend/src/icons/QDrant/QDrant.jsx
+++ b/src/frontend/src/icons/QDrant/QDrant.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgQDrant = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/ReadTheDocs/ReadthedocsioIcon.jsx b/src/frontend/src/icons/ReadTheDocs/ReadthedocsioIcon.jsx
index ad4c21737..5c55789c9 100644
--- a/src/frontend/src/icons/ReadTheDocs/ReadthedocsioIcon.jsx
+++ b/src/frontend/src/icons/ReadTheDocs/ReadthedocsioIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgReadthedocsioIcon = (props) => (
   <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" {...props}>
     <path
diff --git a/src/frontend/src/icons/Searx/SearxLogo.jsx b/src/frontend/src/icons/Searx/SearxLogo.jsx
index 6ac039ffa..c3f889003 100644
--- a/src/frontend/src/icons/Searx/SearxLogo.jsx
+++ b/src/frontend/src/icons/Searx/SearxLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgSearxLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Serper/Serper.jsx b/src/frontend/src/icons/Serper/Serper.jsx
index 63cfb749a..ff0bb9e04 100644
--- a/src/frontend/src/icons/Serper/Serper.jsx
+++ b/src/frontend/src/icons/Serper/Serper.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgSerper = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Slack/SlackIcon.jsx b/src/frontend/src/icons/Slack/SlackIcon.jsx
index e61fa930b..6a4662468 100644
--- a/src/frontend/src/icons/Slack/SlackIcon.jsx
+++ b/src/frontend/src/icons/Slack/SlackIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgSlackIcon = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/VertexAI/VertexAi.jsx b/src/frontend/src/icons/VertexAI/VertexAi.jsx
index 4b866803b..11fc05909 100644
--- a/src/frontend/src/icons/VertexAI/VertexAi.jsx
+++ b/src/frontend/src/icons/VertexAI/VertexAi.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgVertexAi = (props) => (
   <svg viewBox="0 0 32 32" width="1em" height="1em" {...props}>
     <path
diff --git a/src/frontend/src/icons/Weaviate/Weaviate.jsx b/src/frontend/src/icons/Weaviate/Weaviate.jsx
index 8224587ab..4a4ad1c83 100644
--- a/src/frontend/src/icons/Weaviate/Weaviate.jsx
+++ b/src/frontend/src/icons/Weaviate/Weaviate.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgWeaviate = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Wikipedia/Wikipedia.jsx b/src/frontend/src/icons/Wikipedia/Wikipedia.jsx
index 53d5f6996..fd681952e 100644
--- a/src/frontend/src/icons/Wikipedia/Wikipedia.jsx
+++ b/src/frontend/src/icons/Wikipedia/Wikipedia.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgWikipedia = (props) => (
   <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" {...props}>
     <defs>
diff --git a/src/frontend/src/icons/Wolfram/Wolfram.jsx b/src/frontend/src/icons/Wolfram/Wolfram.jsx
index 281cedbba..c1f6a2796 100644
--- a/src/frontend/src/icons/Wolfram/Wolfram.jsx
+++ b/src/frontend/src/icons/Wolfram/Wolfram.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgWolfram = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/Word/Word.jsx b/src/frontend/src/icons/Word/Word.jsx
index e3c8d062c..2f86db92b 100644
--- a/src/frontend/src/icons/Word/Word.jsx
+++ b/src/frontend/src/icons/Word/Word.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgWord = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/hackerNews/YCombinatorLogo.jsx b/src/frontend/src/icons/hackerNews/YCombinatorLogo.jsx
index 726ebc634..507ed03fa 100644
--- a/src/frontend/src/icons/hackerNews/YCombinatorLogo.jsx
+++ b/src/frontend/src/icons/hackerNews/YCombinatorLogo.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgYCombinatorLogo = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/icons/supabase/SupabaseIcon.jsx b/src/frontend/src/icons/supabase/SupabaseIcon.jsx
index 55a9aa2c1..b7f1f08b5 100644
--- a/src/frontend/src/icons/supabase/SupabaseIcon.jsx
+++ b/src/frontend/src/icons/supabase/SupabaseIcon.jsx
@@ -1,4 +1,3 @@
-import * as React from "react";
 const SvgSupabaseIcon = (props) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts
index b7e3895ed..be2307823 100644
--- a/src/frontend/src/utils.ts
+++ b/src/frontend/src/utils.ts
@@ -20,66 +20,65 @@ import {
   Wand2,
   Wrench,
 } from "lucide-react";
-import { ComponentType, SVGProps } from "react";
 import { Connection, Edge, Node, ReactFlowInstance } from "reactflow";
 import { twMerge } from "tailwind-merge";
 import { ADJECTIVES, DESCRIPTIONS, NOUNS } from "./flow_constants";
 import { AirbyteIcon } from "./icons/Airbyte";
-import { AnthropicIcon } from "./icons/Anthropic";
-import { BingIcon } from "./icons/Bing";
-import { ChromaIcon } from "./icons/ChromaIcon";
-import { CohereIcon } from "./icons/Cohere";
-import { EvernoteIcon } from "./icons/Evernote";
-import { FBIcon } from "./icons/FacebookMessenger";
-import { GitBookIcon } from "./icons/GitBook";
-import { GoogleIcon } from "./icons/Google";
-import { HuggingFaceIcon } from "./icons/HuggingFace";
-import { IFixIcon } from "./icons/IFixIt";
-import { MetaIcon } from "./icons/Meta";
-import { MidjourneyIcon } from "./icons/Midjorney";
-import { MongoDBIcon } from "./icons/MongoDB";
-import { NotionIcon } from "./icons/Notion";
-import { OpenAiIcon } from "./icons/OpenAi";
-import { PineconeIcon } from "./icons/Pinecone";
-import { QDrantIcon } from "./icons/QDrant";
-import { SearxIcon } from "./icons/Searx";
-import { SlackIcon } from "./icons/Slack";
-import { VertexAIIcon } from "./icons/VertexAI";
-import { HackerNewsIcon } from "./icons/hackerNews";
-import { SupabaseIcon } from "./icons/supabase";
-import { APITemplateType } from "./types/api";
-import { IVarHighlightType } from "./types/components";
-import { FlowType, NodeType } from "./types/flow";
 import SvgAirbyte from "./icons/Airbyte/Airbyte";
+import { AnthropicIcon } from "./icons/Anthropic";
 import SvgAnthropicBox from "./icons/Anthropic/AnthropicBox";
+import { BingIcon } from "./icons/Bing";
 import SvgBing from "./icons/Bing/Bing";
+import { ChromaIcon } from "./icons/ChromaIcon";
 import SvgChroma from "./icons/ChromaIcon/Chroma";
+import { CohereIcon } from "./icons/Cohere";
 import SvgCohere from "./icons/Cohere/Cohere";
+import { EvernoteIcon } from "./icons/Evernote";
 import SvgEvernoteIcon from "./icons/Evernote/EvernoteIcon";
+import { FBIcon } from "./icons/FacebookMessenger";
 import SvgFacebookMessengerLogo2020 from "./icons/FacebookMessenger/FacebookMessengerLogo2020";
+import { GitBookIcon } from "./icons/GitBook";
 import SvgGitbookSvgrepoCom from "./icons/GitBook/GitbookSvgrepoCom";
+import { GoogleIcon } from "./icons/Google";
 import SvgGoogle from "./icons/Google/Google";
-import SvgYCombinatorLogo from "./icons/hackerNews/YCombinatorLogo";
+import { HuggingFaceIcon } from "./icons/HuggingFace";
 import SvgHfLogo from "./icons/HuggingFace/HfLogo";
+import { IFixIcon } from "./icons/IFixIt";
 import SvgIfixitSeeklogocom from "./icons/IFixIt/IfixitSeeklogoCom";
+import { MetaIcon } from "./icons/Meta";
 import SvgMetaIcon from "./icons/Meta/MetaIcon";
+import { MidjourneyIcon } from "./icons/Midjorney";
 import SvgMidjourneyEmblem from "./icons/Midjorney/MidjourneyEmblem";
+import { MongoDBIcon } from "./icons/MongoDB";
 import SvgMongodbIcon from "./icons/MongoDB/MongodbIcon";
+import { NotionIcon } from "./icons/Notion";
 import SvgNotionLogo from "./icons/Notion/NotionLogo";
+import { OpenAiIcon } from "./icons/OpenAi";
 import SvgOpenAi from "./icons/OpenAi/OpenAi";
+import { PineconeIcon } from "./icons/Pinecone";
 import SvgPineconeLogo from "./icons/Pinecone/PineconeLogo";
 import SvgPowerPoint from "./icons/PowerPoint/PowerPoint";
+import { QDrantIcon } from "./icons/QDrant";
 import SvgQDrant from "./icons/QDrant/QDrant";
 import SvgReadthedocsioIcon from "./icons/ReadTheDocs/ReadthedocsioIcon";
+import { SearxIcon } from "./icons/Searx";
 import SvgSearxLogo from "./icons/Searx/SearxLogo";
 import SvgSerper from "./icons/Serper/Serper";
+import { SlackIcon } from "./icons/Slack";
 import SvgSlackIcon from "./icons/Slack/SlackIcon";
-import SvgSupabaseIcon from "./icons/supabase/SupabaseIcon";
+import { VertexAIIcon } from "./icons/VertexAI";
 import SvgVertexAi from "./icons/VertexAI/VertexAi";
 import SvgWeaviate from "./icons/Weaviate/Weaviate";
 import SvgWikipedia from "./icons/Wikipedia/Wikipedia";
 import SvgWolfram from "./icons/Wolfram/Wolfram";
 import SvgWord from "./icons/Word/Word";
+import { HackerNewsIcon } from "./icons/hackerNews";
+import SvgYCombinatorLogo from "./icons/hackerNews/YCombinatorLogo";
+import { SupabaseIcon } from "./icons/supabase";
+import SvgSupabaseIcon from "./icons/supabase/SupabaseIcon";
+import { APITemplateType } from "./types/api";
+import { IVarHighlightType } from "./types/components";
+import { FlowType, NodeType } from "./types/flow";
 
 export function classNames(...classes: Array<string>) {
   return classes.filter(Boolean).join(" ");