diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx
index 480a154f8..ff882e1b6 100644
--- a/src/frontend/src/contexts/tabsContext.tsx
+++ b/src/frontend/src/contexts/tabsContext.tsx
@@ -21,24 +21,24 @@ import { v4 as uuidv4 } from "uuid";
 import { addEdge } from "reactflow";
 
 const TabsContextInitialValue: TabsContextType = {
-  save: () => {},
+  save: () => { },
   tabIndex: 0,
-  setTabIndex: (index: number) => {},
+  setTabIndex: (index: number) => { },
   flows: [],
-  removeFlow: (id: string) => {},
-  addFlow: (flowData?: any) => {},
-  updateFlow: (newFlow: FlowType) => {},
+  removeFlow: (id: string) => { },
+  addFlow: (flowData?: any) => { },
+  updateFlow: (newFlow: FlowType) => { },
   incrementNodeId: () => uuidv4(),
-  downloadFlow: (flow: FlowType) => {},
-  uploadFlow: () => {},
-  hardReset: () => {},
+  downloadFlow: (flow: FlowType) => { },
+  uploadFlow: () => { },
+  hardReset: () => { },
   disableCopyPaste: false,
-  setDisableCopyPaste: (state: boolean) => {},
+  setDisableCopyPaste: (state: boolean) => { },
   getNodeId: () => "",
   paste: (
     selection: { nodes: any; edges: any },
     position: { x: number; y: number }
-  ) => {},
+  ) => { },
 };
 
 export const TabsContext = createContext<TabsContextType>(
@@ -59,7 +59,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
   }
   function save() {
     let Saveflows = [...flows];
-    if (Saveflows.length !== 0)
+    if (Saveflows.length !== 0) {
       Saveflows.forEach((flow) => {
         if (flow.data && flow.data?.nodes)
           flow.data?.nodes.forEach((node) => {
@@ -71,10 +71,11 @@ export function TabsProvider({ children }: { children: ReactNode }) {
             });
           });
       });
-    window.localStorage.setItem(
-      "tabsData",
-      JSON.stringify({ tabIndex, flows: Saveflows, id })
-    );
+      window.localStorage.setItem(
+        "tabsData",
+        JSON.stringify({ tabIndex, flows: Saveflows, id })
+      );
+    }
   }
   useEffect(() => {
     //save tabs locally
@@ -108,7 +109,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
               templates[node.data.type]["description"];
             node.data.node.template = updateTemplate(
               templates[node.data.type][
-                "template"
+              "template"
               ] as unknown as APITemplateType,
 
               node.data.node.template as APITemplateType
diff --git a/src/frontend/src/icons/Serper/index.tsx b/src/frontend/src/icons/Serper/index.tsx
new file mode 100644
index 000000000..2100695ff
--- /dev/null
+++ b/src/frontend/src/icons/Serper/index.tsx
@@ -0,0 +1,8 @@
+import React, { forwardRef } from "react";
+import { ReactComponent as SerperSVG } from "./serper.svg";
+
+export const SerperIcon = forwardRef<SVGSVGElement, React.PropsWithChildren<{}>>(
+  (props, ref) => {
+    return <SerperSVG ref={ref} {...props} />;
+  }
+);
\ No newline at end of file
diff --git a/src/frontend/src/icons/Serper/serper.svg b/src/frontend/src/icons/Serper/serper.svg
new file mode 100644
index 000000000..a984dbfe8
--- /dev/null
+++ b/src/frontend/src/icons/Serper/serper.svg
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve">  <image id="image0" width="48" height="48" x="0" y="0"
+    href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAABGdBTUEAALGPC/xhBQAAACBjSFJN
+AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAACGVBMVEUAAACVyvSRzvOPzfSQ
+zfSRzPSQzfSQzfSQzfSQyPSUyfKRzvOQzfSRzvSQzfOOxvGO0PaQzfSQzfSQzfSTzvWZzP+RzPSQ
+zfSPzfOA1f+Qy/KPzfSQzfSQzfSPzfSRzfSPzPWPy/iRzfWQzfSRz/GPzfORzvWSzfaPzvaQzPOP
+zPWQzfWQzfSQzfSQzvSMzPKSzvOPzfSQzfWRzvWQzvWN0PKTzPKQzfOQzfSQzfSAv/+Rz/WQzfWQ
+zfSPzfOQzfSQzPORzPSPzfSRzPSqqv+QzfWQzfSQzvSQzfSRzfWPzPX///+RzvSQzfSQzPSQzvSL
+0f+QzvWSy/WQzfWQzfSQzfSPzfWRzfWRzPWRzPWT0feQzPOQzfOQzPOL0fOPzPORzfSPzfOQzPaQ
+zfSQzfSPy/KQzfWQzfSQzfSPzPOPz/eQzPSQzvSQzfSQzPSPzvSQzvSQzfWPzvWQzfOQzPSJxOuP
+zPWQzfSQzvSPz/SV1eqQzPSQzfWPy/OQzfSOzfGQzvSRzfOfv/+PzfSQzfSQzvWQzfWSyO2PzvOQ
+zfSRzfSRzfSSzvOA//+PzvSOxv+OzfKPzPWQzfSRzPKSzPSQzfSQzfOQzfSOzvWPzfOQzfSSzvSR
+zfSRzPSW0vCRzPSSzvOQzfOQzvSQzfSIzO6OzfWS2/+RzfSSzPCQzfWQzvWQzfORz/KQzfSRy/WQ
+zfSQzfSQzfT////309j7AAAAsXRSTlMAGFiQuNnu+Y8XE23KyWwSG/X0jhoFb/KABifQ5aNwSDIi
+M84lUpY4OZdQZ/z4hxQViWVoxCYox/6KBE/z/WvxbniLdAOVy+jkfxkBXeGmjAuqMa3snntmfash
+aldVFrC0mTfBqDt64udpIHOl0dRytdxJheMNS9rtMAzPw0DrJL9WCGC8fNsOgkdhpD8CWQk9kuo8
+RvvFnzQp+i+7jRFfKsaRdQ9NB/AjTGOYOvZKttg9JvjTAAAAAWJLR0RLaQuFUAAAAAd0SU1FB+cF
+HgMFK2w+nRoAAANfSURBVEjHhVX5QxJREH6eKGQmiIQheJflgXiRYhalmCRlYWqGZZdHB6WllZra
+aZaVmZUWppZJduj+h8089mIXcH7Ynfnmm7fvzcybJUQqUdExsXHxCkV8XGxCdCLZRpSqHUyQJO1M
+jkDfFZPCyEStSQ1D16bpmJCSslsfip++h/UbMoymzKysbJMxw8BCOblyfl5geXX+XjG6ryCwSd1+
+Kf9AIeJFxSVSh7lUgZ5CSzBcRtcprwi118oq9FmDIvLo+gerw2RDQ79RIzqvDYDaQ+HzraoFQh1/
+cj3NTwQ+IYdprrSsdQQtO4koCcg5ytZXjecV7f+Yqb7BoW4sPy7KgRZPbmuiegyoikre5TzRzJW4
+1mXm4YoiAE6ipsTSFPOOUy3irjCc5h12LCt2ogq7hV/JeQZ57tazbe0dWDHHOc5TgjvvBAX7OZ9f
+5zxYzZ5As3VdAOMi7+oGqwpQK7wv8ehl2Abfzs4r4EvnrKtYbzOJhlejkA03w1wTLGUPoxZ22wtU
+D81RhkCBDPSJ0t9/XTg1uQFUDYmFZ5oA3mSYW11hiucF6m1yB54DAjgI5l3LvZABQ+AbJvfh+UAA
+H47QezGqaRuTTYxM8DwimOxxEZo8IVStY/KxOCAXl5IFEOeTEaHSjR5ZgGRLVNIt9U972JBn0i09
+Dz60IC/GpoaxVC8lh5akNUic09CiE5K0YuFeCZzE10FDawo6f4YzXLRw2G0GJ4eZHzGjM6KAN+B9
+y33PQVuDNh8/vN6BMS0KmGWY95w+F2g+kgTvAg7Ux8HlEFL5YV60X2zvj0R6gQZgoFg/fab6QgEY
+i1+40+HNLANFiTepNCgVDNMz2vKVTmJrG+fw4RRYQg3nmmKBj/hmE91p3SQHLy/ibKRqKjJWtHxE
+f3cRS49f5RtQj0fVRQWM7+j0iXLzY22wtaW13fRTgFaR42UNbQ5aKhJBjMho4Iddbh1OrQgRRhzG
+634BqKHjXqMNTdfPonf+lxizYL2ZqoVQ/OUkmt+NYNRCv6GwywZAom+Rrr8hddTUBX6xv/84BdA5
+1/2Xwutr8i+P57DZ73V5/2X7/dlDXpeDhRr8JIRUh/uxq0P/2EGafGo53WaPilCg5M4Vq5htXelb
+ItuIeVKzueVWKNxbmz6P7D9P/gNwmex8k7QhUQAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAyMy0wNS0z
+MFQwMzowNTo0MyswMDowMLa1rmEAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMjMtMDUtMzBUMDM6MDU6
+NDMrMDA6MDDH6BbdAAAAKHRFWHRkYXRlOnRpbWVzdGFtcAAyMDIzLTA1LTMwVDAzOjA1OjQzKzAw
+OjAwkP03AgAAAABJRU5ErkJggg==" />
+</svg>
diff --git a/src/frontend/src/utils.ts b/src/frontend/src/utils.ts
index 2c895938c..5f8e85242 100644
--- a/src/frontend/src/utils.ts
+++ b/src/frontend/src/utils.ts
@@ -45,6 +45,7 @@ import { WeaviateIcon } from "./icons/Weaviate";
 import { WikipediaIcon } from "./icons/Wikipedia";
 import { WolframIcon } from "./icons/Wolfram";
 import { WordIcon } from "./icons/Word";
+import { SerperIcon } from "./icons/Serper";
 import { v4 as uuidv4 } from "uuid";
 
 export function classNames(...classes: Array<string>) {
@@ -150,6 +151,7 @@ export const nodeIcons: {
 } = {
   Chroma: ChromaIcon,
   AirbyteJSONLoader: AirbyteIcon,
+  // SerpAPIWrapper: SerperIcon,
   // AZLyricsLoader: AzIcon,
   BingSearchAPIWrapper: BingIcon,
   Cohere: CohereIcon,
@@ -158,6 +160,8 @@ export const nodeIcons: {
   FacebookChatLoader: FBIcon,
   GitbookLoader: GitBookIcon,
   GoogleSearchAPIWrapper: GoogleIcon,
+  GoogleSearchResults: GoogleIcon,
+  GoogleSearchRun: GoogleIcon,
   HNLoader: HackerNewsIcon,
   HuggingFaceHub: HugginFaceIcon,
   HuggingFaceEmbeddings: HugginFaceIcon,
@@ -175,7 +179,8 @@ export const nodeIcons: {
   SlackDirectoryLoader: SlackIcon,
   // Weaviate: WeaviateIcon,
   // WikipediaAPIWrapper: WikipediaIcon,
-  WolframAlphaQueryRun: WolframIcon,
+  // WolframAlphaQueryRun: WolframIcon,
+  // WolframAlphaAPIWrapper: WolframIcon,  
   Word: WordIcon,
   agents: RocketLaunchIcon,
   chains: LinkIcon,