diff --git a/frontend/src/AppBuilder/Header/RightTopHeaderButtons/PromoteVersionButton.jsx b/frontend/src/AppBuilder/Header/RightTopHeaderButtons/PromoteVersionButton.jsx
deleted file mode 100644
index f8902157bc..0000000000
--- a/frontend/src/AppBuilder/Header/RightTopHeaderButtons/PromoteVersionButton.jsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import React, { useState } from 'react';
-import { ButtonSolid } from '@/_ui/AppButton/AppButton';
-import { shallow } from 'zustand/shallow';
-import { ToolTip } from '@/_components/ToolTip';
-import PromoteConfirmationModal from './PromoteConfirmationModal';
-import useStore from '@/AppBuilder/_stores/store';
-
-const PromoteVersionButton = () => {
-  const [promoteModalData, setPromoteModalData] = useState(null);
-  const { isSaving, editingVersion, appVersionEnvironment, environments, selectedEnvironment } = useStore(
-    (state) => ({
-      isSaving: state.app.isSaving,
-      editingVersion: state.currentVersionId,
-      selectedEnvironment: state.selectedEnvironment,
-      environments: state.environments,
-      appVersionEnvironment: state.appVersionEnvironment,
-    }),
-    shallow
-  );
-
-  const shouldDisablePromote = isSaving || selectedEnvironment?.priority < appVersionEnvironment?.priority;
-
-  const handlePromote = () => {
-    const curentEnvIndex = environments.findIndex((env) => env.id === appVersionEnvironment.id);
-    setPromoteModalData({
-      current: appVersionEnvironment,
-      target: environments[curentEnvIndex + 1],
-    });
-  };
-
-  return (
-    <>
-      <ButtonSolid
-        variant="primary"
-        onClick={handlePromote}
-        size="md"
-        disabled={shouldDisablePromote}
-        data-cy="promote-button"
-      >
-        <ToolTip message="Promote this version to the next environment" placement="bottom" show={!shouldDisablePromote}>
-          <div style={{ fontSize: '14px' }}>Promote </div>
-        </ToolTip>
-        <svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-          <path
-            fill-rule="evenodd"
-            clip-rule="evenodd"
-            d="M0.276332 7.02113C0.103827 7.23676 0.138788 7.55141 0.354419 7.72391C0.57005 7.89642 0.884696 7.86146 1.0572 7.64583L3.72387 4.31249C3.86996 4.12988 3.86996 3.87041 3.72387 3.6878L1.0572 0.354464C0.884696 0.138833 0.57005 0.103872 0.354419 0.276377C0.138788 0.448881 0.103827 0.763528 0.276332 0.979158L2.69312 4.00014L0.276332 7.02113ZM4.27633 7.02113C4.10383 7.23676 4.13879 7.55141 4.35442 7.72391C4.57005 7.89642 4.8847 7.86146 5.0572 7.64583L7.72387 4.31249C7.86996 4.12988 7.86996 3.87041 7.72387 3.6878L5.0572 0.354463C4.8847 0.138832 4.57005 0.103871 4.35442 0.276377C4.13879 0.448881 4.10383 0.763527 4.27633 0.979158L6.69312 4.00014L4.27633 7.02113Z"
-            fill={shouldDisablePromote ? '#C1C8CD' : '#FDFDFE'}
-          />
-        </svg>
-      </ButtonSolid>
-
-      <PromoteConfirmationModal
-        data={promoteModalData}
-        editingVersion={editingVersion}
-        onClose={() => setPromoteModalData(null)}
-        fetchEnvironments={() => {}}
-      />
-    </>
-  );
-};
-
-export default PromoteVersionButton;
diff --git a/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/PromoteVersionButton.jsx b/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/PromoteVersionButton.jsx
index b75a1a8e32..a0e14f7bb2 100644
--- a/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/PromoteVersionButton.jsx
+++ b/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/PromoteVersionButton.jsx
@@ -7,24 +7,25 @@ import useStore from '@/AppBuilder/_stores/store';
 
 const PromoteVersionButton = () => {
   const [promoteModalData, setPromoteModalData] = useState(null);
-  const { isSaving, editingVersion, appVersionEnvironment, environments, selectedEnvironment } = useStore(
+  const { isSaving, editingVersion, appVersionEnvironment, environments, selectedEnvironment, currentEnvIndex } = useStore(
     (state) => ({
       isSaving: state.app.isSaving,
       editingVersion: state.currentVersionId,
       selectedEnvironment: state.selectedEnvironment,
       environments: state.environments,
       appVersionEnvironment: state.appVersionEnvironment,
+      currentEnvIndex: state.environments?.findIndex((env) => env?.id === state.appVersionEnvironment?.id),
     }),
     shallow
   );
 
-  const shouldDisablePromote = isSaving || selectedEnvironment?.priority < appVersionEnvironment?.priority;
+  // enable only after the environment details are loaded
+  const shouldDisablePromote = isSaving || selectedEnvironment?.priority < appVersionEnvironment?.priority || !appVersionEnvironment || !environments?.[currentEnvIndex + 1];
 
   const handlePromote = () => {
-    const curentEnvIndex = environments.findIndex((env) => env.id === appVersionEnvironment.id);
     setPromoteModalData({
       current: appVersionEnvironment,
-      target: environments[curentEnvIndex + 1],
+      target: environments[currentEnvIndex + 1],
     });
   };
 
@@ -54,7 +55,7 @@ const PromoteVersionButton = () => {
         data={promoteModalData}
         editingVersion={editingVersion}
         onClose={() => setPromoteModalData(null)}
-        fetchEnvironments={() => {}}
+        fetchEnvironments={() => { }}
       />
     </>
   );
diff --git a/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/components/PromoteConfirmationModal/PromoteConfirmationModal.jsx b/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/components/PromoteConfirmationModal/PromoteConfirmationModal.jsx
index 40abc2cf2d..cae938d130 100644
--- a/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/components/PromoteConfirmationModal/PromoteConfirmationModal.jsx
+++ b/frontend/src/modules/common/components/BasePromoteReleaseButton/components/PromoteVersionButton/components/PromoteConfirmationModal/PromoteConfirmationModal.jsx
@@ -126,7 +126,7 @@ const PromoteConfirmationModal = React.memo(({ data, onClose }) => {
               FROM
             </div>
             <div className="env-name" data-cy="current-env-name">
-              {capitalize(data?.current.name)}
+              {capitalize(data?.current?.name)}
             </div>
           </div>
           <div className="arrow-container">
@@ -144,11 +144,11 @@ const PromoteConfirmationModal = React.memo(({ data, onClose }) => {
               TO
             </div>
             <div className="env-name" data-cy="target-env-name">
-              {capitalize(data?.target.name)}
+              {capitalize(data?.target?.name)}
             </div>
           </div>
         </div>
-        {data?.current.name === 'development' && (
+        {data?.current?.name === 'development' && (
           <div className="env-change-info" data-cy="env-change-info-text">
             You won&apos;t be able to edit this version after promotion. Are you sure you want to continue?
           </div>