From d988695abecff7265724939b32ba1c378e875b67 Mon Sep 17 00:00:00 2001
From: Mateusz Knapik <mateuszknapik@gmail.com>
Date: Thu, 29 Aug 2024 17:18:29 +0200
Subject: [PATCH] Add 'Open' event on modal component

---
 client/packages/lowcoder/src/comps/hooks/modalComp.tsx | 4 ++++
 client/packages/lowcoder/src/i18n/locales/en.ts        | 2 ++
 2 files changed, 6 insertions(+)

diff --git a/client/packages/lowcoder/src/comps/hooks/modalComp.tsx b/client/packages/lowcoder/src/comps/hooks/modalComp.tsx
index d9277f9d9e..0d7ea6be85 100644
--- a/client/packages/lowcoder/src/comps/hooks/modalComp.tsx
+++ b/client/packages/lowcoder/src/comps/hooks/modalComp.tsx
@@ -25,6 +25,7 @@ import { withDefault } from "comps/generators";
 import SliderControl from "../controls/sliderControl";
 
 const EventOptions = [
+  { label: trans("modalComp.open"), value: "open", description: trans("modalComp.openDesc") },
   { label: trans("modalComp.close"), value: "close", description: trans("modalComp.closeDesc") },
 ] as const;
 
@@ -169,6 +170,9 @@ let TmpModalComp = (function () {
               afterClose={() => {
                 props.toggleClose&&props.onEvent("close");
               }}
+              afterOpenChange={(open: boolean) => {
+                if (open) props.onEvent("open");
+              }}
               zIndex={Layers.modal}
               modalRender={(node) => <ModalStyled $style={props.style}>{node}</ModalStyled>}
               mask={props.showMask}
diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts
index 268a719ff0..8c10697108 100644
--- a/client/packages/lowcoder/src/i18n/locales/en.ts
+++ b/client/packages/lowcoder/src/i18n/locales/en.ts
@@ -2368,6 +2368,8 @@ export const en = {
 
 
   "modalComp": {
+    "open": "Open",
+    "openDesc": "Triggered When the Modal Dialog Box is Opened",
     "close": "Close",
     "closeDesc": "Triggered When the Modal Dialog Box is Closed",
     "openModalDesc": "Open the Dialog Box",