diff --git a/datahub-web-react/src/app/ingest/source/builder/DefineRecipeStep.tsx b/datahub-web-react/src/app/ingest/source/builder/DefineRecipeStep.tsx
index 46b5ec0bcd..4ff4623b54 100644
--- a/datahub-web-react/src/app/ingest/source/builder/DefineRecipeStep.tsx
+++ b/datahub-web-react/src/app/ingest/source/builder/DefineRecipeStep.tsx
@@ -45,12 +45,14 @@ export const DefineRecipeStep = ({ state, updateState, goTo, prev, ingestionSour
     const placeholderRecipe = getPlaceholderRecipe(ingestionSources, type);
 
     const [stagedRecipeYml, setStagedRecipeYml] = useState(existingRecipeYaml || placeholderRecipe);
+    const [stagedRecipeName, setStagedRecipeName] = useState(state.name);
 
     useEffect(() => {
         if (existingRecipeYaml) {
+            setStagedRecipeName(state.name);
             setStagedRecipeYml(existingRecipeYaml);
         }
-    }, [existingRecipeYaml]);
+    }, [existingRecipeYaml, state.name]);
 
     const [stepComplete, setStepComplete] = useState(false);
 
@@ -97,6 +99,7 @@ export const DefineRecipeStep = ({ state, updateState, goTo, prev, ingestionSour
     if (type && CONNECTORS_WITH_FORM.has(type)) {
         return (
             <RecipeBuilder
+                key={stagedRecipeName}
                 state={state}
                 isEditing={isEditing}
                 displayRecipe={displayRecipe}