diff --git a/docs/contributing/development.md b/docs/contributing/development.md
index abbd2ce45dc9..27cbc0355722 100644
--- a/docs/contributing/development.md
+++ b/docs/contributing/development.md
@@ -75,17 +75,22 @@ This command:
 
 ### 3. Setting up the Frontend
 
-1. Install dependencies:
+1. Navigate to the frontend directory:
+   ```bash
+   cd frontend
+   ```
+
+2. Install dependencies:
    ```bash
    yarn install
    ```
 
-2. Create a `.env` file in the `frontend` directory:
+3. Create a `.env` file in this directory:
    ```env
    FRONTEND_API_ENDPOINT=http://localhost:8080
    ```
 
-3. Start the development server:
+4. Start the development server:
    ```bash
    yarn dev
    ```
diff --git a/frontend/src/container/PipelinePage/PipelineListsView/AddNewProcessor/index.tsx b/frontend/src/container/PipelinePage/PipelineListsView/AddNewProcessor/index.tsx
index 7d9edbc48bec..4199fee1e959 100644
--- a/frontend/src/container/PipelinePage/PipelineListsView/AddNewProcessor/index.tsx
+++ b/frontend/src/container/PipelinePage/PipelineListsView/AddNewProcessor/index.tsx
@@ -33,6 +33,10 @@ function AddNewProcessor({
 	const isAdd = isActionType === 'add-processor';
 
 	useEffect(() => {
+		if (isEdit || isAdd) {
+			// Reset form first to clear any stale fields from previous processors
+			form.resetFields();
+		}
 		if (isEdit && selectedProcessorData && expandedPipelineData?.config) {
 			const findRecordIndex = getRecordIndex(
 				expandedPipelineData?.config,
@@ -46,9 +50,6 @@ function AddNewProcessor({
 			setProcessorType(updatedProcessorData.type);
 			form.setFieldsValue(updatedProcessorData);
 		}
-		if (isAdd) {
-			form.resetFields();
-		}
 	}, [form, isEdit, isAdd, selectedProcessorData, expandedPipelineData?.config]);
 
 	const handleProcessorType = (value: string | unknown): void => {