impaktapps-ui-builder 0.0.596 → 0.0.751

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

@@ -1,7 +1,7 @@
 import { EventSchema } from "../elements/UiSchema/event/schema";
 import { EventUiSchema } from "../elements/UiSchema/event/uiSchema";
 import Component from "./component";
-import { okHandler, saveFormdataInLocalStorage, saveHandler } from "./utils";
+import { okHandler, saveFormdataInSessionStorage, saveHandler, getFormdataFromSessionStorage } from "./utils";
 import { APISection } from "../build/uischema/apiSection";
 import { getRadioInputField, getSelectField, getTextArea } from "../build/uischema/buildPropertiesSection";
 import { refreshSectionUiSchema } from "../build/uischema/refresh";
@@ -29,8 +29,20 @@ export default (
       if (handlerType) {
         if (handlerType === "custom") {
           uiSchema.elements[1].elements[0].elements[2] =  getRadioInputField("isSync","Run in Sync",["Yes","No"])
-          // uiSchema.elements[0].elements[0].elements[3] = emptyBox;
-          uiSchema.elements[1].elements[0].elements[3] = getTextArea("eventCode", "Write Custom Code", false)
+          uiSchema.elements[1].elements[0].elements[3] = {
+            type: "Control",
+            scope: "#/properties/emptyBox",
+            options: {
+              widget: "EmptyBox",
+            },
+          
+            config: {
+              layout: { xs: 0, sm: 6, md: 0, lg: 0 },
+              main: {},
+              style:{}
+            },
+          };
+          uiSchema.elements[1].elements[0].elements[4] = getTextArea("eventCode", "Write Custom Code", false)
           schema.required = ["eventType", "Handler", "eventCode"]
 
         } else if (handlerType === "api") {
@@ -38,12 +50,26 @@ export default (
           uiSchema.elements[1].elements[0].elements[3] = APISection;
           schema.required = ["eventType", "Handler", "method", "path"]
         } else if (handlerType === "inBuiltFunction") {
+          
           uiSchema.elements[1].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name", [
             { label: "RankProvider", value: "RankProvider" },
             { label: "Download File", value: "downloadFile" },
             { label: "Download Blob File", value: "downloadBlobFile" }
           ])
-          uiSchema.elements[1].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true);
+          uiSchema.elements[1].elements[0].elements[3] = {
+            type: "Control",
+            scope: "#/properties/emptyBox",
+            options: {
+              widget: "EmptyBox",
+            },
+          
+            config: {
+              layout: { xs: 6, sm: 6, md: 0, lg: 0 },
+              main: {},
+              style:{}
+            },
+          };
+          uiSchema.elements[1].elements[0].elements[4] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true);
           schema.required = ["eventType", "Handler", "inBuiltFunctionType"]
         } else if (handlerType === "refresh") {
           uiSchema.elements[1].elements[0].elements[2] = emptyBox;
@@ -59,6 +85,10 @@ export default (
           ...functionsName
         ]
       }
+      if (sessionStorage.getItem("copiedConfig") ) {
+        Component(store, dynamicData, submitHandler, service).ElementPathSetter(uiSchema);
+        schema.properties.RemoveItemButton.disabled = false;
+      }
       store.setSchema(schema)
       store.setUiSchema(uiSchema)
     },
@@ -68,7 +98,11 @@ export default (
       return EventUiSchema;
     },
     getSchema: () => {
-      return EventSchema;
+      const schema = _.cloneDeep(EventSchema);
+      if (sessionStorage.getItem("copiedConfig") ) {
+        schema.properties.RemoveItemButton.disabled = false;
+      }
+      return schema;
     },
     okHandler: () => okHandler(store),
     saveHandler: async () => await saveHandler(store, service, submitHandler, "PageMaster"),
