Merge pull request #40885 from appsmithorg/release

06/06 Daily Promotion

Author: btsgh

app/client/cypress/e2e/Regression/ClientSide/Widgets/Input/Inputv2_spec.js

@@ -1,3 +1,4 @@
+import { DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE } from "../../../../../../src/constants/WidgetConstants";
 import { agHelper } from "../../../../../support/Objects/ObjectsCore";
 
 const widgetName = "inputwidgetv2";
@@ -385,7 +386,9 @@ describe(
       cy.get(widgetInput).clear();
       cy.wait(300);
       // Input text and hit enter key
-      cy.get(widgetInput).type("test{enter}");
+      cy.get(widgetInput).type("test{enter}", {
+        delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+      });
       // Assert if the Text widget contains the whole value, test
       cy.get(".t--widget-textwidget").should("have.text", "test");
     });

app/client/cypress/e2e/Regression/ClientSide/Widgets/ListV2/Listv2_BasicClientSideData_spec.js

@@ -1,6 +1,7 @@
 const publishLocators = require("../../../../../locators/publishWidgetspage.json");
 const commonlocators = require("../../../../../locators/commonlocators.json");
 
+import { DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE } from "../../../../../../src/constants/WidgetConstants";
 import * as _ from "../../../../../support/Objects/ObjectsCore";
 
 const widgetSelector = (name) => `[data-widgetname-cy="${name}"]`;
