From 4ee614b1324948a841f8b1e4eab9601f0921283a Mon Sep 17 00:00:00 2001
From: arunvjn <32433245+arunvjn@users.noreply.github.com>
Date: Tue, 15 Jun 2021 11:24:14 +0530
Subject: [PATCH] Fix/api editor enhancement (#5095)

* Keep datasource tab open when there are datasources configured in API editor

* Save headers when users save an action as datasource
---
 app/client/src/pages/Editor/APIEditor/Form.tsx |  4 +++-
 app/client/src/sagas/DatasourcesSagas.ts       | 17 ++++++++++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/app/client/src/pages/Editor/APIEditor/Form.tsx b/app/client/src/pages/Editor/APIEditor/Form.tsx
index fbabdfa4ec..044eece242 100644
--- a/app/client/src/pages/Editor/APIEditor/Form.tsx
+++ b/app/client/src/pages/Editor/APIEditor/Form.tsx
@@ -432,7 +432,9 @@ function ImportedHeaders(props: { headers: any }) {
 
 function ApiEditorForm(props: Props) {
   const [selectedIndex, setSelectedIndex] = useState(0);
-  const [showDatasources, toggleDatasources] = useState(false);
+  const [showDatasources, toggleDatasources] = useState(
+    !!props.datasources.length,
+  );
   const [
     apiBindHelpSectionVisible,
     setApiBindHelpSectionVisible,
diff --git a/app/client/src/sagas/DatasourcesSagas.ts b/app/client/src/sagas/DatasourcesSagas.ts
index 261d50fc2b..7db8ea5cf6 100644
--- a/app/client/src/sagas/DatasourcesSagas.ts
+++ b/app/client/src/sagas/DatasourcesSagas.ts
@@ -76,6 +76,7 @@ import { APPSMITH_TOKEN_STORAGE_KEY } from "pages/Editor/SaaSEditor/constants";
 import { checkAndGetPluginFormConfigsSaga } from "sagas/PluginSagas";
 import { PluginType } from "entities/Action";
 import LOG_TYPE from "entities/AppsmithConsole/logtype";
+import { isDynamicValue } from "utils/DynamicBindingUtils";
 
 function* fetchDatasourcesSaga() {
   try {
@@ -573,7 +574,21 @@ function* storeAsDatasourceSaga() {
   const pageId = yield select(getCurrentPageId);
   let datasource = _.get(values, "datasource");
   datasource = _.omit(datasource, ["name"]);
-
+  const originalHeaders = _.get(values, "actionConfiguration.headers", []);
+  const [datasourceHeaders, actionHeaders] = _.partition(
+    originalHeaders,
+    ({ key, value }: { key: string; value: string }) => {
+      return !(isDynamicValue(key) || isDynamicValue(value));
+    },
+  );
+  yield put(
+    setActionProperty({
+      actionId: values.id,
+      propertyName: "actionConfiguration.headers",
+      value: actionHeaders,
+    }),
+  );
+  _.set(datasource, "datasourceConfiguration.headers", datasourceHeaders);
   history.push(DATA_SOURCES_EDITOR_URL(applicationId, pageId));
 
   yield put(createDatasourceFromForm(datasource));