diff --git a/src/frontend/src/constants/constants.ts b/src/frontend/src/constants/constants.ts
index f963d7234..1044ade01 100644
--- a/src/frontend/src/constants/constants.ts
+++ b/src/frontend/src/constants/constants.ts
@@ -863,3 +863,5 @@ export const TITLE_ERROR_UPDATING_COMPONENT =
   "Error while updating the Component";
 
 export const EMPTY_INPUT_SEND_MESSAGE = "No input message provided.";
+
+export const TABS_ORDER = ["run curl", "python api", "js api", "python code", "chat widget html"]
diff --git a/src/frontend/src/modals/apiModal/index.tsx b/src/frontend/src/modals/apiModal/index.tsx
index 36ded5afb..f4929cb39 100644
--- a/src/frontend/src/modals/apiModal/index.tsx
+++ b/src/frontend/src/modals/apiModal/index.tsx
@@ -26,6 +26,8 @@ import getPythonCode from "./utils/get-python-code";
 import { getValue } from "./utils/get-value";
 import getWidgetCode from "./utils/get-widget-code";
 import { createTabsArray } from "./utils/tabs-array";
+import getTabsOrder from "./utils/get-tabs-order";
+import getCodesObj from "./utils/get-codes-obj";
 
 const ApiModal = forwardRef(
   (
@@ -213,21 +215,24 @@ const ApiModal = forwardRef(
       );
       const pythonCode = getPythonCode(flow?.name, cloneTweak);
       const widgetCode = getWidgetCode(flow?.id, flow?.name, autoLogin);
+      const isThereTweaks = Object.keys(tweaksCode).length > 0;
+      const codesObj = getCodesObj({
+        runCurlCode,
+        webhookCurlCode,
+        pythonApiCode,
+        jsApiCode,
+        pythonCode,
+        widgetCode
+      })
+      const tabsOrder = getTabsOrder(includeWebhook, isThereTweaks);
       if (tabs && tabs?.length > 0) {
-        let i = 0;
-        tabs![i].code = runCurlCode;
-        i++;
-        if (includeWebhook) {
-          tabs![i].code = webhookCurlCode;
-          i++;
-        }
-        tabs![i].code = pythonApiCode;
-        i++;
-        tabs![i].code = jsApiCode;
-        i++;
-        tabs![i].code = pythonCode;
-        i++;
-        tabs![i].code = widgetCode;
+        tabs.forEach((tab, idx) => {
+          const order = tabsOrder[idx];
+          if (order && order.toLowerCase() === tab.name.toLowerCase()) {
+            const codeToFind = codesObj.find(c => c.name.toLowerCase() === tab.name.toLowerCase());
+            tab.code = codeToFind?.code;
+          }
+        })
       }
     };
 
diff --git a/src/frontend/src/modals/apiModal/utils/get-codes-obj.tsx b/src/frontend/src/modals/apiModal/utils/get-codes-obj.tsx
new file mode 100644
index 000000000..de05f7ad9
--- /dev/null
+++ b/src/frontend/src/modals/apiModal/utils/get-codes-obj.tsx
@@ -0,0 +1,38 @@
+import { getCodesObjProps, getCodesObjReturn } from "../../../types/utils/functions";
+
+export default function getCodesObj({
+  runCurlCode,
+  webhookCurlCode,
+  pythonApiCode,
+  jsApiCode,
+  pythonCode,
+  widgetCode,
+}: getCodesObjProps): getCodesObjReturn {
+  return [
+    {
+      name: "run curl",
+      code: runCurlCode,
+    },
+    {
+      name: "webhook curl",
+      code: webhookCurlCode,
+    },
+    {
+      name: "python api",
+      code: pythonApiCode,
+    },
+    {
+      name: "js api",
+      code: jsApiCode,
+    },
+    {
+      name: "python code",
+      code: pythonCode,
+    },
+    {
+      name: "chat widget html",
+      code: widgetCode,
+    },
+    
+  ]
+}
\ No newline at end of file
diff --git a/src/frontend/src/modals/apiModal/utils/get-tabs-order.tsx b/src/frontend/src/modals/apiModal/utils/get-tabs-order.tsx
new file mode 100644
index 000000000..53313eddb
--- /dev/null
+++ b/src/frontend/src/modals/apiModal/utils/get-tabs-order.tsx
@@ -0,0 +1,12 @@
+import { TABS_ORDER } from "../../../constants/constants";
+
+export default function getTabsOrder(isThereWH: boolean = false, isThereTweaks: boolean = false): string[] {
+  const defaultOrder = TABS_ORDER;
+  if (isThereTweaks) {
+    defaultOrder.push("tweaks");
+  }
+  if (isThereWH) {
+    defaultOrder.splice(1, 0, "webhook curl");
+  }
+  return defaultOrder;
+}
\ No newline at end of file
diff --git a/src/frontend/src/modals/apiModal/utils/tabs-array.tsx b/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
index 859511e58..59e13356f 100644
--- a/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
+++ b/src/frontend/src/modals/apiModal/utils/tabs-array.tsx
@@ -1,4 +1,5 @@
-export function createTabsArray(
+export function 
+createTabsArray(
   codes,
   includeWebhookCurl = false,
   includeTweaks = false,
diff --git a/src/frontend/src/types/utils/functions.ts b/src/frontend/src/types/utils/functions.ts
new file mode 100644
index 000000000..5d355579b
--- /dev/null
+++ b/src/frontend/src/types/utils/functions.ts
@@ -0,0 +1,10 @@
+export type getCodesObjProps = {
+    runCurlCode: string,
+    webhookCurlCode: string,
+    pythonApiCode: string,
+    jsApiCode: string,
+    pythonCode: string,
+    widgetCode: string,
+};
+
+export type getCodesObjReturn = Array<{name: string; code: string;}>