feat: Handling the case when reactive actions feature flag is turned off and the run behaviour is Automatic (#40709)

## Description

Handling the case when reactive actions feature flag is turned off and
the run behaviour is Automatic. We are updating the run behaviour in UI
alone (not DB) to show page load instead in this case.

Fixes [#40703](https://github.com/appsmithorg/appsmith/issues/40703)

## Automation

/ok-to-test tags="@tag.All"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/15144630350>
> Commit: ae4b5b6dafdb6ddc729828f46987afc68a634643
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=15144630350&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.All`
> Spec:
> <hr>Tue, 20 May 2025 19:22:57 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [ ] No


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
- Updated dropdown and function settings to respect feature flags,
ensuring certain options are shown or hidden based on feature
availability.

- **Bug Fixes**
- Improved handling of run behavior selection when specific feature
flags are disabled, automatically adjusting selections to maintain
consistent user experience.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

app/client/src/components/formControls/DropDownControl.test.tsx

@@ -9,6 +9,10 @@ import type { SelectOptionProps } from "@appsmith/ads";
 import type { ReduxAction } from "actions/ReduxActionTypes";
 import { PluginType } from "entities/Plugin";
 
+jest.mock("ee/selectors/featureFlagsSelectors", () => ({
+  selectFeatureFlags: jest.fn(() => {}),
+}));
+
 const mockStore = configureStore([]);
 
 const initialValues = {

app/client/src/components/formControls/DropDownControl.tsx

@@ -30,6 +30,9 @@ import type {
 } from "reducers/evaluationReducers/formEvaluationReducer";
 import NoSearchCommandFound from "./CustomActionsConfigControl/NoSearchCommandFound";
 import styled from "styled-components";
+import { ActionRunBehaviour } from "PluginActionEditor/types/PluginActionTypes";
+import type { FeatureFlags } from "ee/entities/FeatureFlag";
+import { selectFeatureFlags } from "ee/selectors/featureFlagsSelectors";
 
 const OptionLabel = styled(Text)`
   color: var(--ads-v2-color-fg);
@@ -139,6 +142,7 @@ export interface DropDownControlProps extends ControlProps {
     pluginId: string;
     identifier: string;
   };
+  featureFlags?: FeatureFlags;
 }
 
 interface ReduxDispatchProps {
@@ -298,6 +302,15 @@ function renderDropdown(
     selectedValue = uniqBy(selectedValue, (v) => v);
   }
 
+  /* temporary check added to switch from automatic to page load as the run behaviour when feature flag is turned off */
+  if (
+    selectedValue === ActionRunBehaviour.AUTOMATIC &&
+    input?.name === "runBehaviour" &&
+    !props.featureFlags?.release_reactive_actions_enabled
+  ) {
+    selectedValue = ActionRunBehaviour.ON_PAGE_LOAD;
+  }
+
   // Use memoized grouping
   const groupedOptions = memoizedBuildGroupedOptions(
     options,
@@ -558,11 +571,13 @@ const mapStateToProps = (
     pluginId: string;
     identifier: string;
   };
+  featureFlags: FeatureFlags;
 } => {
   let isLoading = false;
   // Start with the user-provided options if not fetching conditionally
   let options = ownProps.fetchOptionsConditionally ? [] : ownProps.options;
   const formValues: Partial<Action> = getFormValues(ownProps.formName)(state);
+  const featureFlags = selectFeatureFlags(state);
 
   let nextPageNeeded = false;
   let paginationPayload;
@@ -631,6 +646,7 @@ const mapStateToProps = (
     formValues,
     nextPageNeeded,
     paginationPayload,
+    featureFlags,
   };
 };
 

app/client/src/pages/Editor/JSEditor/JSEditorToolbar/components/JSFunctionSettings.tsx

@@ -58,15 +58,24 @@ interface FunctionSettingsRowProps extends Omit<Props, "actions"> {
 
 const FunctionSettingRow = (props: FunctionSettingsRowProps) => {
   const [runBehaviour, setRunBehaviour] = useState(props.action.runBehaviour);
-  const flagValueForReactiveActions = useFeatureFlag(
+  const isReactiveActionsEnabled = useFeatureFlag(
     FEATURE_FLAG.release_reactive_actions_enabled,
   );
   const options = RUN_BEHAVIOR_VALUES.filter(
     (option) =>
-      flagValueForReactiveActions ||
-      option.value !== ActionRunBehaviour.AUTOMATIC,
+      isReactiveActionsEnabled || option.value !== ActionRunBehaviour.AUTOMATIC,
   ) as SelectOptionProps[];
-  const selectedValue = options.find((opt) => opt.value === runBehaviour);
+  let selectedValue = options.find((opt) => opt.value === runBehaviour);
+
+  /* temporary check added to switch from automatic to page load as the run behaviour when feature flag is turned off */
+  if (
+    runBehaviour === ActionRunBehaviour.AUTOMATIC &&
+    !isReactiveActionsEnabled
+  ) {
+    selectedValue = options.find(
+      (opt) => opt.value === ActionRunBehaviour.ON_PAGE_LOAD,
+    );
+  }
 
   const onSelectOptions = useCallback(
     (newRunBehaviour: ActionRunBehaviourType) => {