@@ -76,7 +77,7 @@ describe(
       cy.get(".t--draggable-inputwidgetv2").each(($inputWidget, index) => {
         cy.wrap($inputWidget)
           .find("input")
-          .type(index + 1);
+          .type(index + 1, { delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE });
       });
 
       // Verify the typed value
@@ -101,7 +102,7 @@ describe(
       cy.get(".t--draggable-inputwidgetv2").each(($inputWidget, index) => {
         cy.wrap($inputWidget)
           .find("input")
-          .type(index + 4);
+          .type(index + 4, { delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE });
       });
 
       // Verify the typed value

app/client/cypress/e2e/Regression/ClientSide/Widgets/ListV2/Listv2_Nested_EventBindings_spec.js

@@ -1,3 +1,4 @@
+import { DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE } from "../../../../../../src/constants/WidgetConstants";
 const nestedListDSL = require("../../../../../fixtures/Listv2/nestedList.json");
 const commonlocators = require("../../../../../locators/commonlocators.json");
 
@@ -22,10 +23,14 @@ describe(
         "{{showAlert(`${level_1.currentView.Text1.text} _ ${level_1.currentItem.id} _ ${level_1.currentIndex} _ ${level_1.currentView.Input1.text} _ ${currentView.Input2.text}`)}}",
       );
       // Enter text in the parent list widget's text input
-      cy.get(widgetSelector("Input1")).find("input").type("outer input");
+      cy.get(widgetSelector("Input1"))
+        .find("input")
+        .type("outer input", { delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE });
 
       // Enter text in the child list widget's text input in first row
-      cy.get(widgetSelector("Input2")).find("input").type("inner input");
+      cy.get(widgetSelector("Input2"))
+        .find("input")
+        .type("inner input", { delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE });
 
       // click the button on inner list 1st row.
       cy.get(widgetSelector("Button3")).find("button").click({ force: true });
@@ -40,13 +45,17 @@ describe(
       cy.get(widgetSelector("Input1"))
         .find("input")
         .clear()
-        .type("outer input updated");
+        .type("outer input updated", {
+          delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+        });
 
       // Enter text in the child list widget's text input in first row
       cy.get(widgetSelector("Input2"))
         .find("input")
         .clear()
-        .type("inner input updated");
+        .type("inner input updated", {
+          delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+        });
 
       // click the button on inner list 1st row.
       cy.get(widgetSelector("Button3")).find("button").click({ force: true });

app/client/cypress/support/Pages/AggregateHelper.ts

@@ -7,6 +7,7 @@ import { EntityItems } from "./AssertHelper";
 import EditorNavigator from "./EditorNavigation";
 import { EntityType } from "./EditorNavigation";
 import ClickOptions = Cypress.ClickOptions;
+import { DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE } from "../../../src/constants/WidgetConstants";
 
 type ElementType = string | JQuery<HTMLElement>;
 
@@ -945,10 +946,13 @@ export class AggregateHelper {
         .focus()
         .type("{backspace}".repeat(charCount), { timeout: 2, force: true })
         .wait(50)
-        .type(totype);
+        .type(totype, { delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE });
     else {
       if (charCount == -1) this.GetElement(selector).eq(index).clear();
-      this.TypeText(selector, totype, index);
+      this.TypeText(selector, totype, {
+        index,
+        delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+      });
     }
   }
 
@@ -973,7 +977,10 @@ export class AggregateHelper {
     force = false,
   ) {
     this.ClearTextField(selector, force, index);
-    return this.TypeText(selector, totype, index);
+    return this.TypeText(selector, totype, {
+      index,
+      delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+    });
   }
 
   public TypeText(
@@ -1323,7 +1330,10 @@ export class AggregateHelper {
     toClear && this.ClearInputText(name);
     cy.xpath(this.locator._inputWidgetValueField(name, isInput))
       .trigger("click")
-      .type(input, { parseSpecialCharSequences: false });
+      .type(input, {
+        parseSpecialCharSequences: false,
+        delay: DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE,
+      });
   }
 
   public ClearInputText(name: string, isInput = true) {

app/client/src/constants/WidgetConstants.tsx

@@ -279,3 +279,6 @@ export type PasteWidgetReduxAction = {
   groupWidgets: boolean;
   existingWidgets?: unknown;
 } & EitherMouseLocationORGridPosition;
+
+// Constant for debouncing the input change to avoid multiple Execute calls in reactive flow
+export const DEBOUNCE_WAIT_TIME_ON_INPUT_CHANGE = 300;

app/client/src/git/sagas/initGitSaga.ts

@@ -36,22 +36,24 @@ export default function* initGitForEditorSaga(
       yield put(gitArtifactActions.fetchMetadataInit({ artifactDef }));
       yield take(gitArtifactActions.fetchMetadataSuccess.type);
 
-      if (isAutocommitEnabled(artifactDef)) {
-        yield put(
-          gitArtifactActions.triggerAutocommitInit({ artifactDef, artifactId }),
-        );
-      }
-
       yield put(
         gitArtifactActions.fetchBranchesInit({ artifactDef, artifactId }),
       );
 
+      // We skip the auto-commit and status check for protected branches
+      // Hence we need to check if the current branch is protected before triggering auto-commit and status check
       if (isProtectedBranchesEnabled(artifactDef)) {
         yield put(
           gitArtifactActions.fetchProtectedBranchesInit({ artifactDef }),
         );
       }
 
+      if (isAutocommitEnabled(artifactDef)) {
+        yield put(
+          gitArtifactActions.triggerAutocommitInit({ artifactDef, artifactId }),
+        );
+      }
+
       yield put(
         gitArtifactActions.fetchStatusInit({ artifactDef, artifactId }),
       );

app/client/src/git/sagas/triggerAutocommitSaga.ts

@@ -11,7 +11,10 @@ import type {
 } from "git/requests/triggerAutocommitRequest.types";
 import type { TriggerAutocommitInitPayload } from "git/store/actions/triggerAutocommitActions";
 import { gitArtifactActions } from "git/store/gitArtifactSlice";
-import { selectAutocommitEnabled } from "git/store/selectors/gitArtifactSelectors";
+import {
+  selectAutocommitEnabled,
+  selectProtectedMode,
+} from "git/store/selectors/gitArtifactSelectors";
 import type { GitArtifactPayloadAction } from "git/store/types";
 import {
   call,
@@ -142,8 +145,13 @@ export default function* triggerAutocommitSaga(
     selectAutocommitEnabled,
     artifactDef,
   );
+  const isCurrentBranchProtected: boolean = yield select(
+    selectProtectedMode,
+    artifactDef,
+  );
+  const shouldAutocommit = isAutocommitEnabled && !isCurrentBranchProtected;
 
-  if (isAutocommitEnabled) {
+  if (shouldAutocommit) {
     const params = { artifactDef, artifactId };
     const pollTask: Task = yield fork(pollAutocommitProgressSaga, params);
 

app/client/src/git/store/actions/fetchStatusActions.ts

@@ -13,6 +13,7 @@ export const fetchStatusInitAction =
   createArtifactAction<FetchStatusInitPayload>((state) => {
     state.apiResponses.status.loading = true;
     state.apiResponses.status.error = null;
+    state.apiResponses.status.value = null;
 
     return state;
   });
@@ -26,6 +27,15 @@ export const fetchStatusSuccessAction = createArtifactAction<
   return state;
 });
 
+export const resetGitStatusAction =
+  createArtifactAction<FetchStatusRequestParams>((state) => {
+    state.apiResponses.status.loading = false;
+    state.apiResponses.status.error = null;
+    state.apiResponses.status.value = null;
+
+    return state;
+  });
+
 export const fetchStatusErrorAction =
   createArtifactAction<GitAsyncErrorPayload>((state, action) => {
     const { error } = action.payload;

app/client/src/git/store/gitArtifactSlice.ts

@@ -21,6 +21,7 @@ import {
   fetchStatusErrorAction,
   fetchStatusInitAction,
   fetchStatusSuccessAction,
+  resetGitStatusAction,
 } from "./actions/fetchStatusActions";
 import {
   clearCommitErrorAction,
@@ -200,6 +201,7 @@ export const gitArtifactSlice = createSlice({
     clearDiscardError: clearDiscardErrorAction,
     fetchStatusInit: fetchStatusInitAction,
     fetchStatusSuccess: fetchStatusSuccessAction,
+    resetGitStatus: resetGitStatusAction,
     fetchStatusError: fetchStatusErrorAction,
     fetchMergeStatusInit: fetchMergeStatusInitAction,
     fetchMergeStatusSuccess: fetchMergeStatusSuccessAction,

app/client/src/pages/Editor/PropertyPane/index.tsx

@@ -1,11 +1,12 @@
-import React, { useRef } from "react";
+import React, { useRef, useEffect, useState } from "react";
 import styled from "styled-components";
 import { useSelector } from "react-redux";
 import { PanelStack, Classes } from "@blueprintjs/core";
 
 import { get } from "lodash";
 import { getSelectedWidgets } from "selectors/ui";
 import PropertyPaneView from "./PropertyPaneView";
+import { retryPromise } from "utils/AppsmithUtils";
 
 const StyledPanelStack = styled(PanelStack)`
   height: 100%;
@@ -28,8 +29,29 @@ function PropertyPane() {
   const selectedWidgets = useSelector(getSelectedWidgets);
   const panelWrapperRef = useRef<HTMLDivElement>(null);
 
+  // Track registration state
+  const [controlsRegistered, setControlsRegistered] = useState(false);
+
+  useEffect(() => {
+    const loadPropertyControlBuilders = async () => {
+      const module = await retryPromise(
+        async () =>
+          import(
+            /* webpackChunkName: "PropertyControlRegistry" */ "utils/PropertyControlRegistry"
+          ),
+      );
+
+      module.default.registerPropertyControlBuilders();
+
+      setControlsRegistered(true);
+    };
+
+    loadPropertyControlBuilders();
+  }, []);
+
   // TODO: add analytics code
   if (
+    !controlsRegistered ||
     selectedWidgets.length === 0 ||
     get(selectedWidgets, "0.disablePropertyPane")
   ) {