@@ -85,7 +119,7 @@ export default (
       if (!Array.isArray(store.formData.events)) {
         store.formData.events = []
       }
-      saveFormdataInLocalStorage(store.ctx.core.data, path)
+      saveFormdataInSessionStorage(store.ctx.core.data, path)
       const finalPath = `${path}.events[${store.formData?.events?.length}]`
       store.searchParams.set("path", finalPath)
       store.setSearchParams(store.searchParams)
@@ -94,7 +128,7 @@ export default (
     editEvent: function () {
       const rowId = dynamicData.path.split(".")[1];
       const path = store.searchParams?.get("path");
-      saveFormdataInLocalStorage(store.ctx.core.data, path)
+      saveFormdataInSessionStorage(store.ctx.core.data, path)
       const finalPath = `${path}.events[${rowId}]`
       store.searchParams.set("path", finalPath)
       store.setSearchParams(store.searchParams)
@@ -110,8 +144,15 @@ export default (
     },
     deletePopUpEvent: function(){
       const rowId = dynamicData.path.split(".")[1];
-      localStorage.setItem('rowId',rowId);
+      sessionStorage.setItem('rowId',rowId);
       store.updateDialog("popUpEvent");
-    }
+    },
+    copyPasteElement:  function(){
+      Component(store, dynamicData, submitHandler, service).copyPasteElement(store,this.setPage.bind(this));
+    },
+    RemoveItemButton: function(){
+      Component(store, dynamicData, submitHandler, service).RemoveItemButton(store)
+    },
+
   }
 };

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

@@ -2,7 +2,7 @@ import { PageMasterSchema } from "../elements/UiSchema/PageMaster/schema";
 import { PageMasterUiSchema } from "../elements/UiSchema/PageMaster/uiSchema";
 import _ from "lodash";
 import Component from "./component";
