@sapui5/sap.suite.ui.generic.template 1.147.1 → 1.148.0

package/src/sap/suite/ui/generic/template/lib/ai/EasyFill/EasyFillHandler.js

@@ -1,15 +1,30 @@
 sap.ui.define([
     "sap/ui/base/Object",
     "sap/base/util/extend",
-    "sap/ui/comp/smartform/Group",
     "sap/ui/comp/smartform/GroupElement",
     "sap/ui/comp/smartfield/SmartField",
-    "sap/ui/comp/smartfield/SmartLabel",
     "sap/m/MessageToast",
     "sap/ui/model/json/JSONModel",
-	"sap/ui/model/odata/AnnotationHelper"
-], function(BaseObject, extend, Group, GroupElement, SmartField, SmartLabel,MessageToast,JSONModel,AnnotationHelperModel) {
+	"sap/ui/model/odata/AnnotationHelper",
+    "sap/suite/ui/generic/template/lib/ai/EasyFill/ObjectPageSectionHandler",
+    "sap/m/VBox",
+    "sap/m/Text",
+    "sap/suite/ui/generic/template/library",
+    "sap/m/HBox",
+    "sap/ui/layout/form/ColumnElementData",
+    "sap/suite/ui/generic/template/js/AnnotationHelper",
+	"sap/suite/ui/generic/template/genericUtilities/controlHelper",
+    "sap/ui/model/Filter",
+    "sap/ui/model/FilterOperator",
+    "sap/m/Title",
+    "sap/m/SegmentedButton",
+    "sap/m/SegmentedButtonItem",
+    "sap/m/Table",
+    "sap/m/Column",
+    "sap/m/ColumnListItem"
+], function(BaseObject, extend, GroupElement, SmartField,MessageToast,JSONModel,AnnotationHelperModel,ObjectPageSectionHandler,VBox,Text,Library,HBox,ColumnElementData,GenericAnnotationHelper,controlHelper,Filter,FilterOperator,Title,SegmentedButton,SegmentedButtonItem,Table,Column,ColumnListItem) {
     'use strict';
+    const EasyFillLayoutMode = Library.EasyFillLayoutMode;
     /*
      * This is a handler class for EasyFill.
      * It gets initialized when the Fiori AI EasyFill  is enabled
@@ -26,6 +41,13 @@ sap.ui.define([
         let oRb;
         let oAIPopover;
         let aEditableFields = [];
+        let mCollectionUpdates = Object.create(null);
+        let mCollectionRowContexts = Object.create(null);
+        let mCollectionRowContextsByPath = Object.create(null);
+        let mCollectionProperties = Object.create(null);
+        let mCollectionEntityTypes = Object.create(null);
+        let mStagedRowValues = Object.create(null);
+        const MAX_TABLE_PREVIEW_ROWS = 20;
 
         async function openEasyFillDialog(oEvent,oContext) {
             let oEasyFillDialog;
@@ -42,15 +64,21 @@ sap.ui.define([
 
                 const oData = {
                     isBusy: false,
-                    isUpdatableVisible: false,
-                    isNonUpdatableVisible: false,
+                    isFormVisible: false,
                     isIllustrationVisible: true,
                     isSaveEnabled: false,
                     stateType: "Initial",
                     feedbackEnabled: true,
                     feedbackPressedUp: false,
                     feedbackPressedDown: false,
-                    isEasyFillButtonEnabled: false
+                    isEasyFillButtonEnabled: false,
+                    llmData: {},
+                    easyFillMode: EasyFillLayoutMode.CondensedMode,
+                    sections:[],
+                    isFullScreen: true,
+                    hasTableUpdates: false,
+                    hasTableValidationErrors: false,
+                    tableValidationMessage: ""
                   };
 
                   let oModel = new JSONModel(oData);
@@ -62,11 +90,32 @@ sap.ui.define([
             // cannot use OP path to create a list binding as it is a individual entry
             var sFragmentname = "sap.suite.ui.generic.template.lib.ai.EasyFill.fragments.EasyFillDialog";
 			oTemplateUtils.oCommonUtils.getDialogFragmentAsync(sFragmentname, {
+                onSelectionChange: function(oEvent) {
+                    const sSelectedKey = oEvent.getSource().getSelectedKey();
+                    const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
+                    const oEntityType = oTemplateUtils.oCommonUtils.getMetaModelEntityType(oController.getOwnerComponent().getEntitySet());
+                    easyFillDialogModel.setProperty("/easyFillMode",sSelectedKey);
+                    const oLLMResult = easyFillDialogModel.getProperty("/llmData");
+                    const aData = (sSelectedKey === EasyFillLayoutMode.CondensedMode) ? ObjectPageSectionHandler.getSectionsForCondensedView(oLLMResult) : ObjectPageSectionHandler.getSectionsForObjectPageView(oEntityType,oLLMResult,oRb);
+                    easyFillDialogModel.setProperty("/sections",aData);
+                },
                 onFeedbackPress: function() {
                     const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
                     easyFillDialogModel.setProperty("/feedbackEnabled",false);
                     MessageToast.show(oRb.getText("EASYFILL_RESULT_FEEDBACK"));
                 },
+                formatSectionTitle: function(sTitle) {
+                    if (!sTitle) {return "";}
+                    // Matches {@i18n>SomeKey} or {i18n>SomeKey}
+                    const oMatch = sTitle.match(/\{@?i18n>([^}]+)\}/);
+                    if (oMatch) {
+                        const sKey = oMatch[1];
+                        const oResourceBundle = oController.getView().getModel("i18n").getResourceBundle();
+                        return oResourceBundle.getText(sKey);
+                    }
+                    // No i18n pattern → return as-is
+                    return sTitle;
+                },
                 formatIllustrationType: function (sState) {
                     switch (sState) {
                         case "Initial":
@@ -110,7 +159,11 @@ sap.ui.define([
                             oObjectPageContext.setProperty(oProp, oTransientObject[oProp]);
                         }
                     }
-                    activateSideEffects();
+                    // Collection row values are already staged onto OData contexts via the editable New table;
+                    // clear staged tracking without reverting, then activate side effects.
+                    mStagedRowValues = Object.create(null);
+                    //Temporarily deactivating, Yet to be added again
+                    // activateSideEffects();
                     resetEasyFill(true);
                     oEasyFillDialog?.close();
                 },
@@ -122,51 +175,185 @@ sap.ui.define([
                     resetEasyFill(true);
                     oEasyFillDialog.close();
                 },
-                onEasyFillSubmitInputToAI : async function (oEvent) {  
+                formatFieldValue: function(sFieldName,oData) {
+                    return `{${sFieldName}}`;
+                },
+                onEasyFillSubmitInputToAI : async function (oEvent) {
                     const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
                     easyFillDialogModel.setProperty("/isBusy",true);
                     let mFieldMapping = getEntitySetMapForLLM();
                     let aiCallResult = await  oTemplateUtils.oServices.oFioriAIHandler.fioriaiLib.EasyFill.extractFieldValuesFromText(oController.byId("EasyFillInputTextArea").getValue(), mFieldMapping);
-                    resetEasyFill();
                     aEditableFields = [];
                     easyFillDialogModel.setProperty("/isBusy",false);
-                    formatDateValues(aiCallResult,mFieldMapping);       
+                    formatDateValues(aiCallResult,mFieldMapping);
+                    const oEntityType = oTemplateUtils.oCommonUtils.getMetaModelEntityType(oController.getOwnerComponent().getEntitySet());
+                    const sSelectedKey = easyFillDialogModel.getProperty("/easyFillMode") || EasyFillLayoutMode.CondensedMode;
+                    easyFillDialogModel.setProperty("/easyFillMode",sSelectedKey);
                     if (aiCallResult.success) {
-                        const {updatableFields,nonUpdatableFields} = getUpdatableAndNonUpdatableFields(aiCallResult.data);
+                        const {simpleFields,collectionFields} = splitAIResultByCollection(aiCallResult.data, mFieldMapping);
+                        const {updatableFields,nonUpdatableFields} = getUpdatableAndNonUpdatableFields(simpleFields);
                         mUpdatableLookupMap = updatableFields;
-                        if (Object.keys(updatableFields).length + Object.keys(nonUpdatableFields).length === 0) {
+                        //Setting up Sections for both condensed view and Object page view
+                        const aData = (sSelectedKey === EasyFillLayoutMode.CondensedMode) ? ObjectPageSectionHandler.getSectionsForCondensedView(simpleFields) : ObjectPageSectionHandler.getSectionsForObjectPageView(oEntityType,simpleFields,oRb);
+                        resetEasyFill();
+                        makeTransientContext();
+                        easyFillDialogModel.setProperty("/sections",aData);
+                        easyFillDialogModel.setProperty("/llmData",simpleFields);
+                        //Setting and rendering of SmartTables
+                        mCollectionUpdates = collectionFields;
+                        const bHasTableUpdates = Object.keys(mCollectionUpdates).length > 0;
+                        easyFillDialogModel.setProperty("/hasTableUpdates", bHasTableUpdates);
+                        const aTableValidationErrors = await validateCollectionUpdatesAgainstValueHelp(mFieldMapping);
+                        applyTableValidationState(aTableValidationErrors);
+                        renderCollectionPreviews(mFieldMapping, aTableValidationErrors);
+
+                        if (Object.keys(updatableFields).length + Object.keys(nonUpdatableFields).length === 0 && !bHasTableUpdates) {
                             easyFillDialogModel.setProperty("/stateType","NoEntries");
                             return;
                         }
                         easyFillDialogModel.setProperty("/isIllustrationVisible",false);
                         //Fillable Fields
-                        makeTransientContext();
-                        easyFillDialogModel.setProperty("/isUpdatableVisible",Object.keys(updatableFields).length > 0);
-                        if (Object.keys(updatableFields).length > 0) {
-                            const oAIResponseReviewRegionSmartFormForUpdatableFields = oController.byId("EasyFillUpdatebleForm");
-
-                            const oOldGroup = getGroupForSmartForm(updatableFields,false,oObjectPage.getBindingContext(),false);
-                            const oNewGroup = getGroupForSmartForm(updatableFields,true,oTransientContextForEasyFill,true);
-                            oAIResponseReviewRegionSmartFormForUpdatableFields.addGroup(oOldGroup);
-                            oAIResponseReviewRegionSmartFormForUpdatableFields.addGroup(oNewGroup);
-                            validateSmartForm();
-                        }
-                        //Non-Fillable Fields
-                        easyFillDialogModel.setProperty("/isNonUpdatableVisible",Object.keys(nonUpdatableFields).length > 0);
-                        if (Object.keys(nonUpdatableFields).length > 0) {
-                            const oAIResponseReviewRegionSmartFormForNonUpdatableFields = oController.byId("EasyFillNonUpdatebleForm");
-                            const oOldGroup = getGroupForSmartForm(nonUpdatableFields,false,oObjectPage.getBindingContext(),false);
-                            const oNewGroup = getGroupForSmartForm(nonUpdatableFields,false,oTransientContextForEasyFill,true);
-                            oAIResponseReviewRegionSmartFormForNonUpdatableFields.addGroup(oOldGroup);
-                            oAIResponseReviewRegionSmartFormForNonUpdatableFields.addGroup(oNewGroup);
+                        easyFillDialogModel.setProperty("/isFormVisible",Object.keys(updatableFields).length + Object.keys(nonUpdatableFields).length > 0);
+
+                        if (bHasTableUpdates) {
+                            easyFillDialogModel.setProperty("/isSaveEnabled", aTableValidationErrors.length === 0);
                         }
                     } else {
+                        applyTableValidationState([]);
                         easyFillDialogModel.setProperty("/stateType","Error");
                     }
                 },
+
                 onEasyFillClearAll: function() {
                     resetEasyFill(true);
                 },
+
+                populateSmartFields: function(sId, aFields, sEasyFillMode) {
+                    const oObjectPageLayout = oController.byId("EasyFillObjectPageLayout");
+                    if (!oObjectPageLayout || !Array.isArray(aFields) || aFields.length === 0) {
+                        return true;
+                    }
+
+                    const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
+
+                    setTimeout(() => {
+                        const oLLMData = easyFillDialogModel.getProperty("/llmData");
+                        let oTargetGroup = null;
+
+                        // sections -> ObjectPageSection
+                        oObjectPageLayout.getSections().forEach((oSection) => {
+                            // subSections -> ObjectPageSubSection
+                            oSection.getSubSections().forEach((oSubSection) => {
+                                // blocks -> SmartForm
+                                oSubSection.getBlocks().forEach((oBlock) => {
+                                    if (oBlock.isA("sap.ui.comp.smartform.SmartForm")) {
+                                        // ✅ Search inside Groups, not SmartForm
+                                        oBlock.getGroups().forEach((oGroup) => {
+                                            const oMatchedCustomData = oGroup.getCustomData().find(
+                                                (oData) => oData.getKey() === "id" && oData.getValue() === sId
+                                            );
+                                            if (oMatchedCustomData) {
+                                                oTargetGroup = oGroup;
+                                            }
+                                        });
+                                    }
+                                });
+                            });
+                        });
+
+                        if (!oTargetGroup) {
+                            return;
+                        }
+
+                        // Destroy old GroupElements before adding new
+                        oTargetGroup.destroyGroupElements();
+
+                        aFields.forEach((sKey) => {
+                            // const bFieldEditable = true;
+                            const oGroupElement = new GroupElement({
+                                useHorizontalLayout: false
+                              });
+
+                              const isEditable = mUpdatableLookupMap && !!mUpdatableLookupMap[sKey];
+
+                            const oSmartField = new SmartField({
+                                value: "{" + sKey + "}",
+                                editable: isEditable,
+                                enabled: isEditable,
+                                contextEditable: isEditable,
+                                //Yet to be added, Temporarily disabled
+                                // change: onSmartFieldChange.bind(this),
+                                layoutData: new ColumnElementData({
+                                    cellsSmall: 12,
+                                    cellsLarge: 12
+                                }),
+                                editableChanged: (oEvent) => {
+                                    if (oEvent.getParameter("editable") !== isEditable) {
+                                        oEvent.getSource().setEditable(isEditable);
+                                    }
+                                }
+                            });
+
+                            const oSmartFieldPrev = new SmartField({
+                                value: "{" + sKey + "}",
+                                editable: false,
+                                enabled: false,
+                                contextEditable: false,
+                                showLabel: false,
+                                visible: isEditable,
+                                layoutData: new ColumnElementData({
+                                    cellsSmall: 9,
+                                    cellsLarge: 10
+                                }),
+                                editableChanged: (oEvent) => {
+                                    if (oEvent.getParameter("editable") !== false) {
+                                        oEvent.getSource().setEditable(false);
+                                    }
+                                }
+                            });
+
+
+                            if (isEditable) {
+                                oSmartField.setBindingContext(oTransientContextForEasyFill);
+                                oSmartFieldPrev.setBindingContext(oObjectPageContext);
+                                // aEditableFields.push(oSmartField);
+                                oTransientContextForEasyFill.setProperty(sKey, oLLMData[sKey]);
+                            } else {
+                                oSmartField.setBindingContext(oObjectPageContext);
+                            }
+                            oGroupElement.addElement(oSmartField);   // label source
+                            oGroupElement.addElement( new Text({
+                                text: "Previously:",
+                                visible: isEditable,
+                                layoutData: new ColumnElementData({
+                                    cellsSmall: 3,
+                                    cellsLarge: 2
+                                })
+                            }));
+                            oGroupElement.addElement(oSmartFieldPrev);
+                            oTargetGroup.addGroupElement(oGroupElement);
+                        });
+
+                    }, 0);
+
+                    return true;
+                },
+
+                onToggleFullScreen: function() {
+                    const oEasyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
+                    const bIsFullScreen = oEasyFillDialogModel.getProperty("/isFullScreen");
+                    // ✅ Toggle fullscreen state
+                    oEasyFillDialogModel.setProperty("/isFullScreen", !bIsFullScreen);
+                    if (bIsFullScreen) {
+                        oController.byId("inputAreaSplitPane").getLayoutData().setSize("0%");
+                        oController.byId("reviewAreaSplitPane").getLayoutData().setSize("100%");
+                    } else {
+                        oController.byId("inputAreaSplitPane").getLayoutData().setSize("40%");
+                        oController.byId("reviewAreaSplitPane").getLayoutData().setSize("60%");
+                    }
+                },
+
+
                 onLinkPress: async function(oEvent) {
                     if (!oAIPopover) {
                         oAIPopover = await getAIPopover();
@@ -179,51 +366,52 @@ sap.ui.define([
 			});
         }
 
-        function activateSideEffects() {
-            //Making a set so that , duplicate field group ids are not passed
-            const aFieldGroupIdSet = new Set();
-            aEditableFields.forEach((oSmartField)=>{
-                //SideEffect would be invoked only for the editable controls inside the SmartField
-                const aEditableInnerFields = oSmartField.getInnerControls().filter((oControl)=>oControl.getEditable());
-                aEditableInnerFields.forEach((oControl)=>{
-                    const aControlFieldGroupId = oControl.getFieldGroupIds();
-                    if (aControlFieldGroupId.length > 0) {
-                        aControlFieldGroupId.forEach((sFieldGroupId)=>{
-                            aFieldGroupIdSet.add(sFieldGroupId);
-                        });
-                    }
-                });
+        //Yet to implement, temporarily disabled
+        // function activateSideEffects() {
+        //     //Making a set so that , duplicate field group ids are not passed
+        //     const aFieldGroupIdSet = new Set();
+        //     aEditableFields.forEach((oSmartField)=>{
+        //         //SideEffect would be invoked only for the editable controls inside the SmartField
+        //         const aEditableInnerFields = oSmartField.getInnerControls().filter((oControl)=>oControl.getEditable());
+        //         aEditableInnerFields.forEach((oControl)=>{
+        //             const aControlFieldGroupId = oControl.getFieldGroupIds();
+        //             if (aControlFieldGroupId.length > 0) {
+        //                 aControlFieldGroupId.forEach((sFieldGroupId)=>{
+        //                     aFieldGroupIdSet.add(sFieldGroupId);
+        //                 });
+        //             }
+        //         });
 
-            });
+        //     });
 
-            const oView = oController.getView();
-
-            aFieldGroupIdSet.forEach((sFieldGroupId)=>{
-                const oID = oView.data(sFieldGroupId);
-
-                /**
-                 * Currently, the SmartFields are created using the TransientContext, which means both
-                 * "context" and "contextObject" refer to the TransientContext instance.
-                 *
-                 * However, we need to use the original OP context so that side effects are triggered
-                 * on the original OP context when the user saves data from the EasyFill dialog back to OP.
-                 *
-                 * Therefore, we update the "context" and "contextObject" to reference the original OP context.
-                 */
-
-                if (oID) {
-                    oID["context"] = oObjectPageContext.getPath();
-                    oID["contextObject"] = oObjectPageContext;
-                    oView.data(sFieldGroupId,oID);
-                }
-                //To make sure that all the fields sideeffect would be triggered
-                const sSideEffectQualifier = oTemplateUtils.oServices.oApplicationController._getSideEffectsQualifier(oID.name);
-                oTemplateUtils.oServices.oApplicationController.registerGroupChange(sSideEffectQualifier);
-            });
+        //     const oView = oController.getView();
 
