From 61bee669d17614e1ea57ea5d5bff5651f982c664 Mon Sep 17 00:00:00 2001
From: Davis <davis.voicescuks@sap.com>
Date: Fri, 20 Sep 2024 10:29:19 +0300
Subject: [PATCH] fix: quick action improvements

---
 .../control-property-editor-common/src/api.ts |  6 +-
 packages/control-property-editor/src/slice.ts | 12 ++--
 .../src/toolbar/UndoRedoSaveActions.tsx       |  6 +-
 .../test/unit/slice.test.ts                   | 12 ++--
 .../unit/toolbar/UndoRedoSaveActions.test.tsx |  4 +-
 .../adp/controllers/AddFragment.controller.ts | 26 +++++--
 .../src/adp/extension-point.ts                |  7 +-
 .../src/adp/init-dialogs.ts                   | 18 ++---
 .../preview-middleware-client/src/adp/init.ts | 38 ++--------
 .../common/op-add-custom-section.ts           |  5 +-
 .../common/op-add-header-field.ts             | 10 ++-
 .../src/adp/ui/AddFragment.fragment.xml       | 13 ++--
 .../src/cpe/changes/service.ts                |  8 +--
 .../src/cpe/communication-service.ts          | 41 +++++++++++
 .../src/cpe/connector-service.ts              | 15 +++-
 .../preview-middleware-client/src/cpe/init.ts | 28 ++------
 .../src/flp/WorkspaceConnector.ts             |  2 +-
 .../src/flp/enableFakeConnector.ts            |  2 +-
 .../preview-middleware-client/src/i18n.ts     | 15 ++++
 .../src/messagebundle.properties              |  5 ++
 .../sap/ui/model/resource/ResourceModel.ts    |  5 ++
 .../AddFragment.controller.test.ts            | 70 +++++++++++++++----
 .../test/unit/adp/init.test.ts                | 39 ++++-------
 .../test/unit/adp/quick-actions/fe-v2.test.ts | 10 ++-
 .../test/unit/adp/quick-actions/fe-v4.test.ts |  5 +-
 .../test/unit/cpe/changes/service.test.ts     |  4 +-
 .../test/unit/cpe/connector-service.test.ts   | 39 +++++++++++
 .../test/unit/cpe/init.test.ts                | 13 ++--
 .../test/unit/flp/WorkspaceConnector.test.ts  |  2 +-
 .../types/sap.ui.fl.d.ts                      |  2 +-
 .../types/sap.ui.rta.d.ts                     |  2 +-
 31 files changed, 303 insertions(+), 161 deletions(-)
 create mode 100644 packages/preview-middleware-client/src/cpe/communication-service.ts
 create mode 100644 packages/preview-middleware-client/test/__mock__/sap/ui/model/resource/ResourceModel.ts

diff --git a/packages/control-property-editor-common/src/api.ts b/packages/control-property-editor-common/src/api.ts
index 7ab7b20c7d..bbcdd61701 100644
--- a/packages/control-property-editor-common/src/api.ts
+++ b/packages/control-property-editor-common/src/api.ts
@@ -299,9 +299,7 @@ export const save = createExternalAction<void>('save');
 export const quickActionListChanged = createExternalAction<QuickActionGroup[]>('quick-action-list-changed');
 export const updateQuickAction = createExternalAction<QuickAction>('update-quick-action');
 export const executeQuickAction = createExternalAction<QuickActionExecutionPayload>('execute-quick-action');
-export const numberOfChangesRequiringReloadChanged = createExternalAction<number>(
-    'number-of-changes-requiring-reload-changed'
-);
+export const setApplicationRequiresReload = createExternalAction<boolean>('set-application-requires-reload');
 
 export type ExternalAction =
     | ReturnType<typeof iconsLoaded>
@@ -325,6 +323,6 @@ export type ExternalAction =
     | ReturnType<typeof save>
     | ReturnType<typeof appLoaded>
     | ReturnType<typeof quickActionListChanged>
-    | ReturnType<typeof numberOfChangesRequiringReloadChanged>
+    | ReturnType<typeof setApplicationRequiresReload>
     | ReturnType<typeof updateQuickAction>
     | ReturnType<typeof executeQuickAction>;
diff --git a/packages/control-property-editor/src/slice.ts b/packages/control-property-editor/src/slice.ts
index 30eb64577d..9d0c828edc 100644
--- a/packages/control-property-editor/src/slice.ts
+++ b/packages/control-property-editor/src/slice.ts
@@ -15,7 +15,7 @@ import type {
     ShowMessage
 } from '@sap-ux-private/control-property-editor-common';
 import {
-    numberOfChangesRequiringReloadChanged,
+    setApplicationRequiresReload,
     changeStackModified,
     controlSelected,
     iconsLoaded,
@@ -61,7 +61,7 @@ interface SliceState {
         canRedo: boolean;
     };
     canSave: boolean;
-    pendingChangesRequiresSaveAndReload: boolean;
+    applicationRequiresReload: boolean;
     isAppLoading: boolean;
     quickActions: QuickActionGroup[];
 }
@@ -149,7 +149,7 @@ export const initialState: SliceState = {
         canRedo: false
     },
     canSave: false,
-    pendingChangesRequiresSaveAndReload: false,
+    applicationRequiresReload: false,
     isAppLoading: true,
     quickActions: []
 };
