fix: fetching the plugin form config for queries if datasource is not viewable (#18749)

fetching the plugin form config for queries if datasource is not viewable

app/client/src/components/editorComponents/Button.tsx

@@ -57,7 +57,15 @@ const buttonStyles = css<Partial<ButtonProps>>`
 `;
 const StyledButton = styled((props: IButtonProps & Partial<ButtonProps>) => (
   <BlueprintButton
-    {...omit(props, ["iconAlignment", "fluid", "filled", "outline"])}
+    {...omit(props, [
+      "borderRadius",
+      "boxShadow",
+      "boxShadowColor",
+      "iconAlignment",
+      "fluid",
+      "filled",
+      "outline",
+    ])}
   />
 ))`
   ${buttonStyles}

app/client/src/entities/Engine/AppEditorEngine.ts

@@ -32,7 +32,7 @@ import {
 } from "@appsmith/constants/ReduxActionConstants";
 import { addBranchParam } from "constants/routes";
 import { APP_MODE } from "entities/App";
-import { all, call, put, select } from "redux-saga/effects";
+import { call, put, select } from "redux-saga/effects";
 import { failFastApiCalls } from "sagas/InitSagas";
 import { getCurrentApplication } from "selectors/editorSelectors";
 import { getCurrentGitBranch } from "selectors/gitSyncSelectors";
@@ -172,10 +172,8 @@ export default class AppEditorEngine extends AppEngine {
   }
 
   public *loadAppEntities(toLoadPageId: string, applicationId: string): any {
-    yield all([
-      call(this.loadPageThemesAndActions, toLoadPageId, applicationId),
-      call(this.loadPluginsAndDatasources),
-    ]);
+    yield call(this.loadPageThemesAndActions, toLoadPageId, applicationId);
+    yield call(this.loadPluginsAndDatasources);
   }
 
   public *completeChore() {

app/client/src/pages/Editor/Explorer/Files/index.tsx

@@ -65,7 +65,7 @@ function Files() {
           return (
             <div
               className={`text-sm text-[${Colors.CODE_GRAY}] pl-8 bg-trueGray-50 overflow-hidden overflow-ellipsis whitespace-nowrap`}
-              key={entity.name}
+              key={entity.name || "Queries"}
             >
               {entity.name}
             </div>

app/client/src/sagas/PluginSagas.ts

@@ -8,6 +8,7 @@ import PluginsApi, { DefaultPlugin, PluginFormPayload } from "api/PluginApi";
 import { validateResponse } from "sagas/ErrorSagas";
 import { getCurrentWorkspaceId } from "@appsmith/selectors/workspaceSelectors";
 import {
+  getActions,
   getDatasources,
   getPlugin,
   getPluginForm,
@@ -36,6 +37,7 @@ import {
   FormDependencyConfigs,
   FormDatasourceButtonConfigs,
 } from "utils/DynamicBindingUtils";
+import { ActionDataState } from "reducers/entityReducers/actionsReducer";
 
 function* fetchPluginsSaga(
   action: ReduxAction<{ workspaceId?: string } | undefined>,
@@ -86,6 +88,12 @@ function* fetchPluginFormConfigsSaga() {
       pluginIdFormsToFetch.add(graphqlPlugin.id);
     }
 
+    const actions: ActionDataState = yield select(getActions);
+    const actionPluginIds = actions.map((action) => action.config.pluginId);
+    for (const pluginId of actionPluginIds) {
+      pluginIdFormsToFetch.add(pluginId);
+    }
+
     const pluginFormData: PluginFormPayload[] = [];
     const pluginFormResponses: ApiResponse<PluginFormPayload>[] = yield all(
       [...pluginIdFormsToFetch].map((id) =>