impaktapps-ui-builder 1.0.4 → 1.0.6

package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts

@@ -145,94 +145,70 @@ export const EventUiSchema: any = (theme) => {
                 enableDrag: true,
 
               },
-            },
-            elements: [
-
-              {
-                accessorKey: "eventType",
-                header: "Event's Type",
-                size: 300,
-                type: "string"
-              },
-              {
-                accessorKey: "Handler",
-                header: "Handler",
-                size: 200,
-                type: "string"
-              },
-              {
-                accessorKey: "Edit_Approve_Records",
-                header: "Edit",
-                type: "action",
-                size: 150,
-                widget: {
+              action: [
+                {
                   type: "Control",
                   scope: "#/properties/Edit_Records",
                   options: {
-                    widget: "IconButton",
+                    widget: "Button",
                   },
                   config: {
                     main: {
                       size: "small",
-                      icon: "TableEditIcon",
+                      startIcon: "EditIcon",
                       tooltipMessage: "Edit This Record",
                       onClick: "editEvent",
-                    },
-                    style: {
-                      fill: theme.palette.primary.main,
-                      "& :hover": {
-                        fill: theme.palette.primary.dark,
-                      },
+                      name: "Edit"
                     },
                   },
                 },
-              },
-              {
-                accessorKey: "Reject_Records",
-                header: "Delete",
-                type: "action",
-                size: 150,
-                widget: {
+                {
                   type: "Control",
                   scope: "#/properties/RejectButton",
                   options: {
-                    widget: "IconButton",
+                    widget: "Button",
                   },
                   config: {
                     main: {
-                      icon: "Bin",
+                      startIcon: "Bin",
                       tooltipMessage: "Reject This Record",
                       onClick: "deletePopUpEvent",
-                    },
-                    style: {
-                      fill: theme.palette.primary.main,
-                      "& :hover": {
-                        fill: theme.palette.primary.dark,
-                      },
+                      name: "Delete",
+                      size: "small"
                     },
                   },
                 },
-              },
-
-              {
-                header: "Copy",
-                field: "Copy_Event",
-                type: "action",
-                size: 150,
-                widget: {
+                {
                   type: "Control",
                   scope: "#/properties/Copy_Event",
                   options: {
-                    widget: "IconButton",
+                    widget: "Button",
                   },
                   config: {
                     main: {
-                      icon: "FileCopyIcon",
+                      startIcon: "FileCopyIcon",
                       onClick: "copyPasteElement",
-                      styleDefault: true,
+                      styleDefault: false,
+                      name: "Copy",
+                      size: "small"
                     },
                   },
                 },
+              ]
+            },
+            elements: [
+
+              {
+                accessorKey: "eventType",
+                header: "Event's Type",
+                size: 300,
+                type: "string"
+              },
+              {
+                accessorKey: "Handler",
+                header: "Handler",
+                size: 200,
+                type: "string"
               },
             ]
           }

package/src/impaktapps-ui-builder/builder/services/component.ts

@@ -8,40 +8,51 @@ import { StyleSection } from "../build/uischema/styleSection";
 import { TableSection } from "../build/uischema/tableSection";
 import { ValueTab } from "../build/uischema/valueTab";
 import { ValidationSection } from "../build/uischema/validationSections";
-import { getFormdataFromSessionStorage, okHandler, saveFormdataInSessionStorage, saveHandler } from "./utils";
+import { getFormdataFromSessionStorage, validateAndShowErrors, okHandler, saveFormdataInSessionStorage, saveHandler } from "./utils";
 const sectionLabels = {
   Select: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
   MultipleSelect: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
-  Table: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
-  LeaderBoard: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
-  WrapperSection: ["Core", "Components", "Properties", "Style", "Validation"],
-  TabSection: ["Core", "Components", "Properties", "Style", "Validation"],
-  SpeedoMeter: ["Core", "Properties", "Events", "Style", "Validation"],
+  Table: ["Core", "Components", "Properties", "Events", "Style",],
+  LeaderBoard: ["Core", "Components", "Properties", "Events", "Style",],
+  WrapperSection: ["Core", "Components", "Properties", "Style",],
+  HorizontalLayout: ["Core", "Components", "Properties", "Style",],
+  TabSection: ["Core", "Components", "TabTitles", "Properties", "Style", "Validation"],
+  SpeedoMeter: ["Core", "Properties", "Events", "Style",],
   card: ["Core", "Properties", "Events", "Style", "Validation"],
   UploadFile: ["Core", "Events", "Style", "Validation"],
   Graph: ["Core", "Properties", "Events", "Style", "Validation"],
   DownloadFile: ["Core", "Events", "Style", "Validation"],
-  Box: ["Core", "Events", "Style", "Validation"],
+  Box: ["Core", "Properties", "Events", "Style", "Validation"],
   Properties: ["Core", "Properties", "Events", "Style", "Validation"],
-  ProgressBarCard: ["Core", "Properties", "Events", "Style", "Validation"],
-  RankCard: ["Core", "Properties", "Events", "Style", "Validation"],
+  ProgressBarCard: ["Core", "Properties", "Events", "Style"],
+  ProgressBar: ["Core", "Properties", "Events", "Style",],
+  RankCard: ["Core", "Properties", "Events", "Style",],
+  MetricCard: ["Core", "Properties", "Events", "Style", "Validation"],
   Slider: ["Core", "Components", "Events", "Style", "Validation"],
-  Timer: ["Core", "Events", "Style", "Validation"],
-  Rank: ["Core", "Events", "Style", "Validation"],
+  Timer: ["Core", "Events", "Style",],
+  Rank: ["Core", "Events", "Style",],
   Button: ["Core", "Properties", "Events", "Style", "Validation"],
-  Array: ["Core", "Components", "Validation"],
+  ButtonGroup: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
+  Array: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
   Radio: ["Core", "Properties", "Events", "Style", "Validation"],
   Text: ["Core", "Properties", "Events", "Style", "Validation"],
   TextArea: ["Core", "Properties", "Events", "Style", "Validation"],
-  PopUp: ["Core", "Components", "Properties", "Style"],
+  PopUp: ["Core", "Components", "Properties", "Events", "Style"],
+  PopOver: ["Core", "Components", "Properties", "Style"],
+  PdfViewer: ["Core", "Properties", "Style"],
   Stepper: ["Core", "Components", "Properties", "Events", "Style"],
   DataGrid: ["Core", "Components", "Properties", "Events", "Style"],
   InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
   TreeMap: ["Core", "Components", "Properties", "Events", "Style"],
   ColumnGroup: ["Core", "Components"],
-  Thought: ["Core", "Properties", "Events", "Style", "Validation"]
+  Thought: ["Core", "Properties", "Events", "Style",],
+  Date: ["Core", "Properties", "Events", "Style", "Validation"],
+  DateTime: ["Core", "Properties", "Events", "Style", "Validation"],
+  Image: ["Core", "Properties", "Events", "Style"],
+  FileInput: ["Core", "Properties", "Events", "Style", "Validation"],
+  Camera: ["Core", "Properties", "Events", "Style", "Validation"],
+  OTP_Input: ["Core", "Properties", "Events", "Style", "Validation"],
 }
-
 export function refreshPage(type: string, store: any) {
   const UiSchema = _.cloneDeep(componentBasicUiSchema(store.theme.myTheme))
   const currentConfig = JSON.parse(sessionStorage.getItem("pageFormdata"));
@@ -52,6 +63,7 @@ export function refreshPage(type: string, store: any) {
       Style: StyleSection,
       Events: EventSection(store.theme.myTheme),
       Components: TableSection(store.theme.myTheme),
+      TabTitles: TableSection(store.theme.myTheme, "tabLabelElements"),
       Properties: buildPropertiesSection(type),
       Validation: ValidationSection
     }
@@ -63,12 +75,12 @@ export function refreshPage(type: string, store: any) {
   // Get Widget Type of parent
   const path = store.searchParams?.get("path");
   const lastDotIndex = path.lastIndexOf('.')
-  const parentPath = path.slice(0,lastDotIndex)
+  const parentPath = path.slice(0, lastDotIndex)
 
   const parentObj = _.get(currentConfig, parentPath)
 
-  if(parentObj?.type === "Table"){
-    UiSchema.elements[0].elements[0].elements[4] = 
+  if (parentObj?.type === "Table" || parentObj?.type === "ColumnGroup") {
+    UiSchema.elements[0].elements[0].elements[4] =
     {
       type: "Control",
       scope: "#/properties/columnFormat",
@@ -83,7 +95,7 @@ export function refreshPage(type: string, store: any) {
         },
       },
     };
-    UiSchema.elements[0].elements[0].elements[6] = 
+    UiSchema.elements[0].elements[0].elements[6] =
     {
       type: "Control",
       scope: "#/properties/filteringOptions",
@@ -98,7 +110,7 @@ export function refreshPage(type: string, store: any) {
         },
       },
     };
-    UiSchema.elements[0].elements[0].elements[5] = 
+    UiSchema.elements[0].elements[0].elements[5] =
     {
       type: "Control",
       scope: "#/properties/enableFilter",
@@ -113,52 +125,91 @@ export function refreshPage(type: string, store: any) {
         },
       },
     },
-    UiSchema.elements[0].elements[0].elements[7] = 
-    {
-      type: "Control",
-      scope: "#/properties/enableSorting",
-      options: {
-        widget: "RadioInputField",
+      UiSchema.elements[0].elements[0].elements[7] =
+      {
+        type: "Control",
+        scope: "#/properties/enableSorting",
+        options: {
+          widget: "RadioInputField",
+        },
+        config: {
+          layout: { xs: 6, sm: 6, md: 4, lg: 3 },
+          main: {
+            label: "Enable Sorting",
+            options: ["Yes", "No"],
+          },
+        },
       },
-      config: {
-        layout: { xs: 6, sm: 6, md: 4, lg: 3 },
-        main: {
-          label: "Enable Sorting",
-          options: ["Yes", "No"],
+      UiSchema.elements[0].elements[0].elements[8] =
+      {
+        type: "Control",
+        scope: "#/properties/columnKey",
+        config: {
+          layout: { xs: 6, sm: 6, md: 4, lg: 3 },
+          main: {
+            label: "Column Key",
+          },
+        },
+        options: {
+          widget: "InputField",
         },
       },
-    },
-    UiSchema.elements[0].elements[0].elements[8] = 
-    {
+      UiSchema.elements[0].elements[0].elements[9] =
+      {
+        type: "Control",
+        scope: "#/properties/elementType",
+        options: {
+          widget: "SelectInputField",
+        },
+        config: {
+          layout: { xs: 6, sm: 6, md: 4, lg: 3 },
+          main: {
+            label: "Element Type",
+          },
+        },
+      }
+    UiSchema.elements[0].elements[0].elements[10] = {
       type: "Control",
-      scope: "#/properties/columnKey",
+      scope: "#/properties/dateFormat",
+      options: {
+        widget: "SelectInputField",
+      },
       config: {
         layout: { xs: 6, sm: 6, md: 4, lg: 3 },
         main: {
-          label: "Column Key",
+          label: "Date Time Format",
         },
       },
+    }
+    UiSchema.elements[0].elements[0].elements[11] = {
+      type: "Control",
+      scope: "#/properties/emptyBox",
       options: {
-        widget: "InputField",
+        widget: "EmptyBox",
       },
-    },
-    UiSchema.elements[0].elements[0].elements[9] = 
-     {
+      config: {
+        layout: { xs: 0, sm: 0, md: 0, lg: 6 },
+      },
+    }
+  }
+  if (parentObj?.type === "LeaderBoard") {
+    UiSchema.elements[0].elements[0].elements[4] =
+    {
       type: "Control",
-      scope: "#/properties/elementType",
+      scope: "#/properties/columnFormat",
       options: {
         widget: "SelectInputField",
       },
       config: {
         layout: { xs: 6, sm: 6, md: 4, lg: 3 },
         main: {
-          label: "Element Type",
+          label: "Column Format",
         },
       },
-    }
+    };
   }
 
-  if (sessionStorage.getItem("copiedConfig") ) {
+  if (sessionStorage.getItem("copiedConfig")) {
     this.ElementPathSetter(UiSchema);
   }
   store.setUiSchema(UiSchema);
@@ -184,33 +235,33 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       if (sessionStorage.getItem("copiedConfig")) {
         schema.properties.RemoveItemButton.disabled = false;
       }
-      
+
       const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id")
 
-      let pathArray = [{label: config.name ?? "NewPage", path: `/PageMaster${id ? `?id=${id}` : ''}`}];
+      let pathArray = [{ label: config.name ?? "NewPage", path: `/PageMaster${id ? `?id=${id}` : ''}` }];
 
       if (path) {
-              const pathArrayAll = path.split(".");
-              const arr: any = []
-              pathArrayAll.map((e: string, i: number) => {
-                  if (i === 0) {
-                      arr.push(e)
-                      return;
-                  }
-                  arr.push(`${arr[i - 1]}.${e}`)
-              })
+        const pathArrayAll = path.split(".");
+        const arr: any = []
+        pathArrayAll.map((e: string, i: number) => {
+          if (i === 0) {
+            arr.push(e)
+            return;
+          }
+          arr.push(`${arr[i - 1]}.${e}`)
+        })
 
 
-              arr.map((e) => {
-                  const data = _.get(config, e)
-                  pathArray.push({
-                    label: data?.name || data?.eventType || "NewComponent",
-                    path: `/Component?path=${e}${id ? `&id=${id}` : ''}`
-                  });
-              })
-          }
+        arr.map((e) => {
+          const data = _.get(config, e)
+          pathArray.push({
+            label: data?.name || data?.eventType || "NewComponent",
+            path: `/Component?path=${e}${id ? `&id=${id}` : ''}`
+          });
+        })
+      }
 
       schema.properties.pageName.path = pathArray
       return schema;
@@ -226,13 +277,19 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       }
     },
     editComponents: function () {
+
+      if (validateAndShowErrors(store)) return;
       const rowId = dynamicData.path.split(".")[1];
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
       if (path) {
-        const path = store.searchParams?.get("path");
-        const finalPath = `${path}.elements[${rowId}]`
+        let finalPath = `${path}`;
+        if (dynamicData?.path?.startsWith("tabLabel")) {
+          finalPath = `${finalPath}.tabLabelElements[${rowId}]`
+        } else {
+          finalPath = `${finalPath}.elements[${rowId}]`
+        }
         store.searchParams.set("path", finalPath)
         store.setSearchParams(store.searchParams)
         this.setPage()
@@ -243,7 +300,12 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     deleteComponents: function (shouldUpdateDialog: boolean = true) {
       const path = store.searchParams?.get("path");
       const rowId = sessionStorage.getItem('rowId');
-      store.formData.elements.splice(rowId, 1);
+      const isTabLabelElements = sessionStorage.getItem('isTabLabelElements') === "true";
+      if (isTabLabelElements) {
+        store.formData.tabLabelElements.splice(rowId, 1);
+      } else {
+        store.formData.elements.splice(rowId, 1);
+      }
       const response = saveFormdataInSessionStorage(store.ctx.core.data, path)
       const data = path ? _.get(response, path) : response;
       store.setFormdata(data);
@@ -251,6 +313,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
         store.updateDialog("popUpComponentSection");
       }
       sessionStorage.removeItem('rowId');
+      sessionStorage.removeItem('isTabLabelElements');
     },
     deleteEvent: function (shouldUpdateDialog: boolean = true) {
       const path = store.searchParams?.get("path");
@@ -264,18 +327,29 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       sessionStorage.removeItem('rowId');
     },
     widgetAddClickHandler: function () {
+
+      if (validateAndShowErrors(store)) return;
       if (!Array.isArray(store.formData.elements)) {
         store.formData.elements = []
       }
+      if (!Array.isArray(store.formData.tabLabelElements)) {
+        store.formData.tabLabelElements = []
+      }
       const path = store.searchParams?.get("path");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
-      const finalPath = `${path}.elements[${store.formData.elements.length}]`
+      let finalPath = `${path}`;
+      if (dynamicData.path.startsWith("tabLabel")) {
+        finalPath = `${finalPath}.tabLabelElements[${store.formData.tabLabelElements.length}]`
+      } else {
+        finalPath = `${finalPath}.elements[${store.formData.elements.length}]`
+      }
       store.searchParams.set("path", finalPath)
       store.setSearchParams(store.searchParams)
       this.setPage()
 
     },
     eventEditHandler: function () {
+      if (validateAndShowErrors(store)) return;
       const rowId = dynamicData.path.split(".")[1];
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id");
@@ -284,6 +358,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       store.navigate(`/ComponentEvents?path=${finalPath}&id=${id}`)
     },
     eventAddHandler: function () {
+      if (validateAndShowErrors(store)) return;
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id");
       if (!Array.isArray(store.formData.events)) {
@@ -299,6 +374,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     deletePopUpComponent: function () {
       const rowId = dynamicData.path.split(".")[1];
       sessionStorage.setItem('rowId', rowId);
+      sessionStorage.setItem('isTabLabelElements', dynamicData.path.startsWith("tabLabel") ? "true" : "false");
       store.updateDialog("popUpComponentSection");
     },
     deletePopUpEvent: function () {
@@ -321,8 +397,8 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       const copiedElementPath = this.elementPathHandler(parentPathOfCopiedComponent, rowId, elementType);
       const copiedFormData = getFormdataFromSessionStorage(copiedElementPath);
 
-      this.ElementPathSetter(uiSchema,copiedFormData);
-      sessionStorage.setItem('copiedConfig',JSON.stringify(copiedFormData));
+      this.ElementPathSetter(uiSchema, copiedFormData);
+      sessionStorage.setItem('copiedConfig', JSON.stringify(copiedFormData));
       store.setNotify({
         SuccessMessage: `${elementType} Copied Successfully`,
         Success: true,
@@ -345,9 +421,17 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       if (!Array.isArray(store.formData.events)) {
         store.formData.events = []
       }
+      if (!Array.isArray(store.formData.tabLabelElements)) {
+        store.formData.tabLabelElements = []
+      }
       saveFormdataInSessionStorage(store.ctx.core.data, pastedElementParentPath);
       const formData = getFormdataFromSessionStorage(pastedElementParentPath);
-      const insertElementIndex = elementType === "Component" ? formData.elements.length : formData.events.length;
+      const currentLength = {
+        "TabsComponent": formData.tabLabelElements.length,
+        "Component": formData.elements.length,
+        "Events": formData.events.length
+      };
+      const insertElementIndex = currentLength[elementType] || 0;
       const pastedElementPath = this.elementPathHandler(pastedElementParentPath, insertElementIndex, elementType);
 
       const copiedConfig = JSON.parse(sessionStorage.getItem("copiedConfig"));
@@ -361,7 +445,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
           Fail: true,
         });
       }
-      else if(copiedConfig.name && elementType === "Events"){
+      else if (copiedConfig.name && elementType === "Events") {
         store.setNotify({
           FailMessage: notificationMessages.Component,
           Fail: true,
@@ -384,34 +468,37 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     elementPathHandler: function (parentPath: string, rowId: any, elementType: string) {
       if (elementType === "Component") {
         return parentPath ? `${parentPath}.elements[${rowId}]` : `elements[${rowId}]`;
+      }
+        if(elementType === "TabsComponent"){
+        return `${parentPath}.tabLabelElements[${rowId}]` 
       }
       return parentPath ? `${parentPath}.events[${rowId}]` : `events[${rowId}]`;
     },
     ElementPathSetter: function (uiSchema: any, copiedFormData?: any) {
       const formData = copiedFormData || JSON.parse(sessionStorage.getItem("copiedConfig"));
-      if(uiSchema?.elements?.[1]?.elements?.[0]?.config?.main?.headerIcons){
-        uiSchema.elements[1].elements[0].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage  = `Copied Component: ${formData.name}`;
+      if (uiSchema?.elements?.[1]?.elements?.[0]?.config?.main?.headerIcons) {
+        uiSchema.elements[1].elements[0].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage = `Copied Component: ${formData.name}`;
       }
-      else if(uiSchema?.elements?.[0]?.elements?.[1]?.elements?.[0]?.config?.main?.headerIcons){
-        uiSchema.elements[0].elements[1].elements[0].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage  = `Copied Component: ${formData.name}`;
+      else if (uiSchema?.elements?.[0]?.elements?.[1]?.elements?.[0]?.config?.main?.headerIcons) {
+        uiSchema.elements[0].elements[1].elements[0].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage = `Copied Component: ${formData.name}`;
       }
 
-      
-      if(uiSchema?.elements?.[1]?.elements?.[1]?.config?.main?.headerIcons){
-        uiSchema.elements[1].elements[1].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage  = `Copied Event: ${formData.eventType}`;
+
+      if (uiSchema?.elements?.[1]?.elements?.[1]?.config?.main?.headerIcons) {
+        uiSchema.elements[1].elements[1].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage = `Copied Event: ${formData.eventType}`;
       }
-      else if(uiSchema?.elements?.[0]?.elements?.[1]?.config?.main?.headerIcons){
-        uiSchema.elements[0].elements[1].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage  = `Copied Component: ${formData.eventType}`;
+      else if (uiSchema?.elements?.[0]?.elements?.[1]?.config?.main?.headerIcons) {
+        uiSchema.elements[0].elements[1].config.main.headerIcons.elements[1].widget.config.main.tooltipMessage = `Copied Component: ${formData.eventType}`;
       }
     },
 
-    
-    onNavigatePopupYes: function() {
-      try{
+
+    onNavigatePopupYes: function () {
+      try {
         store.navigate(sessionStorage.getItem("pendingNavigatePath"))
         store.updateDialog(`pageNamepopup`)
       }
-      catch(e){
+      catch (e) {
         store.updateDialog(`pageNamepopup`)
         store.setNotify({
           FailMessage: "Couldn't navigate page",
@@ -419,8 +506,8 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
         })
       }
     },
-    onNavigatePopupNo: function() {
-        store.updateDialog(`pageNamepopup`)
+    onNavigatePopupNo: function () {
+      store.updateDialog(`pageNamepopup`)
     }
   }
 };

package/src/impaktapps-ui-builder/builder/services/event.ts

@@ -6,6 +6,7 @@ import {
   saveFormdataInSessionStorage,
   saveHandler,
   getFormdataFromSessionStorage,
+  validateAndShowErrors,
 } from "./utils";
 import { APISection } from "../build/uischema/apiSection";
 import {
@@ -210,6 +211,7 @@ export default (
       }
     },
     addEvent: function () {
+      if (validateAndShowErrors(store)) return; 
       const path = store.searchParams?.get("path");
       if (!Array.isArray(store.formData.events)) {
         store.formData.events = [];
@@ -221,6 +223,7 @@ export default (
       this.setPage();
     },
     editEvent: function () {
+      if (validateAndShowErrors(store)) return; 
       const rowId = dynamicData.path.split(".")[1];
       const path = store.searchParams?.get("path");
       saveFormdataInSessionStorage(store.ctx.core.data, path);