-import { getFormdataFromLocalStorage, saveFormdataInLocalStorage, saveHandler } from "./utils";
+import { getFormdataFromSessionStorage, saveFormdataInSessionStorage, saveHandler } from "./utils";
 
 
 interface funcParamsProps {
@@ -26,21 +26,29 @@ export default (funcParams: funcParamsProps) => {
     getFormdata: async function () {
       const id = store.searchParams?.get("id");
       const config: any = await funcParams.pageConfigProvider(id)
-      const formData = getFormdataFromLocalStorage()
+      const formData = getFormdataFromSessionStorage()
       if (formData) {
         return formData;
       }
-      saveFormdataInLocalStorage(config)
+      saveFormdataInSessionStorage(config)
       return config
     },
     getUiSchema: function () {
-      return PageMasterUiSchema(store.theme.myTheme);
+      const UiSchema = _.cloneDeep(PageMasterUiSchema(store.theme.myTheme));
+      if (sessionStorage.getItem("copiedConfig") ) {
+        Component(store, dynamicData, submitHandler, service).ElementPathSetter(UiSchema)
+      }
+      return UiSchema;
     },
     getSchema: () => {
-      return PageMasterSchema;
+      const schema = _.cloneDeep(PageMasterSchema);
+      if (sessionStorage.getItem("copiedConfig") ) {
+        schema.properties.RemoveItemButton.disabled = false;
+      }
+      return schema;
     },
     backHandler: () => {
-      localStorage.removeItem("pageFormdata")
+      sessionStorage.removeItem("pageFormdata")
       store.navigate("/PageMasterRecords");
     },
     onAddClickHandler: function () {
@@ -48,7 +56,7 @@ export default (funcParams: funcParamsProps) => {
       if (!Array.isArray(store.formData.elements)) {
         store.formData.elements = []
       }
-      const response = saveFormdataInLocalStorage(store.ctx.core.data)
+      const response = saveFormdataInSessionStorage(store.ctx.core.data)
       if (id) {
         store.navigate(
           `/Component?path=${`elements[${response?.elements.length}]`}&id=${id}`
@@ -72,34 +80,44 @@ export default (funcParams: funcParamsProps) => {
       if (!Array.isArray(store.formData.events)) {
         store.formData.events = []
       }
-      saveFormdataInLocalStorage(store.ctx.core.data)
+      saveFormdataInSessionStorage(store.ctx.core.data)
       const finalPath = `events[${store.formData.events.length}]`
       store.navigate(`/ComponentEvents?path=${finalPath}&id=${id}`)
     },
     editEvent: function () {
       const rowId = dynamicData.path.split(".")[1];
       const id = store.searchParams?.get("id");
-      saveFormdataInLocalStorage(store.ctx.core.data)
+      saveFormdataInSessionStorage(store.ctx.core.data)
       const finalPath = `events[${rowId}]`
       store.navigate(`/ComponentEvents?path=${finalPath}&id=${id}`)
     },
     deleteEvent: function () {
-      const rowId = localStorage.getItem('rowId');
+      const rowId = sessionStorage.getItem('rowId');
       store.formData.events.splice(rowId, 1);
-      const response = saveFormdataInLocalStorage(store.ctx.core.data)
+      const response = saveFormdataInSessionStorage(store.ctx.core.data)
       store.setFormdata(response);
       store.updateDialog("popUpPageMasterEvent");
-      localStorage.removeItem('rowId');
+      sessionStorage.removeItem('rowId');
     },
     deletePopUpComponent: function(){
       const rowId = dynamicData.path.split(".")[1];
-      localStorage.setItem('rowId',rowId);
+      sessionStorage.setItem('rowId',rowId);
       store.updateDialog("popUpPageMasterComponent");
     },
     deletePopUpEvent: function(){
       const rowId = dynamicData.path.split(".")[1];
-      localStorage.setItem('rowId',rowId);
+      sessionStorage.setItem('rowId',rowId);
       store.updateDialog("popUpPageMasterEvent");
     },
+
+
+    copyPasteElement:  function(){
+      Component(store, dynamicData, submitHandler, service).copyPasteElement(store,this.setPage.bind(this));
+    },
+    
+    RemoveItemButton: function(){
+      Component(store, dynamicData, submitHandler, service).RemoveItemButton(store)
+    },
+    
   }
 };

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

@@ -1,10 +1,10 @@
 import buildConfig from "../build/buildConfig";
 import _ from "lodash";
 
-const clearFromLocalStorage = () => {
-    localStorage.removeItem("pageFormdata")
+const clearFromSessionStorage = () => {
+    sessionStorage.removeItem("pageFormdata")
 }
-export default clearFromLocalStorage;
+export default clearFromSessionStorage;
 export const getNavigationHistory = (config: any, path: string | undefined) => {
     if (path) {
         let urlRoutes: string = config.name;
@@ -31,20 +31,20 @@ export const getNavigationHistory = (config: any, path: string | undefined) => {
     return undefined;
 }
 
-export const saveFormdataInLocalStorage = (formData: any, path?: string) => {
+export const saveFormdataInSessionStorage = (formData: any, path?: string) => {
     let updatedFormdata: any;
     if (path) {
-        const pageFormdata = getFormdataFromLocalStorage()
+        const pageFormdata = getFormdataFromSessionStorage()
         updatedFormdata = _.set(pageFormdata, path, buildConfig(formData));
     } else {
         updatedFormdata = buildConfig(formData)
     }
-    localStorage.setItem("pageFormdata", JSON.stringify(updatedFormdata))
+    sessionStorage.setItem("pageFormdata", JSON.stringify(updatedFormdata))
     return updatedFormdata;
 }
 
-export const getFormdataFromLocalStorage = (path?: string) => {
-    const pageFormdata = localStorage.getItem("pageFormdata") ? JSON.parse(localStorage.getItem("pageFormdata")) : undefined;
+export const getFormdataFromSessionStorage = (path?: string) => {
+    const pageFormdata = sessionStorage.getItem("pageFormdata") ? JSON.parse(sessionStorage.getItem("pageFormdata")) : undefined;
     let returnValue: any;
     if (path) {
         returnValue = _.get(pageFormdata, path)
@@ -60,12 +60,12 @@ export const getFormdataFromLocalStorage = (path?: string) => {
 export async function saveHandler(store, service, submitHandler, pageName?: string) {
     const id = store.searchParams?.get("id");
     const path = store.searchParams?.get("path");
-    saveFormdataInLocalStorage(store.ctx.core.data, path);
-    const config = JSON.parse(localStorage.getItem("pageFormdata"));
+    saveFormdataInSessionStorage(store.ctx.core.data, path);
+    const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
     if (_.isEmpty(store.ctx.core.errors)) {
         try {
             const saveReturn = await submitHandler(store, service, config);
-            navigateHandler(store, true, pageName ? `/${pageName}?id=${saveReturn.id}` : "/PageMasterRecords")
+            navigateHandler(store, true, pageName ? `/${pageName}?id=${saveReturn.response.id}` : "/PageMasterRecords")
         } catch (err) {
             navigateHandler(store, false)
         }
@@ -74,7 +74,7 @@ export async function saveHandler(store, service, submitHandler, pageName?: stri
 
 export const navigateHandler = (store, isSubmitted, pageName?: string | boolean) => {
     if (isSubmitted) {
-        localStorage.removeItem("pageFormdata");
+        sessionStorage.removeItem("pageFormdata");
         store.navigate(pageName || -1)
         store.setNotify({
             SuccessMessage: "Submit Successfully",
@@ -92,7 +92,7 @@ export const navigateHandler = (store, isSubmitted, pageName?: string | boolean)
 export function okHandler(store) {
     const path = store.searchParams?.get("path");
     if (_.isEmpty(store.ctx.core.errors)) {
-        saveFormdataInLocalStorage(store.ctx.core.data, path)
+        saveFormdataInSessionStorage(store.ctx.core.data, path)
         store.navigate(-1)
         store.setNotify({
             SuccessMessage: "Save Successfully",

package/src/impaktapps-ui-builder/lib/index.ts

@@ -7,4 +7,4 @@ export { schema} from "../builder/build/buildUiSchema"
 export {default as buildConfig} from "../builder/build/buildConfig"
 export  {default as buildUiSchema} from "../builder/build/buildUiSchema"
 export  {buildSchema} from "../builder/build/buildUiSchema"
-export {default as clearFromLocalStorage} from "../builder/services/utils"
+export {default as clearFromSessionStorage} from "../builder/services/utils"

package/src/impaktapps-ui-builder/runtime/services/events.ts

@@ -90,7 +90,6 @@ export function getRefreshElements(eventConfig: any, eventGropus: any) {
   } else {
     if (eventGropus?.onLoad) {
       result = Object.keys(eventGropus?.onLoad)
-      result.push(result[0]);
     }
   }
   return result;
@@ -147,35 +146,39 @@ function executeCustomHandler(params: handlersProps) {
 }
 
 function mergeFormdata(handlerResponse: any, componentName: string, eventConfig: any, store: any, service: any, formDataHolder: any) {
-  if (eventConfig.type === "Select" && !(_.isEmpty(handlerResponse?.data) && handlerResponse?.data)) {
-    store.setSchema((pre) => {
-      return {
-        ...pre, properties: {
-          ...pre.properties, [componentName]: {
-            ...pre.properties?.[componentName],
-            oneOf: handlerResponse.data
+  if (eventConfig.type === "Select" && handlerResponse?.data) {
+    if (!_.isEmpty(handlerResponse?.data)) {
+      store.setSchema((pre) => {
+        return {
+          ...pre, properties: {
+            ...pre.properties, [componentName]: {
+              ...pre.properties?.[componentName],
+              oneOf: handlerResponse.data
+            }
           }
         }
-      }
-    })
+      })
+    }
   }
-  else if (eventConfig.type === "MultipleSelect" && !(_.isEmpty(handlerResponse?.data) && handlerResponse?.data)) {
-    store.setSchema((pre) => {
-      return {
-        ...pre, properties: {
-          ...pre.properties, [componentName]: {
-            ...pre.properties?.[componentName],
-            type: "array",
-            items: {
-              oneOf: handlerResponse?.data
+  else if (eventConfig.type === "MultipleSelect" && handlerResponse?.data) {
+    if (!_.isEmpty(handlerResponse?.data)) {
+      store.setSchema((pre) => {
+        return {
+          ...pre, properties: {
+            ...pre.properties, [componentName]: {
+              ...pre.properties?.[componentName],
+              type: "array",
+              items: {
+                oneOf: handlerResponse?.data
+              }
             }
           }
         }
-      }
-    })
+      })
+    }
   }
   else if (eventConfig.type === "page") {
-    if ((!_.isEmpty(handlerResponse?.data)) && handlerResponse?.data) {
+    if (!(_.isEmpty(handlerResponse?.data) && handlerResponse?.data)) {
       store.newData = {
         ...store.newData,
         ...handlerResponse?.data
@@ -207,7 +210,7 @@ const buildBodyFormat = (body: any[], formData: any, userValue: any, store: any)
       }
       else if (elem?.value?.startsWith("$local")) {
         const finalpath = elem.value.substring(7);
-        const value = JSON.parse(localStorage.getItem(finalpath) || '""')
+        const value = JSON.parse(sessionStorage.getItem(finalpath) || '""')
         finalBody[elem.key] = value;
       }
       else if (elem?.value?.startsWith("$")) {

package/src/impaktapps-ui-builder/runtime/services/service.ts

@@ -78,12 +78,12 @@ export default (funcParams: funcParamsProps) => {
     setPage: async function () {
       funcParams.store.setFormdata({});
       funcParams.store.newData = {};
-      const pageBasicDetailString = localStorage.getItem("pagemasterMetaData")
+      const pageBasicDetailString = sessionStorage.getItem("pagemasterMetaData")
       if (pageBasicDetailString) {
         pageData = JSON.parse(pageBasicDetailString)
       } else {
         pageData = await funcParams.pageDataProvider();
-        localStorage.setItem("pagemasterMetaData", JSON.stringify({
+        sessionStorage.setItem("pagemasterMetaData", JSON.stringify({
           schema: pageData?.schema,
           uiSchema: pageData?.uiSchema, config: pageData?.config
         }))
@@ -101,22 +101,20 @@ export default (funcParams: funcParamsProps) => {
           type: "HorizontalLayout",
           config: {
             main: {
-              direction: 'row'
+              direction: "row",
             },
             style: {
               flexDirection: "row",
               position: "absolute",
               bottom: 0,
-              marginBottom: '-8px',
-              height: 'fit-content',
-              overflow: 'hidden',
+              height: "fit-content",
+              overflow: "hidden",
               zIndex: 1000,
-              width: 'inherit'
-            }
+              width: "inherit",
+            },
           },
           elements: [
             {
-
               type: "Control",
               scope: "#/properties/FooterText",
               options: {
@@ -124,96 +122,88 @@ export default (funcParams: funcParamsProps) => {
               },
               config: {
                 main: {
-                  heading: "Copywriter@ACT21.IO"
+                  heading: "Copywriter@ACT21.IO",
                 },
                 style: {
-                  color: theme?.palette?.text.disabled || "#AFAFAF",
-                  fontSize: '12px',
-                  textAlign: 'center',
-                  lineHeight: 1,
-                  width: 'fit-content',
-                  left: '50%',
-                  position: 'relative',
+                  color: theme?.palette?.text?.disabled || "#AFAFAF",
+                  fontSize: "12px",
+                  textAlign: "center",
+                  lineHeight: 2,
+                  width: "fit-content",
+                  left: "50%",
+                  position: "relative",
                   margin: 0,
                   flexGrow: 1,
-                  height: 0
-                }
+                  height: 0,
+                  transform: "translate(-50%, 0%)",
+                },
               },
             },
             {
               type: "Control",
-              scope: "#/properties/backIcon",
+              scope: "#/properties/FooterBackIcon",
               options: {
                 widget: "Box",
               },
               config: {
                 main: {
-                  iconName: 'PrevIcon',
+                  iconName: "PrevIcon",
                   onClick: "backHandler",
-                  width: 'fit-content',
+                  width: "fit-content",
                 },
                 style: {
-                  fill: theme.palette.primary.main,
+                  fill: theme?.palette?.primary?.main,
                   width: 20,
                   height: 0,
-                  margin: 0,
+                  // margin: 0,
                   top: 0,
-                  right: '82px',
-                  position: 'absolute',
-                  fontSize: '12px',
-                  cursor: 'pointer',
-                  ':hover': {
-                    fill: theme.palette.primary.dark,
-                  }
-                }
-              }
+                  right: { xs: "12px", sm: "84px" },
+                  position: "absolute",
+                  fontSize: "12px",
+                  cursor: "pointer",
+                  ":hover": {
+                    fill: theme?.palette?.primary?.dark,
+                  },
+                  marginRight: "13px",
+                },
+              },
             },
             {
               type: "Control",
-              scope: "#/properties/text",
-
+              scope: "#/properties/FooterBackHandlerText",
               options: {
                 widget: "Box",
               },
               config: {
                 main: {
                   heading: "Previous Page",
-                  onClick: "backHandler"
+                  onClick: "backHandler",
                 },
                 style: {
-                  textAlign: 'left',
+                  display: { xs: "none", sm: "flex" },
+                  textAlign: "left",
                   lineHeight: 1,
                   height: 0,
-                  width: 'fit-content',
-                  color: theme.palette.primary.main,
-                  fontSize: "12px",
-                  cursor: 'pointer',
-                  marginLeft: '2px',
-                  marginRight: 0,
+                  width: "fit-content",
+                  color: theme?.palette?.primary?.main,
+                  fontSize: "14px",
+                  cursor: "pointer",
+                  marginLeft: "2px",
+        
                   top: 3,
-                  right: '12px',
-                  position: 'absolute',
-                  ':hover': {
-                    color: theme.palette.primary.dark,
-                  }
-                }
+                  right: "12px",
+                  position: "absolute",
+                  ":hover": {
+                    color: theme?.palette?.primary?.dark,
+                  },
+                  marginRight: "4px",
+                },
               },
             },
-          ]
+          ],
         }
       );
       const schema = pageData?.schema ?? { type: "object", properties: {} };
-      funcParams.store.setSchema(
-        (pre: any) => {
-          return {
-            ...schema, properties:
-              { ...schema.properties, ...pre.properties, }
-          }
-        }
-      )
-      uiSchema.elements.push(notifyUiSchema);
-      funcParams.store.setUiSchema(uiSchema);
-      eventGroups = {}
       eventGroups = extractEvents(config);
       executeEventsParameters = {
         config: {}, componentName: "",
@@ -226,7 +216,16 @@ export default (funcParams: funcParamsProps) => {
         store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
         serviceHolder: this, eventGroups, formDataHolder
       })
-     
+      funcParams.store.setSchema(
+        (pre: any) => {
+          return {
+            ...schema,...pre, properties:
+              { ...schema.properties, ...pre.properties, }
+          }
+        }
+      )
+      uiSchema.elements.push(notifyUiSchema);
+      funcParams.store.setUiSchema(uiSchema);
     },
     onCellRenderer: (cellParams) => {
       if (eventGroups.onCellRenderer) {

package/src/impaktapps-ui-builder/builder/build/uischema/lazyLoadingTable.ts

@@ -1,15 +0,0 @@
-export default {
-    type: "Control",
-    scope: "#/properties/LazyLoadingTable",
-    options: {
-      widget: "LazyLoadingTable",
-    },
-    elements:[],
-    config: {
-      main: {
-        onMount:"onMount",
-        columns: {
-        },
-      },
-    },
-  };