@@ -324,9 +324,9 @@ const slice = createSlice<SliceState, SliceCaseReducers<SliceState>, string>({
                 state.isAppLoading = false;
             })
             .addMatcher(
-                numberOfChangesRequiringReloadChanged.match,
-                (state, action: ReturnType<typeof numberOfChangesRequiringReloadChanged>): void => {
-                    state.pendingChangesRequiresSaveAndReload = action.payload > 0;
+                setApplicationRequiresReload.match,
+                (state, action: ReturnType<typeof setApplicationRequiresReload>): void => {
+                    state.applicationRequiresReload = action.payload;
                 }
             )
             .addMatcher(
diff --git a/packages/control-property-editor/src/toolbar/UndoRedoSaveActions.tsx b/packages/control-property-editor/src/toolbar/UndoRedoSaveActions.tsx
index ab92b6e21d..b07d65cfcc 100644
--- a/packages/control-property-editor/src/toolbar/UndoRedoSaveActions.tsx
+++ b/packages/control-property-editor/src/toolbar/UndoRedoSaveActions.tsx
@@ -23,11 +23,9 @@ export function UndoRedoSaveActions(): ReactElement {
     const canSave = useSelector<RootState, boolean>((state) => state.canSave);
     const isLoading = useSelector<RootState, boolean>((state) => state.isAppLoading);
     const fileChanges = useSelector<RootState, string[] | undefined>((state) => state.fileChanges) ?? [];
-    const pendingChangesRequiresSaveAndReload = useSelector<RootState, boolean>(
-        (state) => state.pendingChangesRequiresSaveAndReload
-    );
+    const applicationRequiresReload = useSelector<RootState, boolean>((state) => state.applicationRequiresReload);
     const { pending } = useSelector<RootState, ChangesSlice>((state) => state.changes);
-    const saveAndReload = (fileChanges.length > 0 && pending.length > 0) || pendingChangesRequiresSaveAndReload;
+    const saveAndReload = (fileChanges.length > 0 && pending.length > 0) || applicationRequiresReload;
     return (
         <>
             <UIIconButton
diff --git a/packages/control-property-editor/test/unit/slice.test.ts b/packages/control-property-editor/test/unit/slice.test.ts
index e9eacc9bbd..128a5cf946 100644
--- a/packages/control-property-editor/test/unit/slice.test.ts
+++ b/packages/control-property-editor/test/unit/slice.test.ts
@@ -1,7 +1,7 @@
 import {
     changeStackModified,
     iconsLoaded,
-    numberOfChangesRequiringReloadChanged,
+    setApplicationRequiresReload,
     propertyChanged,
     propertyChangeFailed,
     quickActionListChanged,
@@ -297,19 +297,19 @@ describe('main redux slice', () => {
             deviceType: DeviceType.Desktop
         });
     });
-    describe('numberOfChangesRequiringReloadChanged', () => {
+    describe('setApplicationRequiresReload', () => {
         test('one change requires reload', () => {
             expect(
-                reducer({ pendingChangesRequiresSaveAndReload: false } as any, numberOfChangesRequiringReloadChanged(1))
+                reducer({ applicationRequiresReload: false } as any, setApplicationRequiresReload(true))
             ).toStrictEqual({
-                pendingChangesRequiresSaveAndReload: true
+                applicationRequiresReload: true
             });
         });
         test('no changes require reload', () => {
             expect(
-                reducer({ pendingChangesRequiresSaveAndReload: true } as any, numberOfChangesRequiringReloadChanged(0))
+                reducer({ setApplicationRequiresReload: true } as any, setApplicationRequiresReload(false))
             ).toStrictEqual({
-                pendingChangesRequiresSaveAndReload: false
+                applicationRequiresReload: false
             });
         });
     });
diff --git a/packages/control-property-editor/test/unit/toolbar/UndoRedoSaveActions.test.tsx b/packages/control-property-editor/test/unit/toolbar/UndoRedoSaveActions.test.tsx
index 6b90b1b52d..fe2bc12df9 100644
--- a/packages/control-property-editor/test/unit/toolbar/UndoRedoSaveActions.test.tsx
+++ b/packages/control-property-editor/test/unit/toolbar/UndoRedoSaveActions.test.tsx
@@ -11,7 +11,7 @@ import {
     redo,
     save,
     undo,
-    numberOfChangesRequiringReloadChanged,
+    setApplicationRequiresReload,
     reloadApplication
 } from '@sap-ux-private/control-property-editor-common';
 
@@ -54,7 +54,7 @@ describe('toolbar', () => {
         // update state
         store.dispatch(setUndoRedoEnablement({ canRedo: true, canUndo: true }));
         store.dispatch(setSaveEnablement(true));
-        store.dispatch(numberOfChangesRequiringReloadChanged(5));
+        store.dispatch(setApplicationRequiresReload(true));
         store.dispatch(appLoaded());
 
         dispatch.mockClear();
diff --git a/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts b/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts
index 941c5c080e..4f1885534b 100644
--- a/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts
+++ b/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts
@@ -21,7 +21,12 @@ import OverlayRegistry from 'sap/ui/dt/OverlayRegistry';
 import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
 
 /** sap.ui.fl */
-import {type AddFragmentChangeContentType} from 'sap/ui/fl/Change';
+import { type AddFragmentChangeContentType } from 'sap/ui/fl/Change';
+
+import { setApplicationRequiresReload } from '@sap-ux-private/control-property-editor-common';
+
+import { getResourceModel } from '../../i18n';
+import { CommunicationService } from '../../cpe/communication-service';
 
 import ControlUtils from '../control-utils';
 import CommandExecutor from '../command-executor';
@@ -38,20 +43,30 @@ interface CreateFragmentProps {
 const radix = 10;
 
 type AddFragmentModel = JSONModel & {
+    getProperty(sPath: '/title'): string;
+    getProperty(sPath: '/completeView'): boolean;
     getProperty(sPath: '/newFragmentName'): string;
     getProperty(sPath: '/selectedIndex'): number;
     getProperty(sPath: '/selectedAggregation/value'): string;
 };
 
+export interface AddFragmentOptions {
+    title: string;
+    aggregation?: string;
+}
+
 /**
  * @namespace open.ux.preview.client.adp.controllers
  */
 export default class AddFragment extends BaseDialog<AddFragmentModel> {
-    constructor(name: string, overlays: UI5Element, rta: RuntimeAuthoring, private aggregation?: string) {
+    constructor(name: string, overlays: UI5Element, rta: RuntimeAuthoring, private options: AddFragmentOptions) {
         super(name);
         this.rta = rta;
         this.overlays = overlays;
-        this.model = new JSONModel();
+        this.model = new JSONModel({
+            title: options.title,
+            completeView: options.aggregation === undefined
+        });
         this.ui5Version = sap.ui.version;
         this.commandExecutor = new CommandExecutor(this.rta);
     }
@@ -67,7 +82,9 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
         this.setEscapeHandler();
 
         await this.buildDialogData();
+        const resourceModel = await getResourceModel('open.ux.preview.client');
 
+        this.dialog.setModel(resourceModel, 'i18n');
         this.dialog.setModel(this.model);
 
         this.dialog.open();
@@ -184,7 +201,7 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
             }
             return false;
         });
-        const defaultAggregation = this.aggregation ?? controlMetadata.getDefaultAggregationName();
+        const defaultAggregation = this.options.aggregation ?? controlMetadata.getDefaultAggregationName();
         const selectedControlName = controlMetadata.getName();
 
         let selectedControlChildren: string[] | number[] = Object.keys(
@@ -290,6 +307,7 @@ export default class AddFragment extends BaseDialog<AddFragmentModel> {
             const preparedChange = command.getPreparedChange();
             const content = preparedChange.getContent();
             preparedChange.setContent({ ...content, templateName });
+            CommunicationService.sendAction(setApplicationRequiresReload(true));
         }
         await this.commandExecutor.pushAndExecuteCommand(command);
     }
diff --git a/packages/preview-middleware-client/src/adp/extension-point.ts b/packages/preview-middleware-client/src/adp/extension-point.ts
index 4d216f11c1..8a45a91d7f 100644
--- a/packages/preview-middleware-client/src/adp/extension-point.ts
+++ b/packages/preview-middleware-client/src/adp/extension-point.ts
@@ -8,7 +8,7 @@ import { ExternalAction, addExtensionPoint } from '@sap-ux-private/control-prope
 
 import { Deferred, createDeferred } from './utils';
 
-import { SubscribeFunction } from '../cpe/types';
+import { CommunicationService } from '../cpe/communication-service';
 import { DialogNames, handler } from './init-dialogs';
 
 type ActionService = {
@@ -50,11 +50,10 @@ export default class ExtensionPointService {
     /**
      * Initializes communication with CPE, and the extension point plugin.
      *
-     * @param subscribe Handles actions from CPE
      */
-    public init(subscribe: SubscribeFunction) {
+    public init() {
         this.initPlugin();
-        subscribe(async (action: ExternalAction): Promise<void> => {
+        CommunicationService.subscribe(async (action: ExternalAction): Promise<void> => {
             if (addExtensionPoint.match(action)) {
                 try {
                     const { controlId, name } = action.payload;
diff --git a/packages/preview-middleware-client/src/adp/init-dialogs.ts b/packages/preview-middleware-client/src/adp/init-dialogs.ts
index a1ff345ed8..8b649c27df 100644
--- a/packages/preview-middleware-client/src/adp/init-dialogs.ts
+++ b/packages/preview-middleware-client/src/adp/init-dialogs.ts
@@ -14,13 +14,14 @@ import FlUtils from 'sap/ui/fl/Utils';
 /** sap.ui.dt */
 import type ElementOverlay from 'sap/ui/dt/ElementOverlay';
 
-import AddFragment from './controllers/AddFragment.controller';
+import AddFragment, { AddFragmentOptions } from './controllers/AddFragment.controller';
 import ControllerExtension from './controllers/ControllerExtension.controller';
 import { ExtensionPointData } from './extension-point';
 import ExtensionPoint from './controllers/ExtensionPoint.controller';
 import ManagedObject from 'sap/ui/base/ManagedObject';
 import { isReuseComponent } from '../cpe/utils';
 import { Ui5VersionInfo } from '../utils/version';
+import { getTextBundle } from '../i18n';
 
 export const enum DialogNames {
     ADD_FRAGMENT = 'AddFragment',
@@ -118,25 +119,24 @@ export const getAddFragmentItemText = (overlay: ElementOverlay) => {
  * @param rta Runtime Authoring
  * @param dialogName Dialog name
  * @param extensionPointData Control ID
- * @param aggregation Name of aggregation that should be selected when dialog is opened
+ * @param options Dialog options
  */
 export async function handler(
     overlay: UI5Element,
     rta: RuntimeAuthoring,
     dialogName: DialogNames,
     extensionPointData?: ExtensionPointData,
-    aggregation?: string
+    options: Partial<AddFragmentOptions> = {}
 ): Promise<void> {
     let controller: Controller;
+    const resources = await getTextBundle();
 
     switch (dialogName) {
         case DialogNames.ADD_FRAGMENT:
-            controller = new AddFragment(
-                `open.ux.preview.client.adp.controllers.${dialogName}`,
-                overlay,
-                rta,
-                aggregation
-            );
+            controller = new AddFragment(`open.ux.preview.client.adp.controllers.${dialogName}`, overlay, rta, {
+                aggregation: options.aggregation,
+                title: resources.getText(options.title ?? 'ADP_ADD_FRAGMENT_DIALOG_TITLE')
+            });
             break;
         case DialogNames.CONTROLLER_EXTENSION:
             controller = new ControllerExtension(`open.ux.preview.client.adp.controllers.${dialogName}`, overlay, rta);
diff --git a/packages/preview-middleware-client/src/adp/init.ts b/packages/preview-middleware-client/src/adp/init.ts
index 722119ed9a..2a3478de00 100644
--- a/packages/preview-middleware-client/src/adp/init.ts
+++ b/packages/preview-middleware-client/src/adp/init.ts
@@ -1,17 +1,11 @@
 import log from 'sap/base/Log';
 import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
-import {
-    ExternalAction,
-    showMessage,
-    startPostMessageCommunication,
-    enableTelemetry
-} from '@sap-ux-private/control-property-editor-common';
+import { showMessage, enableTelemetry } from '@sap-ux-private/control-property-editor-common';
 
-import { ActionHandler } from '../cpe/types';
-import { getError } from '../utils/error';
 import { getUi5Version, getUI5VersionValidationMessage, isLowerThanMinimalUi5Version } from '../utils/version';
 
+import { CommunicationService } from '../cpe/communication-service';
 import init from '../cpe/init';
 import { getApplicationType } from '../utils/application';
 import { getTextBundle } from '../i18n';
@@ -25,27 +19,7 @@ export default async function (rta: RuntimeAuthoring) {
     if (flexSettings.telemetry === true) {
         enableTelemetry();
     }
-    const actionHandlers: ActionHandler[] = [];
-    /**
-     *
-     * @param handler action handler
-     */
-    function subscribe(handler: ActionHandler): void {
-        actionHandlers.push(handler);
-    }
 
-    const { sendAction } = startPostMessageCommunication<ExternalAction>(
-        window.parent,
-        async function onAction(action: ExternalAction) {
-            for (const handler of actionHandlers) {
-                try {
-                    await handler(action);
-                } catch (error) {
-                    log.error('Handler Failed: ', getError(error));
-                }
-            }
-        }
-    );
 
     const ui5VersionInfo = await getUi5Version();
     const syncViewsIds = await getAllSyncViewsIds(ui5VersionInfo);
@@ -54,7 +28,7 @@ export default async function (rta: RuntimeAuthoring) {
     if (!isLowerThanMinimalUi5Version(ui5VersionInfo, { major: 1, minor: 78 })) {
         const ExtensionPointService = (await import('open/ux/preview/client/adp/extension-point')).default;
         const extPointService = new ExtensionPointService(rta);
-        extPointService.init(subscribe);
+        extPointService.init();
     }
 
     const applicationType = getApplicationType(rta.getRootControlInstance().getManifest());
@@ -63,13 +37,15 @@ export default async function (rta: RuntimeAuthoring) {
     await init(rta, quickActionRegistries);
 
     if (isLowerThanMinimalUi5Version(ui5VersionInfo)) {
-        sendAction(showMessage({ message: getUI5VersionValidationMessage(ui5VersionInfo), shouldHideIframe: true }));
+        CommunicationService.sendAction(
+            showMessage({ message: getUI5VersionValidationMessage(ui5VersionInfo), shouldHideIframe: true })
+        );
         return;
     }
 
     if (syncViewsIds.length > 0) {
         const bundle = await getTextBundle();
-        sendAction(
+        CommunicationService.sendAction(
             showMessage({
                 message: bundle.getText('ADP_SYNC_VIEWS_MESSAGE'),
                 shouldHideIframe: false
diff --git a/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-custom-section.ts b/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-custom-section.ts
index 1f7f81e18d..4764c7e598 100644
--- a/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-custom-section.ts
+++ b/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-custom-section.ts
@@ -29,7 +29,10 @@ export class AddCustomSectionQuickAction
         )[0] as ObjectPageLayout;
 
         const overlay = OverlayRegistry.getOverlay(objectPageLayout) || [];
-        await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, 'sections');
+        await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, {
+            aggregation: 'sections',
+            title: 'QUICK_ACTION_OP_ADD_CUSTOM_SECTION'
+        });
         return [];
     }
 }
diff --git a/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-header-field.ts b/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-header-field.ts
index 2e252989cb..7059f38738 100644
--- a/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-header-field.ts
+++ b/packages/preview-middleware-client/src/adp/quick-actions/common/op-add-header-field.ts
@@ -32,10 +32,16 @@ export class AddHeaderFieldQuickAction extends SimpleQuickActionDefinitionBase i
         // check if only flex box exist in the headerContent.
         if (headerContent.length === 1 && isA<FlexBox>('sap.m.FlexBox', headerContent[0])) {
             const overlay = OverlayRegistry.getOverlay(headerContent[0]) || [];
-            await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, 'items');
+            await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, {
+                aggregation: 'items',
+                title: 'QUICK_ACTION_OP_ADD_HEADER_FIELD'
+            });
         } else if (this.control) {
             const overlay = OverlayRegistry.getOverlay(this.control) || [];
-            await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, 'headerContent');
+            await handler(overlay, this.context.rta, DialogNames.ADD_FRAGMENT, undefined, {
+                aggregation: 'headerContent',
+                title: 'QUICK_ACTION_OP_ADD_HEADER_FIELD'
+            });
         }
         return [];
     }
diff --git a/packages/preview-middleware-client/src/adp/ui/AddFragment.fragment.xml b/packages/preview-middleware-client/src/adp/ui/AddFragment.fragment.xml
index df508b867a..2c8f137b54 100644
--- a/packages/preview-middleware-client/src/adp/ui/AddFragment.fragment.xml
+++ b/packages/preview-middleware-client/src/adp/ui/AddFragment.fragment.xml
@@ -2,7 +2,7 @@
     xmlns="sap.m"
     xmlns:core="sap.ui.core"
     xmlns:f="sap.ui.layout.form"  
-    title="Add XML Fragment" 
+    title="{/title}" 
     contentWidth="500px" 
     class="sapUiRTABorder">
     <content>
@@ -12,10 +12,11 @@
             labelSpanS="4"
             singleContainerFullSize="false">
             <f:content>
-                <Label text="Control Type" />
-                <Text text="{/selectedControlName}" />
-                <Label text="Target Aggregation" />
+                <Label visible="{/completeView}"  text="{i18n>ADP_ADD_FRAGMENT_DIALOG_CONTROL_TYPE_LABEL}" />
+                <Text visible="{/completeView}" text="{/selectedControlName}" />
+                <Label visible="{/completeView}" text="{i18n>ADP_ADD_FRAGMENT_DIALOG_AGGREGATION_LABEL}" />
                 <Select
+                    visible="{/completeView}"
                     change="onAggregationChanged"
                     selectedKey="{/selectedAggregation/key}"
                     items="{
@@ -24,7 +25,7 @@
                     }">
                     <core:Item key="{key}" text="{value}" />
                 </Select>
-                <Label text="Index" />
+                <Label text="{i18n>ADP_ADD_FRAGMENT_DIALOG_INDEX_LABEL}" />
                 <HBox alignItems="Center">
                     <Select
                         enabled="{/indexHandlingFlag}"
@@ -42,7 +43,7 @@
                         class= "sapUiTinyMarginBegin" 
                         tooltip="{/iconTooltip}" />
                 </HBox>
-                <Label text="Fragment Name" />
+                <Label text="{i18n>ADP_ADD_FRAGMENT_DIALOG_FRAGMENT_NAME_LABEL}" />
                 <Input 
                     description=".fragment.xml" 
                     value="{/newFragmentName}" 
diff --git a/packages/preview-middleware-client/src/cpe/changes/service.ts b/packages/preview-middleware-client/src/cpe/changes/service.ts
index e90a204d0e..1b034442e8 100644
--- a/packages/preview-middleware-client/src/cpe/changes/service.ts
+++ b/packages/preview-middleware-client/src/cpe/changes/service.ts
@@ -11,7 +11,7 @@ import {
     propertyChangeFailed,
     FlexChangesEndPoints,
     reloadApplication,
-    numberOfChangesRequiringReloadChanged,
+    setApplicationRequiresReload,
     save
 } from '@sap-ux-private/control-property-editor-common';
 import { applyChange } from './flex-change';
@@ -141,10 +141,10 @@ export class ChangeService {
             } else if (deletePropertyChanges.match(action)) {
                 await this.deleteChange(action.payload.controlId, action.payload.propertyName, action.payload.fileName);
             } else if (reloadApplication.match(action)) {
-                this.sendAction(numberOfChangesRequiringReloadChanged(0));
+                this.sendAction(setApplicationRequiresReload(false));
             } else if (save.match(action)) {
                 this.changesRequiringReload = 0;
-                this.sendAction(numberOfChangesRequiringReloadChanged(0));
+                this.sendAction(setApplicationRequiresReload(false));
             }
         });
 
@@ -298,7 +298,7 @@ export class ChangeService {
                 MessageToast.show(resourceBundle.getText('CPE_CHANGES_VISIBLE_AFTER_SAVE_AND_RELOAD_MESSAGE'), {
                     duration: 8000
                 });
-                this.sendAction(numberOfChangesRequiringReloadChanged(changesRequiringReload));
+                this.sendAction(setApplicationRequiresReload(changesRequiringReload > 0));
             }
             this.changesRequiringReload = changesRequiringReload;
 
diff --git a/packages/preview-middleware-client/src/cpe/communication-service.ts b/packages/preview-middleware-client/src/cpe/communication-service.ts
new file mode 100644
index 0000000000..a2f7be72be
--- /dev/null
+++ b/packages/preview-middleware-client/src/cpe/communication-service.ts
@@ -0,0 +1,41 @@
+import Log from 'sap/base/Log';
+
+import { ExternalAction, startPostMessageCommunication } from '@sap-ux-private/control-property-editor-common';
+
+import { getError } from '../utils/error';
+
+import { ActionHandler } from './types';
+
+export class CommunicationService {
+    /**
+     * Sends an action to the CPE.
+     */
+    static sendAction: (action: ExternalAction) => void;
+    private static actionHandlers: ActionHandler[] = [];
+
+    static {
+        const { sendAction } = startPostMessageCommunication<ExternalAction>(
+            window.parent,
+            async (action: ExternalAction) => {
+                for (const handler of this.actionHandlers) {
+                    try {
+                        await handler(action);
+                    } catch (error) {
+                        Log.error('Handler Failed: ', getError(error));
+                    }
+                }
+            }
+        );
+        this.sendAction = sendAction;
+    }
+
+    /**
+     * Creates a listener to receive actions from the CPE.
+     *
+     * @param handler - Action handler.
+     */
+    static subscribe(handler: ActionHandler): void {
+        // console.log(handler)
+        this.actionHandlers.push(handler);
+    }
+}
diff --git a/packages/preview-middleware-client/src/cpe/connector-service.ts b/packages/preview-middleware-client/src/cpe/connector-service.ts
index adfb49af5d..1887117afa 100644
--- a/packages/preview-middleware-client/src/cpe/connector-service.ts
+++ b/packages/preview-middleware-client/src/cpe/connector-service.ts
@@ -35,7 +35,14 @@ export class WorkspaceConnectorService {
         }
     }
 
-    private onChangeSaved(fileName: string, kind: 'delete' | 'create', changeType?: string) {
+    private onChangeSaved(fileName: string, kind: 'delete' | 'create', change: unknown = {}) {
+        const { changeType, content } = change as {
+            changeType?: string;
+            content?: {
+                templateName?: string;
+                fragmentPath?: string;
+            };
+        };
         if (
             (changeType && changeType !== 'appdescr_fe_changePageConfiguration') ||
             kind === 'delete' ||
@@ -43,5 +50,11 @@ export class WorkspaceConnectorService {
         ) {
             this.sendAction(storageFileChanged(fileName?.replace('sap.ui.fl.', '')));
         }
+        if (changeType === 'addXML' && content?.templateName !== undefined && content?.fragmentPath !== undefined) {
+            // If there is template available, then we save and reload right away,
+            // so we should ignore the first file change event that comes for the fragment.
+            // (We don't want to show "Reload" button)
+            this.sendAction(storageFileChanged(content.fragmentPath));
+        }
     }
 }
diff --git a/packages/preview-middleware-client/src/cpe/init.ts b/packages/preview-middleware-client/src/cpe/init.ts
index 8559f963b0..04600c20e5 100644
--- a/packages/preview-middleware-client/src/cpe/init.ts
+++ b/packages/preview-middleware-client/src/cpe/init.ts
@@ -1,9 +1,7 @@
 import Log from 'sap/base/Log';
 import type RuntimeAuthoring from 'sap/ui/rta/RuntimeAuthoring';
 
-import type { ExternalAction } from '@sap-ux-private/control-property-editor-common';
 import {
-    startPostMessageCommunication,
     iconsLoaded,
     enableTelemetry,
     appLoaded
@@ -14,13 +12,13 @@ import { OutlineService } from './outline/service';
 import { SelectionService } from './selection';
 import { ChangeService } from './changes/service';
 import { loadDefaultLibraries } from './documentation';
-import { logger } from './logger';
 import { getIcons } from './ui5-utils';
 import { WorkspaceConnectorService } from './connector-service';
 import { RtaService } from './rta-service';
 import { getError } from '../utils/error';
 import { QuickActionService } from './quick-actions/quick-action-service';
 import type { QuickActionDefinitionRegistry } from './quick-actions/registry';
+import { CommunicationService } from './communication-service';
 
 export default function init(
     rta: RuntimeAuthoring,
@@ -34,13 +32,12 @@ export default function init(
         enableTelemetry();
     }
 
-    const actionHandlers: ActionHandler[] = [];
     /**
      *
      * @param handler action handler
      */
     function subscribe(handler: ActionHandler): void {
-        actionHandlers.push(handler);
+        CommunicationService.subscribe(handler);
     }
 
     const selectionService = new SelectionService(rta);
@@ -61,30 +58,17 @@ export default function init(
 
     try {
         loadDefaultLibraries();
-        const { sendAction } = startPostMessageCommunication<ExternalAction>(
-            window.parent,
-            async function onAction(action) {
-                for (const handler of actionHandlers) {
-                    try {
-                        await handler(action);
-                    } catch (error) {
-                        Log.error('Handler Failed: ', getError(error));
-                    }
-                }
-            },
-            logger
-        );
 
         for (const service of services) {
             service
-                .init(sendAction, subscribe)
-                ?.catch((reason) => Log.error('Service Initalization Failed: ', getError(reason)));
+                .init(CommunicationService.sendAction, subscribe)
+                ?.catch((reason) => Log.error('Service Initialization Failed: ', getError(reason)));
         }
 
         const icons = getIcons();
 
-        sendAction(iconsLoaded(icons));
-        sendAction(appLoaded());
+        CommunicationService.sendAction(iconsLoaded(icons));
+        CommunicationService.sendAction(appLoaded());
     } catch (error) {
         Log.error('Error during initialization of Control Property Editor', getError(error));
     }
diff --git a/packages/preview-middleware-client/src/flp/WorkspaceConnector.ts b/packages/preview-middleware-client/src/flp/WorkspaceConnector.ts
index 36908f6129..e99ecb9099 100644
--- a/packages/preview-middleware-client/src/flp/WorkspaceConnector.ts
+++ b/packages/preview-middleware-client/src/flp/WorkspaceConnector.ts
@@ -18,7 +18,7 @@ const connector = merge({}, ObjectStorageConnector, {
 
             if (typeof this.fileChangeRequestNotifier === 'function' && change.fileName) {
                 try {
-                    this.fileChangeRequestNotifier(change.fileName, 'create', change.changeType);
+                    this.fileChangeRequestNotifier(change.fileName, 'create', change);
                 } catch (e) {
                     // exceptions in the listener call are ignored
                 }
diff --git a/packages/preview-middleware-client/src/flp/enableFakeConnector.ts b/packages/preview-middleware-client/src/flp/enableFakeConnector.ts
index 8b01e36dfc..d2b247dcf1 100644
--- a/packages/preview-middleware-client/src/flp/enableFakeConnector.ts
+++ b/packages/preview-middleware-client/src/flp/enableFakeConnector.ts
@@ -39,7 +39,7 @@ export async function create(changes: FlexChange[]): Promise<void> {
 
             if (typeof FakeLrepConnector.fileChangeRequestNotifier === 'function' && change.fileName) {
                 try {
-                    FakeLrepConnector.fileChangeRequestNotifier(change.fileName, 'create', change.changeType);
+                    FakeLrepConnector.fileChangeRequestNotifier(change.fileName, 'create', change);
                 } catch (e) {
                     // exceptions in the listener call are ignored
                 }
diff --git a/packages/preview-middleware-client/src/i18n.ts b/packages/preview-middleware-client/src/i18n.ts
index 074d6a086b..a1ba34f990 100644
--- a/packages/preview-middleware-client/src/i18n.ts
+++ b/packages/preview-middleware-client/src/i18n.ts
@@ -1,6 +1,8 @@
 import ResourceBundle from 'sap/base/i18n/ResourceBundle';
+import ResourceModel from 'sap/ui/model/resource/ResourceModel';
 
 const BUNDLE_CACHE: Record<string, ResourceBundle> = {};
+const MODEL_CACHE: Record<string, ResourceModel> = {};
 
 export async function getResourceBundle(key: string): Promise<ResourceBundle> {
     const cachedBundle = BUNDLE_CACHE[key];
@@ -20,6 +22,19 @@ export async function getResourceBundle(key: string): Promise<ResourceBundle> {
     return bundle;
 }
 
+export async function getResourceModel(key = 'open.ux.preview.client'): Promise<ResourceModel> {
+    const cachedModel = MODEL_CACHE[key];
+
+    if (cachedModel) {
+        return cachedModel;
+    }
+
+    const bundle = await getResourceBundle(key);
+    const model = new ResourceModel({ bundle });
+    MODEL_CACHE[key] = model;
+    return model;
+}
+
 export class TextBundle {
     constructor(private bundle: ResourceBundle) {}
 
diff --git a/packages/preview-middleware-client/src/messagebundle.properties b/packages/preview-middleware-client/src/messagebundle.properties
index 6401aa59e2..35dbc3098d 100644
--- a/packages/preview-middleware-client/src/messagebundle.properties
+++ b/packages/preview-middleware-client/src/messagebundle.properties
@@ -14,6 +14,11 @@ V4_QUICK_ACTION_CHANGE_TABLE_COLUMNS=Change Table Columns
 V4_QUICK_ACTION_LR_ENABLE_CLEAR_FILTER_BAR=Enable "Clear" Button in Filter Bar
 V4_QUICK_ACTION_LR_DISABLE_CLEAR_FILTER_BAR=Disable "Clear" Button in Filter Bar
 
+ADP_ADD_FRAGMENT_DIALOG_TITLE = Add XML Fragment
+ADP_ADD_FRAGMENT_DIALOG_CONTROL_TYPE_LABEL = Control Type
+ADP_ADD_FRAGMENT_DIALOG_AGGREGATION_LABEL = Target Aggregation
+ADP_ADD_FRAGMENT_DIALOG_INDEX_LABEL = Index
+ADP_ADD_FRAGMENT_DIALOG_FRAGMENT_NAME_LABEL = Fragment Name
 ADP_SYNC_VIEWS_MESSAGE = Have in mind that synchronous views are detected for this application and controller extensions are not supported for such views. Controller extension functionality on these views will be disabled.
 ADP_REUSE_COMPONENTS_MESSAGE = Have in mind that reuse components are detected for some views in this application and controller extensions and adding fragments are not supported for such views. Controller extension and adding fragment functionality on these views will be disabled.
 
diff --git a/packages/preview-middleware-client/test/__mock__/sap/ui/model/resource/ResourceModel.ts b/packages/preview-middleware-client/test/__mock__/sap/ui/model/resource/ResourceModel.ts
new file mode 100644
index 0000000000..acf6b7e690
--- /dev/null
+++ b/packages/preview-middleware-client/test/__mock__/sap/ui/model/resource/ResourceModel.ts
@@ -0,0 +1,5 @@
+// add required functionality for testing here
+export default jest.fn().mockReturnValue({
+    setProperty: jest.fn(),
+    getProperty: jest.fn().mockReturnValue({ addDependent: jest.fn() })
+});
diff --git a/packages/preview-middleware-client/test/unit/adp/controllers/AddFragment.controller.test.ts b/packages/preview-middleware-client/test/unit/adp/controllers/AddFragment.controller.test.ts
index 254f828cd8..5a8b1347cd 100644
--- a/packages/preview-middleware-client/test/unit/adp/controllers/AddFragment.controller.test.ts
+++ b/packages/preview-middleware-client/test/unit/adp/controllers/AddFragment.controller.test.ts
@@ -75,7 +75,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 overlays as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const openSpy = jest.fn();
@@ -105,7 +108,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const event = {
@@ -163,7 +169,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const closeSpy = jest.fn();
@@ -193,7 +202,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -223,7 +235,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -253,7 +268,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -283,7 +301,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -313,7 +334,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                {} as unknown as RuntimeAuthoring
+                {} as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -355,7 +379,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                rtaMock as unknown as RuntimeAuthoring
+                rtaMock as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -398,7 +425,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                rtaMock as unknown as RuntimeAuthoring
+                rtaMock as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -445,7 +475,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                rtaMock as unknown as RuntimeAuthoring
+                rtaMock as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -477,7 +510,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 {} as unknown as UI5Element,
-                rtaMock as unknown as RuntimeAuthoring
+                rtaMock as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const valueStateSpy = jest.fn().mockReturnValue({ setValueStateText: jest.fn() });
@@ -536,7 +572,10 @@ describe('AddFragment', () => {
             const addFragment = new AddFragment(
                 'adp.extension.controllers.AddFragment',
                 overlays as unknown as UI5Element,
-                rtaMock as unknown as RuntimeAuthoring
+                rtaMock as unknown as RuntimeAuthoring,
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE'
+                }
             );
 
             const event = {
@@ -604,7 +643,10 @@ describe('AddFragment', () => {
                 'adp.extension.controllers.AddFragment',
                 overlays as unknown as UI5Element,
                 rtaMock as unknown as RuntimeAuthoring,
-                'sections'
+                {
+                    title: 'ADP_ADD_FRAGMENT_DIALOG_TITLE',
+                    aggregation: 'sections'
+                }
             );
 
             const event = {
diff --git a/packages/preview-middleware-client/test/unit/adp/init.test.ts b/packages/preview-middleware-client/test/unit/adp/init.test.ts
index 6e1431da9b..70b26ad65e 100644
--- a/packages/preview-middleware-client/test/unit/adp/init.test.ts
+++ b/packages/preview-middleware-client/test/unit/adp/init.test.ts
@@ -3,6 +3,7 @@ import init from '../../../src/adp/init';
 import { fetchMock } from 'mock/window';
 import * as ui5Utils from '../../../src/cpe/ui5-utils';
 import { OutlineService } from '../../../src/cpe/outline/service';
+import { CommunicationService } from '../../../src/cpe/communication-service';
 import VersionInfo from 'mock/sap/ui/VersionInfo';
 import RuntimeAuthoringMock from 'mock/sap/ui/rta/RuntimeAuthoring';
 import { RTAOptions } from 'sap/ui/rta/RuntimeAuthoring';
@@ -13,7 +14,7 @@ import Element from 'mock/sap/ui/core/Element';
 describe('adp', () => {
     const addMenuItemSpy = jest.fn();
     let initOutlineSpy: jest.SpyInstance;
-    const sendActionMock = jest.fn();
+    const sendActionMock = jest.spyOn(CommunicationService, 'sendAction');
     const rtaMock = new RuntimeAuthoringMock({} as RTAOptions);
 
     rtaMock.attachUndoRedoStackModified = jest.fn();
@@ -61,9 +62,7 @@ describe('adp', () => {
     });
 
     test('init', async () => {
-        const spyPostMessage = jest.spyOn(common, 'startPostMessageCommunication').mockImplementation(() => {
-            return { dispose: jest.fn(), sendAction: jest.fn() };
-        });
+        const spyPostMessage = jest.spyOn(CommunicationService, 'subscribe');
         const enableTelemetry = jest.spyOn(common, 'enableTelemetry');
         VersionInfo.load.mockResolvedValue({ name: 'sap.ui.core', version: '1.118.1' });
 
@@ -74,25 +73,23 @@ describe('adp', () => {
         expect(setPluginsSpy).toBeCalledTimes(1);
         expect(enableTelemetry).toBeCalledTimes(2);
 
-        const callBackFn = spyPostMessage.mock.calls[0][1];
-
-        const payload = {
-            controlId: 'v2flex::sap.suite.ui.generic.template.ListReport.view.ListReport'
-        };
+        const callBackFn = spyPostMessage.mock.calls[0][0];
 
-        await callBackFn({
-            type: '[ext] add-extension-point',
-            payload
+        const action = common.addExtensionPoint({
+            controlId: 'v2flex::sap.suite.ui.generic.template.ListReport.view.ListReport',
+            children: [],
+            controlType: '',
+            editable: true,
+            name: '',
+            visible: true
         });
 
-        expect(executeSpy).toHaveBeenCalledWith(payload.controlId, 'CTX_ADDXML_AT_EXTENSIONPOINT');
+        await callBackFn(action);
+
+        expect(executeSpy).toHaveBeenCalledWith(action.payload.controlId, 'CTX_ADDXML_AT_EXTENSIONPOINT');
     });
 
     test('init - send notification for UI5 version lower than 1.71', async () => {
-        jest.spyOn(common, 'startPostMessageCommunication').mockImplementation(() => {
-            return { dispose: jest.fn(), sendAction: sendActionMock };
-        });
-
         VersionInfo.load.mockResolvedValue({ name: 'sap.ui.core', version: '1.70.0' });
 
         await init(rtaMock as unknown as RuntimeAuthoring);
@@ -118,10 +115,6 @@ describe('adp', () => {
     });
 
     test('init - send notification existence of sync views for minor UI5 version bigger than 120', async () => {
-        jest.spyOn(common, 'startPostMessageCommunication').mockImplementation(() => {
-            return { dispose: jest.fn(), sendAction: sendActionMock };
-        });
-
         const mockUI5Element = {
             getMetadata: jest.fn().mockReturnValue({
                 getName: jest.fn().mockReturnValue('XMLView')
@@ -158,10 +151,6 @@ describe('adp', () => {
     });
 
     test('init - send notification existence of sync views for minor UI5 version lower than 120', async () => {
-        jest.spyOn(common, 'startPostMessageCommunication').mockImplementation(() => {
-            return { dispose: jest.fn(), sendAction: sendActionMock };
-        });
-
         const mockUI5Element = {
             getMetadata: jest.fn().mockReturnValue({
                 getName: jest.fn().mockReturnValue('XMLView')
diff --git a/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v2.test.ts b/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v2.test.ts
index aa54c12514..c752e86b7e 100644
--- a/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v2.test.ts
+++ b/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v2.test.ts
@@ -502,7 +502,10 @@ describe('FE V2 quick actions', () => {
                     '../../../../src/adp/init-dialogs'
                 );
 
-                expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, 'items');
+                expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, {
+                    title: 'QUICK_ACTION_OP_ADD_HEADER_FIELD',
+                    aggregation: 'items'
+                });
             });
         });
         describe('add custom section', () => {
@@ -634,7 +637,10 @@ describe('FE V2 quick actions', () => {
                     '../../../../src/adp/init-dialogs'
                 );
 
-                expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, 'sections');
+                expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, {
+                    title: 'QUICK_ACTION_OP_ADD_CUSTOM_SECTION',
+                    aggregation: 'sections'
+                });
             });
         });
     });
diff --git a/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v4.test.ts b/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v4.test.ts
index df5fc10b6a..5eaf0f761f 100644
--- a/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v4.test.ts
+++ b/packages/preview-middleware-client/test/unit/adp/quick-actions/fe-v4.test.ts
@@ -513,7 +513,10 @@ describe('FE V2 quick actions', () => {
                         '../../../../src/adp/init-dialogs'
                     );
 
-                    expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, 'items');
+                    expect(handler).toHaveBeenCalledWith(mockOverlay, rtaMock, 'AddFragment', undefined, {
+                        aggregation: 'items',
+                        title: 'QUICK_ACTION_OP_ADD_HEADER_FIELD'
+                    });
                 });
             });
         });
diff --git a/packages/preview-middleware-client/test/unit/cpe/changes/service.test.ts b/packages/preview-middleware-client/test/unit/cpe/changes/service.test.ts
index 4db47a294a..335c92a2f9 100644
--- a/packages/preview-middleware-client/test/unit/cpe/changes/service.test.ts
+++ b/packages/preview-middleware-client/test/unit/cpe/changes/service.test.ts
@@ -1,7 +1,7 @@
 import * as flexChange from '../../../../src/cpe/changes/flex-change';
 import { ChangeService } from '../../../../src/cpe/changes/service';
 import { ActionHandler } from '../../../../src/cpe/types';
-import { changeProperty, deletePropertyChanges, numberOfChangesRequiringReloadChanged } from '@sap-ux-private/control-property-editor-common';
+import { changeProperty, deletePropertyChanges, setApplicationRequiresReload } from '@sap-ux-private/control-property-editor-common';
 import RuntimeAuthoringMock from 'mock/sap/ui/rta/RuntimeAuthoring';
 import { RTAOptions } from 'sap/ui/rta/RuntimeAuthoring';
 
@@ -602,7 +602,7 @@ describe('SelectionService', () => {
 
         await (rtaMock.attachUndoRedoStackModified as jest.Mock).mock.calls[0][0]();
         expect(sendActionMock).toHaveBeenCalledTimes(5);
-        expect(sendActionMock).toHaveBeenNthCalledWith(2, numberOfChangesRequiringReloadChanged(1))
+        expect(sendActionMock).toHaveBeenNthCalledWith(2, setApplicationRequiresReload(true))
         expect(sendActionMock).toHaveBeenNthCalledWith(3, {
             type: '[ext] change-stack-modified',
             payload: {
diff --git a/packages/preview-middleware-client/test/unit/cpe/connector-service.test.ts b/packages/preview-middleware-client/test/unit/cpe/connector-service.test.ts
index d1608a8d9f..6fdc57ea22 100644
--- a/packages/preview-middleware-client/test/unit/cpe/connector-service.test.ts
+++ b/packages/preview-middleware-client/test/unit/cpe/connector-service.test.ts
@@ -66,4 +66,43 @@ describe('connector-service', () => {
         });
         expect(sendActionMock).toHaveBeenCalledWith(common.storageFileChanged('testFile'));
     });
+
+    test('addXML', async () => {
+        VersionInfo.load.mockResolvedValue({ name: 'sap.ui.core', version: '1.120.4' });
+        const wsConnector = new WorkspaceConnectorService();
+        const subscribeSpy = jest.fn<void, [ActionHandler]>();
+        await wsConnector.init(sendActionMock, subscribeSpy);
+
+        subscribeSpy.mock.calls[0][0](common.reloadApplication({ save: true }));
+        // call notifier
+        await connector.storage.setItem('sap.ui.fl.testFile', {
+            changeType: 'addXML',
+            fileName: 'sap.ui.fl.testFile',
+            support: {}
+        });
+        expect(sendActionMock).toBeCalledTimes(1);
+        expect(sendActionMock).toHaveBeenCalledWith(common.storageFileChanged('testFile'));
+    });
+
+    test('addXML with template', async () => {
+        VersionInfo.load.mockResolvedValue({ name: 'sap.ui.core', version: '1.120.4' });
+        const wsConnector = new WorkspaceConnectorService();
+        const subscribeSpy = jest.fn<void, [ActionHandler]>();
+        await wsConnector.init(sendActionMock, subscribeSpy);
+
+        subscribeSpy.mock.calls[0][0](common.reloadApplication({ save: true }));
+        // call notifier
+        await connector.storage.setItem('sap.ui.fl.testFile', {
+            changeType: 'addXML',
+            fileName: 'sap.ui.fl.testFile',
+            support: {},
+            content: {
+                templateName: 'my-template',
+                fragmentPath: 'fragments/fragment.xml'
+            }
+        });
+
+        expect(sendActionMock).toHaveBeenNthCalledWith(1, common.storageFileChanged('testFile'));
+        expect(sendActionMock).toHaveBeenNthCalledWith(2, common.storageFileChanged('fragments/fragment.xml'));
+    });
 });
diff --git a/packages/preview-middleware-client/test/unit/cpe/init.test.ts b/packages/preview-middleware-client/test/unit/cpe/init.test.ts
index b6df820d48..29e7f2c5ca 100644
--- a/packages/preview-middleware-client/test/unit/cpe/init.test.ts
+++ b/packages/preview-middleware-client/test/unit/cpe/init.test.ts
@@ -1,3 +1,5 @@
+import RuntimeAuthoring, { RTAOptions } from 'sap/ui/rta/RuntimeAuthoring';
+
 import * as common from '@sap-ux-private/control-property-editor-common';
 
 import RuntimeAuthoringMock from 'mock/sap/ui/rta/RuntimeAuthoring';
@@ -10,7 +12,7 @@ import * as flexChange from '../../../src/cpe/changes/flex-change';
 import { OutlineService } from '../../../src/cpe/outline/service';
 import * as ui5Utils from '../../../src/cpe/ui5-utils';
 import connector from '../../../src/flp/WorkspaceConnector';
-import RuntimeAuthoring, { RTAOptions } from 'sap/ui/rta/RuntimeAuthoring';
+import { CommunicationService } from '../../../src/cpe/communication-service';
 
 describe('main', () => {
     const sendActionMock = jest.fn();
@@ -80,15 +82,14 @@ describe('main', () => {
         return mockIconResult;
     });
 
-    const spyPostMessage = jest.spyOn(common, 'startPostMessageCommunication').mockImplementation(() => {
-        return { sendAction: sendActionMock, dispose: jest.fn() };
-    });
+    const spyPostMessage = jest.spyOn(CommunicationService, 'subscribe');
 
     test('init - 1', async () => {
         initOutlineSpy.mockResolvedValue();
         // const rta = new RuntimeAuthoringMock();
         await init(rta);
-        const callBackFn = spyPostMessage.mock.calls[0][1];
+        const callBackFn = spyPostMessage.mock.calls[2][0];
+        (callBackFn as any)('test')
         // apply change without error
         const payload = {
             controlId:
@@ -118,6 +119,6 @@ describe('main', () => {
 
         // assert
         expect(initOutlineSpy).toHaveBeenCalledTimes(1);
-        expect(Log.error).toBeCalledWith('Service Initalization Failed: ', error);
+        expect(Log.error).toBeCalledWith('Service Initialization Failed: ', error);
     });
 });
diff --git a/packages/preview-middleware-client/test/unit/flp/WorkspaceConnector.test.ts b/packages/preview-middleware-client/test/unit/flp/WorkspaceConnector.test.ts
index cb811719b8..94837efc06 100644
--- a/packages/preview-middleware-client/test/unit/flp/WorkspaceConnector.test.ts
+++ b/packages/preview-middleware-client/test/unit/flp/WorkspaceConnector.test.ts
@@ -41,7 +41,7 @@ describe('flp/WorkspaceConnector', () => {
                     body: JSON.stringify(change, null, 2)
                 })
             );
-            expect(connector.storage.fileChangeRequestNotifier).toHaveBeenCalledWith('dummyFile', 'create', 'property');
+            expect(connector.storage.fileChangeRequestNotifier).toHaveBeenCalledWith('dummyFile', 'create', change);
         });
 
         test('setItem, generator - tool-variant', async () => {
diff --git a/packages/preview-middleware-client/types/sap.ui.fl.d.ts b/packages/preview-middleware-client/types/sap.ui.fl.d.ts
index d414c87af4..ce6b057132 100644
--- a/packages/preview-middleware-client/types/sap.ui.fl.d.ts
+++ b/packages/preview-middleware-client/types/sap.ui.fl.d.ts
@@ -90,7 +90,7 @@ declare module 'sap/ui/fl/write/api/connectors/ObjectStorageConnector' {
         getItem(key: string): unknown;
         getItems(): Promise<unknown[]>;
         fileChangeRequestNotifier:
-            | ((fileName: string, kind: 'create' | 'delete', changeType?: string) => void)
+            | (<T extends object>(fileName: string, kind: 'create' | 'delete', change?: T) => void)
             | undefined;
     }
 
diff --git a/packages/preview-middleware-client/types/sap.ui.rta.d.ts b/packages/preview-middleware-client/types/sap.ui.rta.d.ts
index 4d2af9eb6f..a52e881488 100644
--- a/packages/preview-middleware-client/types/sap.ui.rta.d.ts
+++ b/packages/preview-middleware-client/types/sap.ui.rta.d.ts
@@ -130,7 +130,7 @@ declare module 'sap/ui/rta/command/OutlineService' {
 
 declare module 'sap/ui/fl/FakeLrepConnector' {
     export default class FakeLrepConnector {
-        static fileChangeRequestNotifier?: (fileName: string, kind: 'delete' | 'create', changeType?: string) => void;
+        static fileChangeRequestNotifier?: <T extends object>(fileName: string, kind: 'delete' | 'create', change?: T) => void;
         static enableFakeConnector: () => void;
     }
 }