diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js
index ffc17622b8..533d23ab11 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/AssignGroups/index.js
@@ -49,7 +49,7 @@ class AssignGroups extends React.Component {
   };
 
   // generate payload by adding Assign Groups
-  onHandleContinue = () => {
+  onHandleContinue = (e, formName) => {
     this.props.form.validateFields((err, values) => {
       if (!err) {
         if (!values.users) {
@@ -58,10 +58,10 @@ class AssignGroups extends React.Component {
         if (values.deviceGroups === 'NONE') {
           delete values.deviceGroups;
         }
-        Object.assign(this.props.newPolicyPayload, values);
+        this.props.getPolicyPayloadData(formName, values);
+        this.props.getNextStep();
       }
     });
-    this.props.getNextStep();
   };
 
   getRolesList = () => {
@@ -239,7 +239,10 @@ class AssignGroups extends React.Component {
             <Button style={{ marginRight: 8 }} onClick={this.props.getPrevStep}>
               Back
             </Button>
-            <Button type="primary" onClick={this.onHandleContinue}>
+            <Button
+              type="primary"
+              onClick={e => this.onHandleContinue(e, 'groupData')}
+            >
               Continue
             </Button>
           </div>
diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/ConfigureProfile/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/ConfigureProfile/index.js
index d73a62c163..7d0d45c27c 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/ConfigureProfile/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/ConfigureProfile/index.js
@@ -296,13 +296,13 @@ class ConfigureProfile extends React.Component {
   };
 
   // generate payload by adding policy configurations
-  onHandleContinue = () => {
+  onHandleContinue = (e, formname) => {
     this.props.form.validateFields((err, values) => {
       if (!err) {
-        console.log(values);
+        this.props.getPolicyPayloadData(formname, values);
+        this.props.getNextStep();
       }
     });
-    this.props.getNextStep();
   };
 
   // generate form items
@@ -752,7 +752,10 @@ class ConfigureProfile extends React.Component {
             <Button style={{ marginRight: 8 }} onClick={this.props.getPrevStep}>
               Back
             </Button>
-            <Button type="primary" onClick={this.onHandleContinue}>
+            <Button
+              type="primary"
+              onClick={e => this.onHandleContinue(e, 'configureProfileData')}
+            >
               Continue
             </Button>
           </div>
diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/PublishDevices/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/PublishDevices/index.js
index 10726d2b4d..af7de28dd4 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/PublishDevices/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/PublishDevices/index.js
@@ -26,19 +26,13 @@ class PublishDevices extends React.Component {
     this.config = this.props.context;
   }
 
-  onClickSavePolicy = (event, isPublish) => {
+  onClickSavePolicy = (event, isPublish, formName) => {
     this.props.form.validateFields((err, values) => {
       if (!err) {
-        let policyProfile = Object.assign(this.props.policyProfile, {
-          profileName: values.policyName,
-        });
-        Object.assign(values, { profile: policyProfile });
-        Object.assign(this.props.newPolicyPayload, values);
         if (isPublish) {
-          Object.assign(this.props.newPolicyPayload, {
-            active: isPublish,
-          });
+          Object.assign(values, { active: isPublish });
         }
+        this.props.getPolicyPayloadData(formName, values);
       }
     });
   };
@@ -71,11 +65,18 @@ class PublishDevices extends React.Component {
             <Button
               type="primary"
               style={{ marginRight: 8 }}
-              onClick={() => this.onClickSavePolicy(true)}
+              onClick={e =>
+                this.onClickSavePolicy(e, true, 'publishDevicesData')
+              }
             >
               Save & Publish
             </Button>
-            <Button type="primary" onClick={this.onClickSavePolicy}>
+            <Button
+              type="primary"
+              onClick={e =>
+                this.onClickSavePolicy(e, false, 'publishDevicesData')
+              }
+            >
               Save
             </Button>
           </div>
diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPlatform/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPlatform/index.js
index d790408422..cb67f39898 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPlatform/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPlatform/index.js
@@ -35,12 +35,12 @@ class SelectPlatform extends React.Component {
     this.getDeviceTypes();
   }
 
-  onClickCard = (e, type) => {
+  onClickCard = (e, type, formname) => {
     this.props.getPolicyConfigJson(type);
     let deviceType = {
       deviceType: type,
     };
-    Object.assign(this.props.policyProfile, deviceType);
+    this.props.getPolicyPayloadData(formname, deviceType);
   };
 
   // fetch data from api
@@ -91,7 +91,9 @@ class SelectPlatform extends React.Component {
             size="default"
             style={{ width: 150 }}
             bordered={true}
-            onClick={e => this.onClickCard(e, data.name)}
+            onClick={e =>
+              this.onClickCard(e, data.name, 'selectedPlatformData')
+            }
             cover={
               <Icon
                 type="android"
diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPolicyType/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPolicyType/index.js
index 199a14ba0a..7c0c66be17 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPolicyType/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/components/SelectPolicyType/index.js
@@ -45,17 +45,16 @@ class SelectPolicyType extends React.Component {
   }
 
   // generate payload using Select policy type
-  onHandleContinue = () => {
+  onHandleContinue = (e, formName) => {
     this.props.form.validateFields((err, values) => {
       if (!err) {
         if (values.correctiveActions === 'NONE') {
           values.correctiveActions = [];
         }
-        Object.assign(this.props.newPolicyPayload, values);
+        this.props.getPolicyPayloadData(formName, values);
+        this.props.getNextStep();
       }
-      console.log('aaaaaaa');
     });
-    this.props.getNextStep();
   };
 
   fetchPolicies = () => {
@@ -156,7 +155,10 @@ class SelectPolicyType extends React.Component {
             <Button style={{ marginRight: 8 }} onClick={this.props.getPrevStep}>
               Back
             </Button>
-            <Button type="primary" onClick={this.onHandleContinue}>
+            <Button
+              type="primary"
+              onClick={e => this.onHandleContinue(e, 'policyTypeData')}
+            >
               Continue
             </Button>
           </div>
diff --git a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/index.js b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/index.js
index 2140bd4059..908c110cf0 100644
--- a/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/index.js
+++ b/components/device-mgt/io.entgra.device.mgt.ui/react-app/src/scenes/Home/scenes/Policies/components/AddPolicy/index.js
@@ -37,9 +37,45 @@ class AddPolicy extends React.Component {
       policyUIConfigurationsList: [],
       newPolicyPayload: { compliance: 'enforce' },
       policyProfile: {},
+      payloadData: {},
     };
   }
 
+  getPolicyPayloadData = (dataName, dataValue) => {
+    Object.defineProperty(this.state.payloadData, dataName, {
+      value: dataValue,
+      writable: true,
+    });
+    if (dataName === 'publishDevicesData') {
+      this.createPayload();
+    }
+  };
+
+  createPayload = () => {
+    const { newPolicyPayload } = this.state;
+    const {
+      publishDevicesData,
+      selectedPlatformData,
+      policyProfile,
+      policyTypeData,
+      groupData,
+    } = this.state.payloadData;
+    let profile = {
+      policyName: publishDevicesData.policyName,
+      devicetype: selectedPlatformData.deviceType,
+    };
+
+    let payload = Object.assign(
+      newPolicyPayload,
+      publishDevicesData,
+      policyProfile,
+      policyTypeData,
+      groupData,
+      { profile: profile },
+    );
+    console.log(payload);
+  };
+
   getPolicyConfigJson = type => {
     this.setState({ isLoading: true });
 
@@ -109,8 +145,7 @@ class AddPolicy extends React.Component {
               >
                 <SelectPlatform
                   getPolicyConfigJson={this.getPolicyConfigJson}
-                  newPolicyPayload={this.state.newPolicyPayload}
-                  policyProfile={this.state.policyProfile}
+                  getPolicyPayloadData={this.getPolicyPayloadData}
                 />
               </div>
               <div
@@ -118,7 +153,7 @@ class AddPolicy extends React.Component {
               >
                 <ConfigureProfile
                   policyUIConfigurationsList={policyUIConfigurationsList}
-                  policyProfile={this.state.policyProfile}
+                  getPolicyPayloadData={this.getPolicyPayloadData}
                   getPrevStep={this.getPrevStep}
                   getNextStep={this.getNextStep}
                 />
@@ -127,7 +162,7 @@ class AddPolicy extends React.Component {
                 style={{ display: currentStepIndex === 2 ? 'unset' : 'none' }}
               >
                 <SelectPolicyType
-                  newPolicyPayload={this.state.newPolicyPayload}
+                  getPolicyPayloadData={this.getPolicyPayloadData}
                   getPrevStep={this.getPrevStep}
                   getNextStep={this.getNextStep}
                 />
@@ -136,7 +171,7 @@ class AddPolicy extends React.Component {
                 style={{ display: currentStepIndex === 3 ? 'unset' : 'none' }}
               >
                 <AssignGroups
-                  newPolicyPayload={this.state.newPolicyPayload}
+                  getPolicyPayloadData={this.getPolicyPayloadData}
                   getPrevStep={this.getPrevStep}
                   getNextStep={this.getNextStep}
                 />
@@ -145,8 +180,7 @@ class AddPolicy extends React.Component {
                 style={{ display: currentStepIndex === 4 ? 'unset' : 'none' }}
               >
                 <PublishDevices
-                  newPolicyPayload={this.state.newPolicyPayload}
-                  policyProfile={this.state.policyProfile}
+                  getPolicyPayloadData={this.getPolicyPayloadData}
                   getPrevStep={this.getPrevStep}
                 />
               </div>