refactor(global): ♻️ made function for builder type and builder data …

…in utility function file

also changes impact of it in different file

Ref #54

app/components/AppBuilder.tsx

@@ -7,66 +7,26 @@ import { useDispatch } from "react-redux";
 import { AppBuilderData } from "./data/app-builder/AppBuilder.data";
 import HeaderComp from "./Header";
 import ToolBoxGroup from "./toolbox/ToolBoxGroup";
-import GetDataFromReducer from "./UtilityFunction";
+import { GetDataFromReducer, getBuilderData, getBuilderType } from "./UtilityFunction";
 import ViewerGroup from "./viewers/ViewerGroup";
 import { addAppBuilderDataToReducer } from "../actions/reducer.action";
 import AppBuilderFactory from "../factory/AppBuilder.factory";
 
-interface DynamicSchema {
-  table: string;
-  database: string;
-  attributes: Record<string, {
-    type: string;
-    [key: string]: any;
-  }>;
-  associations: Array<{
-    data: Array<{
-      data: Record<string, any>;
-      type: string;
-    }>;
-    model: string;
-  }>;
-}
-
-interface DynamicEntityData {
-  id: number;
-  name: string;
-  desc: string | null;
-  system: any;
-  schema: DynamicSchema;
-  extraInfo: any;
-  _status: string;
-  entityRef: string | null;
-  deletedAt: string | null;
-  createdAt: string;
-  updatedAt: string;
-  commitId: string | null;
-  comments: any;
-  [key: string]: any; // Allow for additional dynamic fields
-}
-
-type BuilderData = {
-  builderType: string;
-  data: DynamicEntityData;
-};
-
-// function for get builder type
-export function getBuilderData(): BuilderData {
+/* function for get builder state */
+export function getBuilderState() {
   const location = coreUseLocation();
-  const { state } = location || {};
-  const { builderType = "Default", data = "" } = state || {};
 
-  return { builderType, data };
+  return location?.state || {};
 }
 
 export default function AppBuilder<T extends AppBuilderData>() {
-
-  const { builderType, data } = getBuilderData();
-
   const dispatch = useDispatch();
-
+
+  const builderType = getBuilderType();
+  const data = getBuilderData();
+
   const appBuilderData:T = AppBuilderFactory.getAppBuilderData(builderType);
-
+  
   useEffect(() => {
     dispatch(addAppBuilderDataToReducer(appBuilderData, data));
   }, []);
@@ -84,7 +44,6 @@ export default function AppBuilder<T extends AppBuilderData>() {
 
       {/* Content area of pagebuilder */}
       <CoreLayoutItem id={AppBuilderContainerLayout.PLACEHOLDER.Content}>
-        {/* <ViewerGroup builderType={builderType} viewerContent={viewerContent} builderJson={builderJson}/> */}
         <ViewerGroup viewerData={viewerData} />
       </CoreLayoutItem>
 

app/components/UtilityFunction.ts

@@ -1,9 +1,11 @@
 import { useSelector } from "react-redux";
 
+import { getBuilderState } from "./AppBuilder";
+import { DynamicEntity } from "./data/app-builder/DynamicEntity.interface";
 import AppBuilderFactory from "../factory/AppBuilder.factory";
 
 /** @TODO - Need to fix the naming of that function as this function name should be camel case */
-export default function GetDataFromReducer(builderType: string){
+export function GetDataFromReducer(builderType: string){
   return useSelector((state: any) => {
     let targetBuilderType = "";
 
@@ -65,3 +67,17 @@ export const GetViewerContent: () => any = () => {
   return useSelector((state: any) => state.BuilderOptions?.modelSchema);
 
 };
+
+/* Function to return the builder type */
+export function getBuilderType(): string {
+  const { builderType = "Default" } = getBuilderState();
+
+  return builderType;
+}
+
+/* Function to return the builder data */
+export function getBuilderData(): DynamicEntity {
+  const { data = {} } = getBuilderState();
+
+  return data;
+}

app/components/data/app-builder/DynamicEntity.interface.ts

@@ -0,0 +1,33 @@
+
+interface DynamicSchema {
+  table: string;
+  database: string;
+  attributes: Record<string, {
+    type: string;
+    [key: string]: any;
+  }>;
+  associations: Array<{
+    data: Array<{
+      data: Record<string, any>;
+      type: string;
+    }>;
+    model: string;
+  }>;
+}
+
+export interface DynamicEntity {
+  id: number;
+  name: string;
+  desc: string | null;
+  system: any;
+  schema: DynamicSchema;
+  extraInfo: any;
+  _status: string;
+  entityRef: string | null;
+  deletedAt: string | null;
+  createdAt: string;
+  updatedAt: string;
+  commitId: string | null;
+  comments: any;
+  [key: string]: any; // Allow for additional dynamic fields
+}

app/components/toolbox/PropertyToolBox.tsx

@@ -17,14 +17,13 @@ import {
 } from "@wrappid/core";
 
 import ToolBoxFactory from "../../factory/ToolBox.factory";
-import { getBuilderData } from "../AppBuilder";
-import GetDataFromReducer from "../UtilityFunction";
+import { GetDataFromReducer, getBuilderType } from "../UtilityFunction";
 
 export default function PropertyToolBox(){
   /** 1. Get builder type 
    *  2. Get data from reducer  
    *  3. Get toolbox content dependent on the variant */
-  const toolboxContent = getToolboxContentByVariant(GetDataFromReducer(getBuilderData().builderType)?.toolboxes);
+  const toolboxContent = getToolboxContentByVariant(GetDataFromReducer(getBuilderType())?.toolboxes);
 
   function getToolboxContentByVariant(toolboxData, variant = ToolBoxFactory.VARIANTS.PROPERTY) {
     if (!Array.isArray(toolboxData)) {

app/components/viewers/FormViewer.tsx

@@ -5,14 +5,13 @@ import { CoreBox, CoreTypographyBody1, CoreButton } from "@wrappid/core";
 import { useDispatch } from "react-redux";
 
 import { setToolboxContent, selectedAttribute } from "../../actions/reducer.action";
-import { getBuilderData } from "../AppBuilder";
-import GetDataFromReducer from "../UtilityFunction";
+import { GetDataFromReducer, getBuilderType } from "../UtilityFunction";
 
 export default function FormViewer() {
   const dispatch = useDispatch();
   const [attributeId, setAttributeId] = useState("");
 
-  const builderType = getBuilderData().builderType;
+  const builderType = getBuilderType();
   // const validPropsForAllComponent = Component.getValidProps();
   const modelAttributes = GetDataFromReducer(builderType)?.viewerGroupData[0]?.modelAttributes || [];