added onQueryExecution trigger in query

Author: raheeliftikhar5

client/packages/lowcoder/src/comps/queries/queryComp.tsx

@@ -72,7 +72,7 @@ import { HttpQuery } from "./httpQuery/httpQuery";
 import { StreamQuery } from "./httpQuery/streamQuery";
 import { QueryConfirmationModal } from "./queryComp/queryConfirmationModal";
 import { QueryNotificationControl } from "./queryComp/queryNotificationControl";
-import { QueryPropertyView } from "./queryComp/queryPropertyView";
+import { findDependentQueries, QueryPropertyView } from "./queryComp/queryPropertyView";
 import { getTriggerType, onlyManualTrigger } from "./queryCompUtils";
 import { messageInstance } from "lowcoder-design/src/components/GlobalInstances";
 
@@ -100,6 +100,7 @@ interface AfterExecuteQueryAction {
 export const TriggerTypeOptions = [
   { label: "On Page Load", value: "onPageLoad"},
   { label: "On Input Change", value: "onInputChange"},
+  { label: "On Query Execution", value: "onQueryExecution"},
   { label: trans("query.triggerTypeAuto"), value: "automatic" },
   { label: trans("query.triggerTypeManual"), value: "manual" },
 ] as const;
@@ -159,6 +160,7 @@ const childrenMap = {
     },
   }),
   cancelPrevious: withDefault(BoolPureControl, false),
+  depQueryName: SimpleNameComp,
 };
 
 let QueryCompTmp = withTypeAndChildren<typeof QueryMap, ToInstanceType<typeof childrenMap>>(
@@ -639,6 +641,29 @@ export const QueryComp = withExposingConfigs(QueryCompTmp, [
 const QueryListTmpComp = list(QueryComp);
 
 class QueryListComp extends QueryListTmpComp implements BottomResListComp {
+  override reduce(action: CompAction): this {
+    if (isCustomAction<AfterExecuteQueryAction>(action, "afterExecQuery")) {
+      if (action.path?.length ===  1 && !isNaN(parseInt(action.path[0]))) {
+        const queryIdx = parseInt(action.path[0]);
+        const queryComps = this.getView();
+        const queryName = queryComps?.[queryIdx]?.children.name.getView();
+        const dependentQueries = queryComps.filter((query, idx) => {
+          if (queryIdx === idx) return false;
+          if (
+            getTriggerType(query) === 'onQueryExecution'
+            && query.children.depQueryName.getView() === queryName
+          ) {
+            return true; 
+          }
+        })
+        dependentQueries?.forEach((query) => {
+          query.dispatch(deferAction(executeQueryAction({})));
+        })
+      }
+    }
+    return super.reduce(action);
+  }
+
   nameAndExposingInfo(): NameAndExposingInfo {
     const result: NameAndExposingInfo = {};
     Object.values(this.children).forEach((comp) => {

client/packages/lowcoder/src/comps/queries/queryComp/queryPropertyView.tsx

@@ -37,6 +37,7 @@ import styled from "styled-components";
 import { DataSourceButton } from "pages/datasource/pluginPanel";
 import { Tooltip, Divider } from "antd";
 import { uiCompRegistry } from "comps/uiCompRegistry";
+import { InputTypeEnum } from "@lowcoder-ee/comps/comps/moduleContainerComp/ioComp/inputListItemComp";
 
 const Wrapper = styled.div`
   width: 100%;
@@ -233,6 +234,35 @@ export const QueryGeneralPropertyView = (props: {
     return TriggerTypeOptions;
   }, [datasourceType]);
 
+  const getQueryOptions = useMemo(() => {
+    const options: { label: string; value: string }[] =
+      editorState
+        ?.queryCompInfoList()
+        .map((info) => ({
+          label: info.name,
+          value: info.name,
+        }))
+        .filter((option) => {
+          // Filter out the current query under query
+          if (editorState.selectedBottomResType === BottomResTypeEnum.Query) {
+            return option.value !== editorState.selectedBottomResName;
+          }
+          return true;
+        }) || [];
+
+    // input queries
+    editorState
+      ?.getModuleLayoutComp()
+      ?.getInputs()
+      .forEach((i) => {
+        const { name, type } = i.getView();
+        if (type === InputTypeEnum.Query) {
+          options.push({ label: name, value: name });
+        }
+      });
+    return options;
+  }, [editorState]);
+
   return (
     <QueryPropertyViewWrapper>
       <QuerySectionWrapper>
@@ -336,28 +366,29 @@ export const QueryGeneralPropertyView = (props: {
         </QueryConfigWrapper>
 
         {placement === "editor" && (
-          <TriggerTypeStyled>
-            <Dropdown
-              placement={"bottom"}
-              label={trans("query.triggerType")}
-              options={ triggerOptions
-                // [
-                //   { label: "On Page Load", value: "onPageLoad"},
-                //   { label: "On Input Change", value: "onInputChange"},
-                //   {
-                //     label:
-                //       (children.compType.getView() === "js" || children.compType.getView() === "streamApi")
-                //         ? trans("query.triggerTypePageLoad")
-                //         : trans("query.triggerTypeAuto"),
-                //     value: "automatic",
-                //   },
-                //   { label: trans("query.triggerTypeManual"), value: "manual" },
-                // ] as const
-              }
-              value={children.triggerType.getView()}
-              onChange={(value) => children.triggerType.dispatchChangeValueAction(value as TriggerType)}
-            />
-          </TriggerTypeStyled>
+          <>
+            <TriggerTypeStyled>
+              <Dropdown
+                placement={"bottom"}
+                label={trans("query.triggerType")}
+                options={triggerOptions}
+                value={children.triggerType.getView()}
+                onChange={(value) => children.triggerType.dispatchChangeValueAction(value as TriggerType)}
+              />
+            </TriggerTypeStyled>
+            {children.triggerType.getView() === 'onQueryExecution' && (
+              <TriggerTypeStyled>
+                <Dropdown
+                  showSearch={true}
+                  placement={"bottom"}
+                  value={children.depQueryName.getView()}
+                  options={getQueryOptions}
+                  label={trans("eventHandler.selectQuery")}
+                  onChange={(value) => children.depQueryName.dispatchChangeValueAction(value)}
+                />
+              </TriggerTypeStyled>
+            )}
+          </>
         )}
       </QuerySectionWrapper>