Merge branch 'main' into uitable-a11y2

* main: chore: apply latest changesets feat(fpm-writer): property `allowAutoAddDependencyLib` to the building block API, which allows turning off the automatic addition of the 'sap.fe.macros' library (#2393) chore: apply latest changesets fix: missing unique react key (#2368) chore: apply latest changesets fix: theme picker hover and border for dropdowns (#2377) chore: apply latest changesets fix(preview-middleware): manifest changes not visible after reload (#2385) chore: apply latest changesets fix(ui-c): accessibility updates for uitable (#2391) chore: apply latest changesets Revise launch config (#2347) chore: apply latest changesets feat: app info file handling logic to new module @sap-ux/fiori-tools-settings (#2379)
SAP · Sep 20, 2024 · 3e0e02e · 3e0e02e
2 parents c02ef31 + cb92850
commit 3e0e02e
Show file tree

Hide file tree

Showing 69 changed files with 1,592 additions and 573 deletions.
diff --git a/examples/fe-fpm-cli/CHANGELOG.md b/examples/fe-fpm-cli/CHANGELOG.md
@@ -1,5 +1,12 @@
 # @sap-ux/fe-fpm-cli
 
+## 0.0.29
+
+### Patch Changes
+
+-   Updated dependencies [a18d4a2]
+    -   @sap-ux/fe-fpm-writer@0.31.2
+
 ## 0.0.28
 
 ### Patch Changes

diff --git a/examples/fe-fpm-cli/package.json b/examples/fe-fpm-cli/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sap-ux/fe-fpm-cli",
-    "version": "0.0.28",
+    "version": "0.0.29",
     "description": "A simple CLI to prompt required information to create a building block using the fe-fpm-writer module's prompt and generate functions.",
     "license": "Apache-2.0",
     "private": true,

diff --git a/examples/prompting-ui/CHANGELOG.md b/examples/prompting-ui/CHANGELOG.md
@@ -1,5 +1,27 @@
 # @sap-ux/fe-fpm-writer-ui
 
+## 0.1.4
+
+### Patch Changes
+
+-   a18d4a2: Extend the building block examples with an option to toggle the `allowAutoAddDependencyLib` property, allowing to turning off the automatic addition of the 'sap.fe.macros' library to the 'manifest.json'.
+
+## 0.1.3
+
+### Patch Changes
+
+-   Updated dependencies [1fdac94]
+    -   @sap-ux/ui-components@1.18.2
+    -   @sap-ux/ui-prompting@0.1.12
+
+## 0.1.2
+
+### Patch Changes
+
+-   Updated dependencies [15c57bc]
+    -   @sap-ux/ui-components@1.18.1
+    -   @sap-ux/ui-prompting@0.1.11
+
 ## 0.1.1
 
 ### Patch Changes

diff --git a/examples/prompting-ui/package.json b/examples/prompting-ui/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sap-ux/prompting-ui",
-    "version": "0.1.1",
+    "version": "0.1.4",
     "description": "This project contains UI storybook stories with exampleS with prompt ui and FPM based building blocks.",
     "license": "Apache-2.0",
     "private": true,

diff --git a/examples/prompting-ui/src/BuildingBlock.tsx b/examples/prompting-ui/src/BuildingBlock.tsx
@@ -35,6 +35,7 @@ export const BuildingBlockQuestions = (props: {
         showDescriptions: true
     });
     const [alwaysAbsolutePath, setAlwaysAbsolutePath] = useState(true);
+    const [allowAutoAddDependencyLib, setAllowAutoAddDependencyLib] = useState(true);
     const choices = useChoices();
     const { groups, questions, initialAnswers = {} } = useQuestions(type, visibleQuestions);
     const [answers, setAnswers] = useState<Answers>(externalAnswers ?? initialAnswers);
@@ -137,6 +138,15 @@ export const BuildingBlockQuestions = (props: {
                         setAlwaysAbsolutePath(!!checked);
                     }}
                 />
+                <UICheckbox
+                    label="AllowAutoAddDependencyLib"
+                    checked={allowAutoAddDependencyLib}
+                    onChange={(ev?: React.FormEvent<HTMLElement | HTMLInputElement>, checked?: boolean) => {
+                        const newAnswers = setAnswer({ ...answers }, 'allowAutoAddDependencyLib', checked);
+                        setAnswers(newAnswers);
+                        setAllowAutoAddDependencyLib(!!checked);
+                    }}
+                />
             </div>
             <div
                 style={{

diff --git a/examples/prompting-ui/src/addons/preview/component.tsx b/examples/prompting-ui/src/addons/preview/component.tsx
@@ -6,14 +6,17 @@ import type { Actions } from '../../../src/utils';
 
 getWebSocket(false);
 
+type SupportedLanguages = 'html' | 'json';
+
 export const render = (props: { active?: boolean }): React.ReactElement => {
     const { active = false } = props;
-    const [preview, setPreview] = useState<{ codeSnippets: { content: string; fileName: string }[]; answers: unknown }>(
-        {
-            answers: {},
-            codeSnippets: []
-        }
-    );
+    const [preview, setPreview] = useState<{
+        codeSnippets: { content: string; fileName: string; language: SupportedLanguages }[];
+        answers: unknown;
+    }>({
+        answers: {},
+        codeSnippets: []
+    });
 
     useEffect(function () {
         const handleMessage = (responseAction: Actions) => {
@@ -27,7 +30,8 @@ export const render = (props: { active?: boolean }): React.ReactElement => {
                 setPreview({
                     codeSnippets: Object.values(responseAction.codeSnippets).map((snippet) => ({
                         content: snippet.content,
-                        fileName: snippet.filePathProps?.fileName ?? 'Please select a file'
+                        fileName: snippet.filePathProps?.fileName ?? 'Please select a file',
+                        language: snippet.language === 'xml' ? 'html' : (snippet.language as SupportedLanguages)
                     })),
                     answers: answersPreview
                 });
@@ -48,7 +52,7 @@ export const render = (props: { active?: boolean }): React.ReactElement => {
         <AddonPanel key="panel" active={active}>
             {preview.codeSnippets.map((snippet) => (
                 <Form.Field label={snippet.fileName} key={snippet.fileName}>
-                    <SyntaxHighlighter language="html">{snippet.content}</SyntaxHighlighter>
+                    <SyntaxHighlighter language={snippet.language ?? 'html'}>{snippet.content}</SyntaxHighlighter>
                 </Form.Field>
             ))}
             <Form.Field label="Answers">

diff --git a/examples/simple-generator/CHANGELOG.md b/examples/simple-generator/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sap-ux/generator-simple-fe
 
+## 1.0.50
+
+### Patch Changes
+
+-   @sap-ux/fiori-elements-writer@1.1.24
+
 ## 1.0.49
 
 ### Patch Changes

diff --git a/examples/simple-generator/package.json b/examples/simple-generator/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sap-ux/generator-simple-fe",
-    "version": "1.0.49",
+    "version": "1.0.50",
     "description": "Simple example of a yeoman generator for Fiori elements.",
     "license": "Apache-2.0",
     "private": true,

diff --git a/packages/adp-tooling/CHANGELOG.md b/packages/adp-tooling/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sap-ux/adp-tooling
 
+## 0.12.50
+
+### Patch Changes
+
+-   00e1835: Fixed manifest changes not visible in preview after reload
+
 ## 0.12.49
 
 ### Patch Changes

diff --git a/packages/adp-tooling/package.json b/packages/adp-tooling/package.json
@@ -9,7 +9,7 @@
     "bugs": {
         "url": "https://github.com/SAP/open-ux-tools/issues?q=is%3Aopen+is%3Aissue+label%3Abug+label%3Aadp-tooling"
     },
-    "version": "0.12.49",
+    "version": "0.12.50",
     "license": "Apache-2.0",
     "author": "@SAP/ux-tools-team",
     "main": "dist/index.js",

diff --git a/packages/adp-tooling/src/preview/adp-preview.ts b/packages/adp-tooling/src/preview/adp-preview.ts
@@ -6,13 +6,19 @@ import type { NextFunction, Request, Response, Router, RequestHandler } from 'ex
 import type { Logger, ToolsLogger } from '@sap-ux/logger';
 import type { UI5FlexLayer } from '@sap-ux/project-access';
 import { createAbapServiceProvider } from '@sap-ux/system-access';
-import type { MergedAppDescriptor } from '@sap-ux/axios-extension';
+import type { LayeredRepositoryService, MergedAppDescriptor } from '@sap-ux/axios-extension';
 
 import RoutesHandler from './routes-handler';
 import type { AdpPreviewConfig, CommonChangeProperties, DescriptorVariant, OperationType } from '../types';
 import type { Editor } from 'mem-fs-editor';
 import { addXmlFragment, isAddXMLChange, moduleNameContentMap, tryFixChange } from './change-handler';
 
+declare global {
+    // false positive, const can't be used here https://github.com/eslint/eslint/issues/15896
+    // eslint-disable-next-line no-var
+    var __SAP_UX_MANIFEST_SYNC_REQUIRED__: boolean | undefined;
+}
+
 export const enum ApiRoutes {
     FRAGMENT = '/adp/api/fragment',
     CONTROLLER = '/adp/api/controller',
@@ -32,10 +38,13 @@ export class AdpPreview {
      */
     private routesHandler: RoutesHandler;
 
+    private lrep: LayeredRepositoryService | undefined;
+    private descriptorVariantId: string | undefined;
+
     /**
      * @returns merged manifest.
      */
-    get descriptor() {
+    get descriptor(): MergedAppDescriptor {
         if (this.mergedDescriptor) {
             return this.mergedDescriptor;
         } else {
@@ -46,7 +55,9 @@ export class AdpPreview {
     /**
      * @returns a list of resources required to the adaptation project as well as the original app.
      */
-    get resources() {
+    get resources(): {
+        [name: string]: string;
+    } {
         if (this.mergedDescriptor) {
             const resources = {
                 [this.mergedDescriptor.name]: this.mergedDescriptor.url
@@ -91,26 +102,37 @@ export class AdpPreview {
      * @returns the UI5 flex layer for which editing is enabled
      */
     async init(descriptorVariant: DescriptorVariant): Promise<UI5FlexLayer> {
+        this.descriptorVariantId = descriptorVariant.id;
         const provider = await createAbapServiceProvider(
             this.config.target,
             { ignoreCertErrors: this.config.ignoreCertErrors },
             true,
             this.logger
         );
-        const lrep = provider.getLayeredRepository();
+        this.lrep = provider.getLayeredRepository();
+        // fetch a merged descriptor from the backend
+        await this.lrep.getCsrfToken();
 
+        await this.sync();
+        return descriptorVariant.layer;
+    }
+
+    /**
+     * Synchronize local changes with the backend.
+     *
+     */
+    async sync(): Promise<void> {
+        if (!this.lrep || !this.descriptorVariantId) {
+            throw new Error('Not initialized');
+        }
         const zip = new ZipFile();
         const files = await this.project.byGlob('**/*.*');
         for (const file of files) {
             zip.addFile(file.getPath().substring(1), await file.getBuffer());
         }
         const buffer = zip.toBuffer();
 
-        // fetch a merged descriptor from the backend
-        await lrep.getCsrfToken();
-        this.mergedDescriptor = (await lrep.mergeAppDescriptorVariant(buffer))[descriptorVariant.id];
-
-        return descriptorVariant.layer;
+        this.mergedDescriptor = (await this.lrep.mergeAppDescriptorVariant(buffer))[this.descriptorVariantId];
     }
 
     /**
@@ -120,8 +142,12 @@ export class AdpPreview {
      * @param res outgoing response object
      * @param next next middleware that is to be called if the request cannot be handled
      */
-    async proxy(req: Request, res: Response, next: NextFunction) {
+    async proxy(req: Request, res: Response, next: NextFunction): Promise<void> {
         if (req.path === '/manifest.json') {
+            if (global.__SAP_UX_MANIFEST_SYNC_REQUIRED__) {
+                await this.sync();
+                global.__SAP_UX_MANIFEST_SYNC_REQUIRED__ = false;
+            }
             res.status(200);
             res.send(JSON.stringify(this.descriptor.manifest, undefined, 2));
         } else if (req.path === '/Component-preload.js') {

diff --git a/packages/adp-tooling/test/unit/preview/adp-preview.test.ts b/packages/adp-tooling/test/unit/preview/adp-preview.test.ts
@@ -176,6 +176,32 @@ describe('AdaptationProject', () => {
 
             expect(() => adp.descriptor).toThrowError();
             expect(() => adp.resources).toThrowError();
+            await expect(() => adp.sync()).rejects.toEqual(Error('Not initialized'));
+        });
+    });
+    describe('sync', () => {
+        test('updates merged descriptor', async () => {
+            const adp = new AdpPreview(
+                {
+                    target: {
+                        url: backend
+                    }
+                },
+                mockProject as unknown as ReaderCollection,
+                middlewareUtil,
+                logger
+            );
+
+            mockProject.byGlob.mockResolvedValueOnce([
+                {
+                    getPath: () => '/manifest.appdescr_variant',
+                    getBuffer: () => Buffer.from(descriptorVariant)
+                }
+            ]);
+            await adp.init(JSON.parse(descriptorVariant));
+            (adp as any).mergedDescriptor = undefined;
+            await adp.sync();
+            expect(adp.descriptor).toBeDefined();
         });
     });
     describe('proxy', () => {
@@ -209,6 +235,18 @@ describe('AdaptationProject', () => {
             server = supertest(app);
         });
 
+        afterEach(() => {
+            global.__SAP_UX_MANIFEST_SYNC_REQUIRED__ = false;
+        });
+
+        test('/manifest.json with sync', async () => {
+            global.__SAP_UX_MANIFEST_SYNC_REQUIRED__ = true;
+            const syncSpy = jest.spyOn(AdpPreview.prototype, 'sync').mockImplementation(() => Promise.resolve());
+            const response = await server.get('/my/adaptation/manifest.json').expect(200);
+            expect(syncSpy).toHaveBeenCalledTimes(1);
+            expect(JSON.parse(response.text)).toEqual(mockMergedDescriptor.manifest);
+        });
+
         test('/manifest.json', async () => {
             const response = await server.get('/my/adaptation/manifest.json').expect(200);
             expect(JSON.parse(response.text)).toEqual(mockMergedDescriptor.manifest);

diff --git a/packages/control-property-editor/CHANGELOG.md b/packages/control-property-editor/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sap-ux/control-property-editor
 
+## 0.5.8
+
+### Patch Changes
+
+-   e12dd50: Added hover over theme picker and border for Callout
+
 ## 0.5.7
 
 ### Patch Changes

diff --git a/packages/control-property-editor/package.json b/packages/control-property-editor/package.json
@@ -3,7 +3,7 @@
     "displayName": "Control Property Editor",
     "description": "Control Property Editor",
     "license": "Apache-2.0",
-    "version": "0.5.7",
+    "version": "0.5.8",
     "main": "dist/app.js",
     "repository": {
         "type": "git",

diff --git a/packages/control-property-editor/src/Workarounds.scss b/packages/control-property-editor/src/Workarounds.scss
@@ -90,7 +90,6 @@
     }
 }
 
-// Callout
-.ms-Callout-main {
-    border: 1px solid var(--vscode-contrastBorder);
+.ms-Callout {
+    border: 1px solid var(--vscode-widget-border);
 }
diff --git a/packages/control-property-editor/src/components/ThemeSelectorCallout.scss b/packages/control-property-editor/src/components/ThemeSelectorCallout.scss
@@ -46,6 +46,11 @@
     background-color: var(--vscode-progressBar-background);
 }
 
+.theme-child:hover:not(.selected) {
+    background-color: var(--vscode-toolbar-hoverBackground, var(--vscode-menubar-selectionBackground));
+    outline: 1px dashed var(--vscode-contrastActiveBorder);
+}
+
 div#theme-light-modern {
     margin-left: 3px;
     margin-bottom: 3px;

diff --git a/packages/create/CHANGELOG.md b/packages/create/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @sap-ux/create
 
+## 0.8.20
+
+### Patch Changes
+
+-   Updated dependencies [00e1835]
+    -   @sap-ux/preview-middleware@0.16.68
+    -   @sap-ux/adp-tooling@0.12.50
+
 ## 0.8.19
 
 ### Patch Changes

diff --git a/packages/create/package.json b/packages/create/package.json
@@ -1,7 +1,7 @@
 {
     "name": "@sap-ux/create",
     "description": "SAP Fiori tools module to add or remove features",
-    "version": "0.8.19",
+    "version": "0.8.20",
     "repository": {
         "type": "git",
         "url": "https://github.com/SAP/open-ux-tools.git",

diff --git a/packages/fe-fpm-writer/CHANGELOG.md b/packages/fe-fpm-writer/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @sap-ux/fe-fpm-writer
 
+## 0.31.2
+
+### Patch Changes
+
+-   a18d4a2: Added property `allowAutoAddDependencyLib` to the building block API. This property allows turning off the automatic addition of the 'sap.fe.macros' library to the 'manifest.json' file under library dependencies (`"sap.ui5"/"dependencies"/"libs"`). The default value is `true`.
+
 ## 0.31.1
 
 ### Patch Changes