diff --git a/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx b/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx
new file mode 100644
index 000000000..a44cba757
--- /dev/null
+++ b/src/frontend/src/modals/apiModal/utils/get-widget-code.tsx
@@ -0,0 +1,24 @@
+/**
+ * Function to get the widget code for the API
+ * @param {string} flow - The current flow.
+ * @returns {string} - The widget code
+ */
+export default function getWidgetCode(
+    flowId: string,
+    flowName: string,
+    isAuth: boolean,
+  ): string {
+    return `<script src="https://cdn.jsdelivr.net/gh/langflow-ai/langflow-embedded-chat@1.0_alpha/dist/build/static/js/bundle.min.js"></script>
+  
+  <langflow-chat
+    window_title="${flowName}"
+    flow_id="${flowId}"
+    host_url="http://localhost:7860"${
+      !isAuth
+        ? `
+    api_key="..."`
+        : ""
+    }
+  
+  ></langflow-chat>`;
+  }
diff --git a/src/frontend/src/modals/apiModal/views/index.tsx b/src/frontend/src/modals/apiModal/views/index.tsx
index bf45d9eae..625261bfd 100644
--- a/src/frontend/src/modals/apiModal/views/index.tsx
+++ b/src/frontend/src/modals/apiModal/views/index.tsx
@@ -14,7 +14,6 @@ import { TemplateVariableType } from "../../../types/api";
 import { uniqueTweakType } from "../../../types/components";
 import { FlowType } from "../../../types/flow/index";
 import {
-  getWidgetCode,
   tabsArray,
 } from "../../../utils/utils";
 import BaseModal from "../../baseModal";
@@ -27,6 +26,7 @@ import { getValue } from "../utils/get-value";
 import getPythonApiCode from "../utils/get-python-api-code";
 import getCurlCode from "../utils/get-curl-code";
 import getPythonCode from "../utils/get-python-code";
+import getWidgetCode from "../utils/get-widget-code";
 
 const ApiModal = forwardRef(
   (
diff --git a/src/frontend/src/utils/utils.ts b/src/frontend/src/utils/utils.ts
index 4e15fc4ad..244a17963 100644
--- a/src/frontend/src/utils/utils.ts
+++ b/src/frontend/src/utils/utils.ts
@@ -158,31 +158,6 @@ export function getOutputIds(flow) {
   return arrayOfOutputsJoin;
 }
 
-/**
- * Function to get the widget code for the API
- * @param {string} flow - The current flow.
- * @returns {string} - The widget code
- */
-export function getWidgetCode(
-  flowId: string,
-  flowName: string,
-  isAuth: boolean,
-): string {
-  return `<script src="https://cdn.jsdelivr.net/gh/langflow-ai/langflow-embedded-chat@1.0_alpha/dist/build/static/js/bundle.min.js"></script>
-
-<langflow-chat
-  window_title="${flowName}"
-  flow_id="${flowId}"
-  host_url="http://localhost:7860"${
-    !isAuth
-      ? `
-  api_key="..."`
-      : ""
-  }
-
-></langflow-chat>`;
-}
-
 export function truncateLongId(id: string): string {
   let [componentName, newId] = id.split("-");
   if (componentName.length > 15) {