+        //     aFieldGroupIdSet.forEach((sFieldGroupId)=>{
+        //         const oID = oView.data(sFieldGroupId);
+
+        //         /**
+        //          * Currently, the SmartFields are created using the TransientContext, which means both
+        //          * "context" and "contextObject" refer to the TransientContext instance.
+        //          *
+        //          * However, we need to use the original OP context so that side effects are triggered
+        //          * on the original OP context when the user saves data from the EasyFill dialog back to OP.
+        //          *
+        //          * Therefore, we update the "context" and "contextObject" to reference the original OP context.
+        //          */
+
+        //         if (oID) {
+        //             oID["context"] = oObjectPageContext.getPath();
+        //             oID["contextObject"] = oObjectPageContext;
+        //             oView.data(sFieldGroupId,oID);
+        //         }
+        //         //To make sure that all the fields sideeffect would be triggered
+        //         const sSideEffectQualifier = oTemplateUtils.oServices.oApplicationController._getSideEffectsQualifier(oID.name);
+        //         oTemplateUtils.oServices.oApplicationController.registerGroupChange(sSideEffectQualifier);
+        //     });
 
-            oView.triggerValidateFieldGroup([...aFieldGroupIdSet]);
-        }
+
+        //     oView.triggerValidateFieldGroup([...aFieldGroupIdSet]);
+        // }
 
         function getAIPopover() {
             return new Promise(async(resolve,reject) => {
@@ -237,7 +425,7 @@ sap.ui.define([
             });
         }
 
-        function getEntitySetMapForLLM() {
+        function getEntitySetMapForLLM(oLLMResult) {
             const mPropertyMap = {};
             const oEntityType = oTemplateUtils.oCommonUtils.getMetaModelEntityType(oController.getOwnerComponent().getEntitySet());
             oEntityType.property.forEach((oProperty)=>{
@@ -248,6 +436,7 @@ sap.ui.define([
                     };
                 }
             });
+            appendCollectionMapForLLM(mPropertyMap);
             return mPropertyMap;
         }
 
@@ -266,38 +455,66 @@ sap.ui.define([
             }
         }
 
-        function validateSmartForm() {
-            setTimeout(async() => {
-                const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
-                try {
-                    const oAIResponseReviewRegionSmartFormForUpdatableFields = oController.byId("EasyFillUpdatebleForm");
-                    const aIds = await oAIResponseReviewRegionSmartFormForUpdatableFields.check();
-                    easyFillDialogModel.setProperty("/isSaveEnabled",aIds.length === 0);
-                } catch (error) {
-                    easyFillDialogModel.setProperty("/isSaveEnabled",false);
-                }
-            }, 0);
+        //Yet to be implemented, temporarily disabled
+        // function validateSmartForm() {
+        //     setTimeout(async() => {
+        //         const easyFillDialogModel = oController.getView().getModel("easyFillDialogModel");
+        //         try {
+        //             const oAIResponseReviewRegionSmartFormForUpdatableFields = oController.byId("EasyFillUpdatebleForm");
+        //             const aIds = await oAIResponseReviewRegionSmartFormForUpdatableFields.check();
+        //             const bHasTableValidationErrors = !!easyFillDialogModel.getProperty("/hasTableValidationErrors");
+        //             easyFillDialogModel.setProperty("/isSaveEnabled",aIds.length === 0 && !bHasTableValidationErrors);
+        //         } catch (error) {
+        //             easyFillDialogModel.setProperty("/isSaveEnabled",false);
+        //         }
+        //     }, 0);
+        // }
+
+        function applyTableValidationState(aValidationErrors) {
+            const easyFillDialogModel =  oController.getView().getModel("easyFillDialogModel");
+            if (!aValidationErrors || aValidationErrors.length === 0) {
+                easyFillDialogModel.setProperty("/hasTableValidationErrors", false);
+                easyFillDialogModel.setProperty("/tableValidationMessage", "");
+                return;
+            }
+            const sSummary = aValidationErrors.slice(0, 3).map(function(oError) {
+                return oError.collectionLabel + " / " + oError.rowLabel + " / " + oError.propertyLabel;
+            }).join(", ");
+            easyFillDialogModel.setProperty("/hasTableValidationErrors", true);
+            easyFillDialogModel.setProperty(
+                "/tableValidationMessage",
+                oRb.getText("EASY_FILL_TABLE_VALIDATION_MESSAGE", [sSummary])
+            );
         }
 
         function resetEasyFill(bRemoveTextAreaValue) {
             const easyFillDialogModel =  oController.getView().getModel("easyFillDialogModel");
-            const oAIResponseReviewRegionSmartFormForNonUpdatableFields = oController.byId("EasyFillNonUpdatebleForm");
-            const oAIResponseReviewRegionSmartFormForUpdatableFields = oController.byId("EasyFillUpdatebleForm");
-            oAIResponseReviewRegionSmartFormForUpdatableFields.destroyGroups();
-            oAIResponseReviewRegionSmartFormForNonUpdatableFields.destroyGroups();
+            const oTablePreviewContainer = oController.byId("EasyFillTablePreviewContainer");
+            if (oTablePreviewContainer) {
+                oTablePreviewContainer.destroyItems();
+            }
+            revertStagedCollectionUpdates();
             resetTransientContext();
-            easyFillDialogModel.setProperty("/isUpdatableVisible",false);
-            easyFillDialogModel.setProperty("/isNonUpdatableVisible",false);
+            easyFillDialogModel.setProperty("/isFormVisible",false);
             easyFillDialogModel.setProperty("/isIllustrationVisible",true);
             easyFillDialogModel.setProperty("/isSaveEnabled",false);
             easyFillDialogModel.setProperty("/stateType","Initial");
             easyFillDialogModel.setProperty("/feedbackEnabled",true);
             easyFillDialogModel.setProperty("/feedbackPressedUp",false);
             easyFillDialogModel.setProperty("/feedbackPressedDown",false);
+            easyFillDialogModel.setProperty("/isFullScreen",true);
+            easyFillDialogModel.setProperty("/hasTableUpdates",false);
+            easyFillDialogModel.setProperty("/hasTableValidationErrors",false);
+            easyFillDialogModel.setProperty("/tableValidationMessage","");
+            easyFillDialogModel.setProperty("/easyFillMode",EasyFillLayoutMode.CondensedMode);
+            mCollectionUpdates = Object.create(null);
             if (bRemoveTextAreaValue) {
                 oController.byId("EasyFillInputTextArea").setValue("");
                 easyFillDialogModel.setProperty("/isEasyFillButtonEnabled",false);
             }
+            easyFillDialogModel.setProperty("/llmData",{});
+            easyFillDialogModel.setProperty("/sections",[]);
+
         }
 
         function getUpdatableAndNonUpdatableFields(oAiCallResult) {
@@ -307,6 +524,10 @@ sap.ui.define([
 
             Object.keys(oAiCallResult).forEach((sKey)=>{
                 const oProperty = oEntityType.property.find((oProperty)=>oProperty.name === sKey);
+                if (!oProperty) {
+                    nonUpdatableFields[sKey] = oAiCallResult[sKey];
+                    return;
+                }
                     if (isEditable(oProperty)) {
                         updatableFields[sKey] = oAiCallResult[sKey];
                     } else {
@@ -337,6 +558,13 @@ sap.ui.define([
         //Since "com.sap.vocabularies.Common.v1.FieldControl" is an V4 annotation, it would be given the first priority
 
         function isEditable(oProperty) {
+            return isEditableByContextObject(oProperty, oObjectPageContext && oObjectPageContext.getObject && oObjectPageContext.getObject());
+        }
+
+        function isEditableByContextObject(oProperty, oContextObject) {
+            if (!oProperty) {
+                return false;
+            }
 
             //Check for sap:updatable
             const sUpdatable = oProperty["sap:updatable"];
@@ -357,7 +585,7 @@ sap.ui.define([
             const sFieldControl = oProperty["sap:field-control"];
 
             if (sFieldControl) {
-                const iFieldControlValue = oObjectPageContext.getObject()[sFieldControl];
+                const iFieldControlValue = oContextObject && oContextObject[sFieldControl];
                 return iFieldControlValue === 1 ? false : true;
             }
 
@@ -365,6 +593,535 @@ sap.ui.define([
             return true;
         }
 
+        function splitAIResultByCollection(oAiData, mFieldMapping) {
+            var oSplitResult = {
+                simpleFields: {},
+                collectionFields: {}
+            };
+            Object.keys(oAiData || {}).forEach(function(sFieldName) {
+                var oFieldMeta = mFieldMapping[sFieldName];
+                var vFieldValue = oAiData[sFieldName];
+                var aCollectionRows = null;
+                if (Array.isArray(vFieldValue)) {
+                    aCollectionRows = vFieldValue;
+                } else if (vFieldValue && Array.isArray(vFieldValue.rows)) {
+                    aCollectionRows = vFieldValue.rows;
+                }
+                if (oFieldMeta && oFieldMeta.isCollection === true && aCollectionRows) {
+                    var aRowUpdates = aCollectionRows.filter(function(oRow) {
+                        return oRow && typeof oRow === "object" && (typeof oRow._contextPath === "string" || typeof oRow._rowIndex === "number");
+                    });
+
+                    // For current development, we are only supporting one SmartTable
+                    //  in future if we support multiple SmartTable in the same OP, then we can change the structure of collectionFields to support multiple tables
+                    const {isValid} = isValidSmartTable(oFieldMeta.entitySet);
+                    if (aRowUpdates.length > 0 &&  Object.keys(oSplitResult.collectionFields).length === 0 && isValid) {
+                        oSplitResult.collectionFields[sFieldName] = aRowUpdates;
+                    }
+                } else {
+                    oSplitResult.simpleFields[sFieldName] = vFieldValue;
+                }
+            });
+            return oSplitResult;
+        }
+
+        function isValidSmartTable(sEntitySet) {
+            var aSmartTables = getObjectPageSmartTables();
+            const oSmartTable = aSmartTables.find(function(oSmartTable) {
+                return oSmartTable.getEntitySet() === sEntitySet;
+            });
+            return {
+                isValid: !!oSmartTable,
+                smartTable: oSmartTable
+            };
+        }
+
+        function getObjectPageSmartTables() {
+            if (!oObjectPage || !oObjectPage.findAggregatedObjects) {
+                return [];
+            }
+            //Currently we are looping all the tables in the ObjectPage, but it might contain custom smarttables
+            //In future we have to read the table data from annotations/manifest so that we dont confuse with custom smart tables
+            return oObjectPage.findAggregatedObjects(true, function(oControl) {
+                const isSmartTable = controlHelper.isSmartTable(oControl);
+                //Currently restricting it to Responsive Table and UITable, in future we have to extend it for other table types as well
+                return  isSmartTable && (oControl.getTable().isA("sap.m.Table") || oControl.getTable().isA("sap.ui.table.Table"));
+            }) || [];
+        }
+
+        function appendCollectionMapForLLM(mPropertyMap) {
+            mCollectionRowContexts = Object.create(null);
+            mCollectionRowContextsByPath = Object.create(null);
+            mCollectionProperties = Object.create(null);
+            mCollectionEntityTypes = Object.create(null);
+            var aSmartTables = getObjectPageSmartTables();
+            if (!aSmartTables.length) {
+                return;
+            }
+            var oMetaModel = oObjectPageModel && oObjectPageModel.getMetaModel();
+            aSmartTables.forEach(function(oSmartTable) {
+                var oHandler = oTemplateUtils.oServices.oPresentationControlHandlerFactory.getPresentationControlHandler(oSmartTable);
+                if (!oHandler) {
+                    return;
+                }
+                var sNavProperty = extractNavigationPropertyName(oHandler.getBindingPath());
+                if (!sNavProperty) {
+                    return;
+                }
+                var aVisibleProps = (oHandler.findVisibleColumnProperties && oHandler.findVisibleColumnProperties()) || [];
+                if (!aVisibleProps.length) {
+                    return;
+                }
+                var aRowContexts = (oHandler.getCurrentContexts && oHandler.getCurrentContexts()) || [];
+                var sEntitySetName = oSmartTable.getEntitySet();
+                var oEntitySet = oMetaModel.getODataEntitySet(oSmartTable.getEntitySet());
+                var oEntityType = oEntitySet && oMetaModel.getODataEntityType(oEntitySet.entityType);
+                if (!oEntityType || !oEntityType.property) {
+                    return;
+                }
+                var mPropertyByName = Object.create(null);
+                oEntityType.property.forEach(function(oProperty) {
+                    mPropertyByName[oProperty.name] = oProperty;
+                });
+
+                var oItemProperties = {};
+                aVisibleProps.forEach(function(sPropName) {
+                    var oProperty = mPropertyByName[sPropName];
+                    if (!oProperty) {
+                        return;
+                    }
+                    oItemProperties[sPropName] = {
+                        description: getLabel(oProperty) || sPropName,
+                        dataType: oProperty.type
+                    };
+                });
+
+                if (!Object.keys(oItemProperties).length) {
+                    return;
+                }
+
+                var aCurrentItems = [];
+                var mRowsByPath = Object.create(null);
+                aRowContexts.forEach(function(oContext, iIndex) {
+                    if (!oContext || !oContext.getObject) {
+                        return;
+                    }
+                    var sContextPath = oContext.getPath && oContext.getPath();
+                    var oRowData = {_rowIndex: iIndex};
+                    if (typeof sContextPath === "string") {
+                        oRowData._contextPath = sContextPath;
+                        mRowsByPath[sContextPath] = {
+                            context: oContext,
+                            rowIndex: iIndex
+                        };
+                    }
+                    Object.keys(oItemProperties).forEach(function(sPropName) {
+                        var vValue = oContext.getProperty(sPropName);
+                        if (typeof vValue !== "object") {
+                            oRowData[sPropName] = vValue;
+                        }
+                    });
+                    aCurrentItems.push(oRowData);
+                });
+
+                mCollectionRowContexts[sNavProperty] = aRowContexts;
+                mCollectionRowContextsByPath[sNavProperty] = mRowsByPath;
+                mCollectionProperties[sNavProperty] = mPropertyByName;
+                mCollectionEntityTypes[sNavProperty] = oEntityType;
+                mPropertyMap[sNavProperty] = {
+                    description: typeof oSmartTable.getHeader() === "string" ? oSmartTable.getHeader() : sNavProperty,
+                    dataType: "Collection",
+                    isCollection: true,
+                    itemProperties: oItemProperties,
+                    currentItems: aCurrentItems,
+                    entitySet: sEntitySetName,
+                    section: typeof oSmartTable.getHeader() === "string" ? oSmartTable.getHeader() : sNavProperty
+                };
+            });
+        }
+
+        function extractNavigationPropertyName(sBindingPath) {
+            if (!sBindingPath || typeof sBindingPath !== "string") {
+                return null;
+            }
+            var aParts = sBindingPath.split("/").filter(Boolean);
+            return aParts.length ? aParts[aParts.length - 1] : null;
+        }
+
+        function resolveCollectionRowContext(sCollectionName, oRowUpdate) {
+            var mByPath = mCollectionRowContextsByPath[sCollectionName] || Object.create(null);
+            var sContextPath = oRowUpdate && oRowUpdate._contextPath;
+            if (typeof sContextPath === "string" && mByPath[sContextPath]) {
+                return mByPath[sContextPath];
+            }
+            var iRowIndex = oRowUpdate && oRowUpdate._rowIndex;
+            var aRowContexts = mCollectionRowContexts[sCollectionName] || [];
+            if (typeof iRowIndex === "number" && aRowContexts[iRowIndex]) {
+                return {
+                    context: aRowContexts[iRowIndex],
+                    rowIndex: iRowIndex
+                };
+            }
+            return null;
+        }
+
+        function readValueListByEquality(sCollectionPath, sValueListProperty, vValue) {
+            return new Promise(function(resolve) {
+                oObjectPageModel.read("/" + sCollectionPath, {
+                    filters: [
+                        new Filter({
+                            path: sValueListProperty,
+                            operator: FilterOperator.EQ,
+                            value1: vValue
+                        })
+                    ],
+                    success: function(oResponse) {
+                        resolve(!!(oResponse && Array.isArray(oResponse.results) && oResponse.results.length > 0));
+                    },
+                    error: function() {
+                        resolve(true);
+                    }
+                });
+            });
+        }
+
+        async function validateCollectionUpdatesAgainstValueHelp(mFieldMapping) {
+            const oMetaModel = oObjectPageModel && oObjectPageModel.getMetaModel();
+            if (!oMetaModel) {
+                return [];
+            }
+            const aValidationErrors = [];
+            const aCollectionNames = Object.keys(mCollectionUpdates || {});
+            for (const sCollectionName of aCollectionNames) {
+                const aRowUpdates = mCollectionUpdates[sCollectionName] || [];
+                const mCollectionPropertyMap = mCollectionProperties[sCollectionName] || Object.create(null);
+                const oCollectionEntityType = mCollectionEntityTypes[sCollectionName];
+                const sCollectionLabel = (mFieldMapping[sCollectionName] && mFieldMapping[sCollectionName].description) || sCollectionName;
+                if (!oCollectionEntityType) {
+                    continue;
+                }
+                for (const oRowUpdate of aRowUpdates) {
+                    const oResolvedRow = resolveCollectionRowContext(sCollectionName, oRowUpdate);
+                    if (!oResolvedRow || !oResolvedRow.context) {
+                        continue;
+                    }
+                    const oRowContext = oResolvedRow.context;
+                    const oRowObject = oRowContext.getObject && oRowContext.getObject();
+                    const sRowLabel = oRb.getText("EASY_FILL_TABLE_ROW_LABEL", [String((oResolvedRow.rowIndex || 0) + 1)]);
+                    for (const sPropertyName of Object.keys(oRowUpdate)) {
+                        if (sPropertyName === "_rowIndex" || sPropertyName === "_contextPath") {
+                            continue;
+                        }
+                        const oPropertyMeta = mCollectionPropertyMap[sPropertyName];
+                        if (!oPropertyMeta || !isEditableByContextObject(oPropertyMeta, oRowObject)) {
+                            continue;
+                        }
+                        if (!GenericAnnotationHelper.isValueHelpTableAvailable(oPropertyMeta)) {
+                            continue;
+                        }
+                        const vUpdatedValue = oRowUpdate[sPropertyName];
+                        if (vUpdatedValue === null || vUpdatedValue === undefined || typeof vUpdatedValue === "object") {
+                            continue;
+                        }
+                        try {
+                            const sPropertyPath = oMetaModel.getODataProperty(oCollectionEntityType, sPropertyName, true);
+                            if (!sPropertyPath) {
+                                continue;
+                            }
+                            const oPropertyContext = oMetaModel.createBindingContext(sPropertyPath);
+                            const oValueLists = await oMetaModel.getODataValueLists(oPropertyContext);
+                            const oDefaultValueList = oValueLists && oValueLists[""];
+                            if (!oDefaultValueList || !oDefaultValueList.CollectionPath || !oDefaultValueList.CollectionPath.String) {
+                                continue;
+                            }
+                            let sValueListProperty = sPropertyName;
+                            if (Array.isArray(oDefaultValueList.Parameters)) {
+                                const oParameter = oDefaultValueList.Parameters.find(function(oParam) {
+                                    return (
+                                        oParam.RecordType === "com.sap.vocabularies.Common.v1.ValueListParameterInOut" &&
+                                        oParam.LocalDataProperty &&
+                                        oParam.LocalDataProperty.PropertyPath === sPropertyName
+                                    );
+                                });
+                                if (oParameter && oParameter.ValueListProperty && oParameter.ValueListProperty.String) {
+                                    sValueListProperty = oParameter.ValueListProperty.String;
+                                }
+                            }
+                            const bValueFound = await readValueListByEquality(
+                                oDefaultValueList.CollectionPath.String,
+                                sValueListProperty,
+                                vUpdatedValue
+                            );
+                            if (!bValueFound) {
+                                aValidationErrors.push({
+                                    collectionName: sCollectionName,
+                                    collectionLabel: sCollectionLabel,
+                                    rowLabel: sRowLabel,
+                                    rowIndex: oResolvedRow.rowIndex,
+                                    rowPath: oRowContext.getPath && oRowContext.getPath(),
+                                    propertyName: sPropertyName,
+                                    propertyLabel: getLabel(oPropertyMeta) || sPropertyName
+                                });
+                            }
+                        } catch (e) {
+                            // If metadata/value list cannot be resolved, we keep current behavior and do not block save.
+                        }
+                    }
+                }
+            }
+            return aValidationErrors;
+        }
+
+        function stringifyCellValue(vValue) {
+            if (vValue === null || vValue === undefined) {
+                return "";
+            }
+            if (vValue instanceof Date) {
+                return vValue.toISOString();
+            }
+            return String(vValue);
+        }
+
+        function createPreviewTable(aPropertyNames, oItemProperties, aRows, fnCellFormatter) {
+            var aColumns = aPropertyNames.map(function(sPropertyName) {
+                return new Column({
+                    header: new Text({ text: (oItemProperties[sPropertyName] && oItemProperties[sPropertyName].description) || sPropertyName })
+                });
+            });
+
+            var aItems = aRows.map(function(oRow) {
+                return new ColumnListItem({
+                    cells: aPropertyNames.map(function(sPropertyName) {
+                        var sText = fnCellFormatter
+                            ? fnCellFormatter(oRow, sPropertyName, stringifyCellValue(oRow[sPropertyName]))
+                            : stringifyCellValue(oRow[sPropertyName]);
+                        return new Text({ text: sText });
+                    })
+                });
+            });
+
+            return new Table({
+                columns: aColumns,
+                items: aItems,
+                fixedLayout: false,
+                autoPopinMode: true
+            }).addStyleClass("sapSmartTemplatesObjectPageEasyFillTablePreview");
+        }
+
+        function stageCollectionUpdatesForPreview() {
+            mStagedRowValues = Object.create(null);
+            Object.keys(mCollectionUpdates).forEach(function(sCollectionName) {
+                var mCollectionPropertyMap = mCollectionProperties[sCollectionName] || Object.create(null);
+                var aRowUpdates = mCollectionUpdates[sCollectionName] || [];
+                aRowUpdates.forEach(function(oRowUpdate) {
+                    var oResolved = resolveCollectionRowContext(sCollectionName, oRowUpdate);
+                    if (!oResolved || !oResolved.context) { return; }
+                    var oContext = oResolved.context;
+                    var sPath = oContext.getPath && oContext.getPath();
+                    if (!sPath) { return; }
+                    if (!mStagedRowValues[sPath]) {
+                        mStagedRowValues[sPath] = { context: oContext, originalValues: {} };
+                    }
+                    var oRowObject = oContext.getObject && oContext.getObject();
+                    Object.keys(oRowUpdate).forEach(function(sPropName) {
+                        if (sPropName === "_rowIndex" || sPropName === "_contextPath") { return; }
+                        var oPropertyMeta = mCollectionPropertyMap[sPropName];
+                        if (!isEditableByContextObject(oPropertyMeta, oRowObject)) { return; }
+                        if (!Object.prototype.hasOwnProperty.call(mStagedRowValues[sPath].originalValues, sPropName)) {
+                            mStagedRowValues[sPath].originalValues[sPropName] = oContext.getProperty(sPropName);
+                        }
+                        oContext.setProperty(sPropName, oRowUpdate[sPropName]);
+                    });
+                });
+            });
+        }
+
+        function revertStagedCollectionUpdates() {
+            Object.keys(mStagedRowValues).forEach(function(sPath) {
+                var oEntry = mStagedRowValues[sPath];
+                var oContext = oEntry.context;
+                Object.keys(oEntry.originalValues).forEach(function(sPropName) {
+                    oContext.setProperty(sPropName, oEntry.originalValues[sPropName]);
+                });
+            });
+            mStagedRowValues = Object.create(null);
+        }
+
+        function buildCollectionPreviewRow(aPropertyNames, oResolvedRow, oRowUpdate, bUseUpdatedValues) {
+            var oPreviewRow = {};
+            var oContext = oResolvedRow && oResolvedRow.context;
+            var sPath = oContext && oContext.getPath && oContext.getPath();
+            var oStagedEntry = sPath && mStagedRowValues[sPath];
+            aPropertyNames.forEach(function(sPropertyName) {
+                if (bUseUpdatedValues && oRowUpdate && Object.prototype.hasOwnProperty.call(oRowUpdate, sPropertyName)) {
+                    oPreviewRow[sPropertyName] = oRowUpdate[sPropertyName];
+                    return;
+                }
+                if (!bUseUpdatedValues && oStagedEntry && Object.prototype.hasOwnProperty.call(oStagedEntry.originalValues, sPropertyName)) {
+                    oPreviewRow[sPropertyName] = oStagedEntry.originalValues[sPropertyName];
+                    return;
+                }
+                oPreviewRow[sPropertyName] = oContext ? oContext.getProperty(sPropertyName) : "";
+            });
+            return oPreviewRow;
+        }
+
+        function getCollectionRowIdentity(oResolvedRow, oRowUpdate, iFallbackIndex) {
+            if (oResolvedRow && oResolvedRow.context && oResolvedRow.context.getPath) {
+                return oResolvedRow.context.getPath();
+            }
+            if (oRowUpdate && typeof oRowUpdate._contextPath === "string") {
+                return oRowUpdate._contextPath;
+            }
+            if (oRowUpdate && typeof oRowUpdate._rowIndex === "number") {
+                return "index:" + String(oRowUpdate._rowIndex);
+            }
+            return "row:" + String(iFallbackIndex);
+        }
+
+        function createEditableNewTable(aPropertyNames, oItemProperties, aPreviewRows, sCollectionName) {
+            var aColumns = aPropertyNames.map(function(sPropName) {
+                return new Column({
+                    header: new Text({ text: (oItemProperties[sPropName] && oItemProperties[sPropName].description) || sPropName })
+                });
+            });
+            var mCollectionPropertyMap = mCollectionProperties[sCollectionName] || Object.create(null);
+            var aItems = aPreviewRows.map(function(oPreviewRow) {
+                var oContext = oPreviewRow.context;
+                var oRowObject = oContext && oContext.getObject && oContext.getObject();
+                var aCells = aPropertyNames.map(function(sPropName) {
+                    if (!oContext) {
+                        return new Text({ text: stringifyCellValue(oPreviewRow.newValues[sPropName]) });
+                    }
+                    var oPropertyMeta = mCollectionPropertyMap[sPropName];
+                    var bEditable = isEditableByContextObject(oPropertyMeta, oRowObject);
+                    var oSmartField = new SmartField({
+                        value: "{" + sPropName + "}",
+                        editable: bEditable,
+                        enabled: bEditable,
+                        contextEditable: bEditable,
+                        // change: onSmartFieldChange.bind(this),
+                        editableChanged: function(oEvent) {
+                            // Keep table SmartField editability deterministic in preview mode.
+                            if (oEvent.getParameter("editable") !== bEditable) {
+                                oEvent.getSource().setEditable(bEditable);
+                            }
+                        }
+                    });
+
+                    if (bEditable) {
+                        aEditableFields.push(oSmartField);
+                    }
+                    return oSmartField;
+                });
+                var oItem = new ColumnListItem({ cells: aCells });
+                if (oContext) {
+                    oItem.setBindingContext(oContext);
+                }
+                return oItem;
+            });
+            return new Table({
+                columns: aColumns,
+                items: aItems,
+                fixedLayout: false,
+                autoPopinMode: true
+            }).addStyleClass("sapSmartTemplatesObjectPageEasyFillTablePreview");
+        }
+
+        function renderCollectionPreviews(mFieldMapping, aTableValidationErrors) {
+            var oTablePreviewContainer = oController.byId("EasyFillTablePreviewContainer");
+            if (!oTablePreviewContainer) {
+                return;
+            }
+            oTablePreviewContainer.destroyItems();
+            // Stage LLM values onto OData row contexts; saves originals for revert on cancel
+            stageCollectionUpdatesForPreview();
+            var mInvalidCellByPath = Object.create(null);
+            (aTableValidationErrors || []).forEach(function(oError) {
+                if (!oError || !oError.rowPath) {
+                    return;
+                }
+                mInvalidCellByPath[oError.rowPath + "|" + oError.propertyName] = true;
+            });
+
+            Object.keys(mCollectionUpdates).forEach(function(sCollectionName) {
+                var oCollectionMeta = mFieldMapping[sCollectionName];
+                if (!oCollectionMeta || !oCollectionMeta.itemProperties) {
+                    return;
+                }
+                var aRowUpdates = mCollectionUpdates[sCollectionName] || [];
+                var aPropertyNames = Object.keys(oCollectionMeta.itemProperties || {});
+                if (!aPropertyNames.length) {
+                    return;
+                }
+                var mUpdatesByIdentity = Object.create(null);
+                aRowUpdates.forEach(function(oRowUpdate, iUpdateIndex) {
+                    var oResolvedUpdate = resolveCollectionRowContext(sCollectionName, oRowUpdate);
+                    mUpdatesByIdentity[getCollectionRowIdentity(oResolvedUpdate, oRowUpdate, iUpdateIndex)] = oRowUpdate;
+                });
+                var aPreviewRows = [];
+                var aCollectionRowContexts = mCollectionRowContexts[sCollectionName] || [];
+                aCollectionRowContexts.forEach(function(oContext, iRowIndex) {
+                    var oResolved = {
+                        context: oContext,
+                        rowIndex: iRowIndex
+                    };
+                    var sIdentity = getCollectionRowIdentity(oResolved, null, iRowIndex);
+                    var oRowUpdate = mUpdatesByIdentity[sIdentity];
+                    aPreviewRows.push({
+                        context: oContext,
+                        rowIndex: iRowIndex,
+                        update: oRowUpdate,
+                        previousValues: buildCollectionPreviewRow(aPropertyNames, oResolved, oRowUpdate, false),
+                        newValues: buildCollectionPreviewRow(aPropertyNames, oResolved, oRowUpdate, true)
+                    });
+                });
+                aPreviewRows = aPreviewRows.slice(0, MAX_TABLE_PREVIEW_ROWS);
+
+                var aPreviousRows = aPreviewRows.map(function(oPreviewRow) {
+                    return oPreviewRow.previousValues;
+                });
+
+                if (!aPreviewRows.length) {
+                    return;
+                }
+
+                var oPreviousTable = createPreviewTable(aPropertyNames, oCollectionMeta.itemProperties, aPreviousRows);
+                var oNewTable = createEditableNewTable(aPropertyNames, oCollectionMeta.itemProperties, aPreviewRows, sCollectionName);
+                oPreviousTable.setVisible(false);
+
+                var oSectionTitle = new Title({
+                    level: "H5",
+                    text: (oCollectionMeta.description || sCollectionName) + " (" + aPreviewRows.length + ")"
+                });
+
+                var oSegmentedButton = new SegmentedButton({
+                    selectedKey: "new",
+                    width:"auto",
+                    items: [
+                        new SegmentedButtonItem({ key: "previous", text: oRb.getText("EASY_FILL_TABLE_VIEW_PREVIOUS"), width:"auto" }),
+                        new SegmentedButtonItem({ key: "new", text: oRb.getText("EASY_FILL_TABLE_VIEW_NEW"), width:"auto" })
+                    ],
+                    selectionChange: function() {
+                        var sKey = oSegmentedButton.getSelectedKey();
+                        oPreviousTable.setVisible(sKey === "previous");
+                        oNewTable.setVisible(sKey === "new");
+                    }
+                });
+
+                var oHeader = new HBox({
+                    justifyContent: "SpaceBetween",
+                    items: [oSectionTitle, oSegmentedButton]
+                }).addStyleClass("sapUiSmallMarginTop");
+
+                var oSection = new VBox({
+                    items: [oHeader, oPreviousTable, oNewTable]
+                }).addStyleClass("sapSmartTemplatesObjectPageEasyFillTableSection");
+
+                oTablePreviewContainer.addItem(oSection);
+            });
+        }
+
         function isVisible(oProperty) {
 
             //Check for "com.sap.vocabularies.Common.v1.FieldControl"
@@ -416,45 +1173,11 @@ sap.ui.define([
             });
         }
 
-         function onSmartFieldChange() {
-            validateSmartForm();
-        }
-
-        function getGroupForSmartForm(oDataFromLLM, isEditable,oContext,isTransient) {
-            var oGroup = new Group({
-                title: (isTransient) ? oRb.getText("EASY_FILL_PROPOSED_VALUES") : oRb.getText("EASY_FILL_PREVIOUS_VALUES")
-            });
+        //Yet to implement, temporarily disabled
+        //  function onSmartFieldChange() {
+        //     validateSmartForm();
+        // }
 
-            for (const key of Object.keys(oDataFromLLM)) {
-                const oGroupElement = new GroupElement();
-                const oSmartField = new SmartField({
-                    value: "{" + key + "}",
-                    editable: isEditable,
-                    enabled: isEditable,
-                    contextEditable: isEditable,
-                    change: onSmartFieldChange.bind(this),
-                    editableChanged: (oEvent)=>{
-                        //SmartField changes the editable state of inner controls based on various factors, so to make sure that the editable state remains as per our requirement we are forcing it here
-                        if (oEvent.getParameter("editable") !== isEditable) {
-                            oEvent.getSource().setEditable(isEditable);
-                        }
-                    }
-                });
-                if (isEditable) {
-                    aEditableFields.push(oSmartField);
-                }
-                const oSmartLabel = new SmartLabel();
-                oSmartLabel.setLabelFor(oSmartField);
-                oGroupElement.addElement(oSmartField);
-                //Update the field only if its transient
-                if (isTransient) {
-                    oContext.setProperty(key,oDataFromLLM[key]);
-                }
-                oGroup.addGroupElement(oGroupElement);
-            }
-            oGroup.setBindingContext(oContext);
-            return oGroup;
-        }
 
         return {
             onEasyFillButtonClick: function(oEvent) {