Merge branch 'development' into nc-olu-private-connectivity

Author: OlufunkeMoronfolu

config/_default/hugo.toml

@@ -30,11 +30,6 @@ disableKinds = ["taxonomy", "term"]
     quality = 75
     anchor = "smart"
 
-[services]
-    [services.googleAnalytics]
-        # Marketing Google Tag ID
-        id = 'UA-163813-1'
-
 # Language configuration
 
 [languages]
@@ -161,7 +156,7 @@ replacements = "github.com/FortAwesome/Font-Awesome -> ., github.com/twbs/bootst
         sidebar_menu_truncate = 100
 
     # Adds a H2 section titled "Feedback" to the bottom of each doc. The responses are sent to Google Analytics as events.
-    # This feature depends on [services.googleAnalytics] and will be disabled if "services.googleAnalytics.id" is not set.
+    # This feature used to depend on [services.googleAnalytics],but that is now become obsolete.
     # If you want this feature, but occasionally need to remove the "Feedback" section from a single page,
     # add "hide_feedback: true" to the page's front matter.
     [params.ui.feedback]

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/packaging-your-extension.md

@@ -10,7 +10,7 @@ After completing development on your extension, you can package it into an add-o
 
 To package your extension, follow the steps below:
 
-1. Make sure the`--enable-extension-development` command-line option is enabled.
+1. Make sure you have enabled the [Extension Development](/refguide/preferences-dialog/#extension-development) setting in your app's Preferences. Alternatively, you can start Studio Pro with the `--enable-extension-development` command-line option.
 2. In your Studio Pro app, create a new module and include your development extension.
 3. Give the module a name. 
 4. Open the module's settings and in the **Export** tab, choose **Add-on module**. 

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md

@@ -37,6 +37,7 @@ For detailed information on how to get started with extensions, see [Get Started
 
 Below is a list of how-tos for you to begin with:
 
+* [How Menus Work](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/)
 * [How to Create a Dockable Pane](/apidocs-mxsdk/apidocs/web-extensibility-api-11/dockable-pane-api/)
 * [How to Interact With Local App Files](/apidocs-mxsdk/apidocs/web-extensibility-api-11/local-app-files-api/)
 * [How to Create a Menu](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu-api/)

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/get-started.md

@@ -24,7 +24,7 @@ Extensions can be built on any operating system, as the underlying framework is
 {{% /alert %}}
 
 {{% alert color="info" %}}
-Extension development is only possible by starting Studio Pro with the `--enable-extension-development` feature flag.
+Extension development is only possible by enabling the [Extension Development](/refguide/preferences-dialog/#extension-development) setting in your app's Preferences, or by starting Studio Pro with the `--enable-extension-development` feature flag.
 {{% /alert %}}
 
 ## Creating Your First Extension
@@ -75,54 +75,47 @@ Before you begin, your extension will have to get an instance of the Studio Pro
 
 In the source code, you should see the following:
 
-1. Line 6 gets an instance of the Studio Pro API by calling `getStudioProApi`.
+1. You get an instance of the Studio Pro API by calling `getStudioProApi`.
 
     ```typescript
     export const component: IComponent = {
         async loaded(componentContext) {
             const studioPro = getStudioProApi(componentContext);
 
-2. Line 7 adds a menu:
+2. A menu is added that opens a tab:
 
     ```typescript
     await studioPro.ui.extensionsMenu.add({
         menuId: "myextension.MainMenu",
         caption: "MyExtension Menu",
         subMenus: [
-            { menuId: "myextension.ShowMenu", caption: "Show tab" },
+            {
+                menuId: "myextension.ShowMenu",
+                caption: "Show tab",
+                // Open a tab when the menu item is clicked
+                action: async () => {
+                    await studioPro.ui.tabs.open(
+                        {
+                            title: "MyExtension tab"
+                        },
+                        {
+                            componentName: "extension/myextension",
+                            uiEntrypoint: "tab"
+                        }
+                    )
+                }
+            }
         ],
     });
     ```
 
-3. Line 16 opens a tab.
-
-    ```typescript
-    // Open a tab when the menu item is clicked
-    studioPro.ui.extensionsMenu.addEventListener(
-        "menuItemActivated",
-        (args) => {
-            if (args.menuId === "myextension.ShowMenu") {
-                studioPro.ui.tabs.open(
-                    {
-                        title: "MyExtension Tab"
-                    },
-                    {
-                        componentName: "extension/myextension",
-                        uiEntrypoint: "tab",
-                    }
-                );
-            }
-        }
-    );
-    ```
-
-4. If you navigate to `build-extension.mjs`, you can choose the directory to which the extension will be installed to after being built by changing line 6:
+3. If you navigate to `build-extension.mjs`, you can choose the directory where the extension will be installed to after being built by changing line 6:
 
      ```typescript
      const appDir = "C:\\TestApps\\AppTestExtensions"
      ```
 
-5. The file `.vscode\launch.json` specifies the launch configuration and enables debugging. The following lines specify how Studio Pro will be run:
+4. The file `.vscode\launch.json` specifies the launch configuration and enables debugging. The following lines specify how Studio Pro will be run:
 
      ```json
      …

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/migration-guide.md

@@ -0,0 +1,81 @@
+---
+title: "Migration Guide for Web Extensibility API Older Versions"
+linktitle: "Migration Guide"
+url: /apidocs-mxsdk/apidocs/web-extensibility-api-11/migration-guide/
+weight: 2
+---
+
+## Introduction
+
+A breaking change in the Web Extensibility API was introduced in Studio Pro 11.6, which changed the way [menus](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/) are created. This guide explains how to update your extension code after upgrading to Studio Pro 11.6 from an earlier version.
+
+## `MenuItemActivated` Event
+
+If your extension created menus using the `menuId` and the `menuItemActivated` event to trigger actions, you can now use the action that was called when the event was triggered as the actual `action` property of your menu.
+
+For example, if your code looked like this:
+
+```typescript
+
+const menuId = "myextension.menu";
+
+await studioPro.ui.extensionsMenu.add({
+            menuId: menuId,
+            caption: "My Menu",
+        });
+
+studioPro.ui.extensionsMenu.addEventListener(
+    "menuItemActivated",
+    async (args) => {
+        if (args.menuId === menuId) {
+            await studioPro.ui.messageBoxes.show("info", "My Menu was Clicked!")
+        }
+    }
+);
+```
+
+The action called when the event triggers for your menu can now be used directly as the menu action:
+
+```typescript
+await studioPro.ui.extensionsMenu.add({
+        menuId: "myextension.menu",
+        caption: "My Menu",
+        action: async () => await studioPro.ui.messageBoxes.show("info", "My Menu was Clicked!")
+    });
+```
+
+The `menuItemActivated` event no longer exists, so you cannot listen to it anymore.
+
+## Registering Commands
+
+{{%alert type="info" %}}
+The command registration API has been removed and is no longer available for Studio Pro 11.6 and above.
+{{% /alert%}}
+
+If your extension created menus by using a command Id of a pre-registered command, the action that is sent to the command registration API when registering the command can now be used directly as the action of the menu.
+
+For example, if your code looked like this:
+
+```typescript
+const commandId = "myextension.menu-command";
+
+await studioPro.app.commands.registerCommand(
+    commandId,
+    async () => await studioPro.ui.messageBoxes.show("info", "My Menu was Clicked!")
+);
+await studioPro.ui.extensionsMenu.add({ caption: "My Menu", menuId: "myextension.menu", commandId });
+```
+
+The same action sent to the command registration API can now instead become the `action` property value on the menu:
+
+```typescript
+await studioPro.ui.extensionsMenu.add({
+        menuId: "myextension.menu",
+        caption: "My Menu",
+        action: async () => await studioPro.ui.messageBoxes.show("info", "My Menu was Clicked!")
+    });
+```
+
+## Action Arguments
+
+Action arguments are also possible in the new Menu API. Review the [Menus documentation](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/) for a detailed explanation.

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/app-explorer-api.md

@@ -10,55 +10,52 @@ This how-to describes how to interact with the App Explorer in Studio Pro. In th
 
 ## Prerequisites
 
+{{% alert="info" %}}
+If you are using Studio Pro 11.0–11.5 and your extension includes menus, your existing menu code will not work when you upgrade to Studio Pro 11.6. To restore full functionality and support, upgrade to the Extensibility API 11.6 and follow the steps in the [Migration Guide](/apidocs-mxsdk/apidocs/web-extensibility-api-11/migration-guide/).
+{{% /alert%}}
+
 Before starting this how-to, make sure you have completed the following prerequisites:
 
-* This how-to uses the results of [Get Started with the Web Extensibility API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/). Complete that how-to before starting this one. 
-* Make sure you are familiar with command registration, as described in [Register a Command Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/command-api/).
+* Review [how menus work](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/) in the Web Extensibility API
+* This how-to uses the results of [Get Started with the Web Extensibility API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/). Complete that how-to before starting this one.
 
 ## Creating a Context Menu
 
 {{% alert color="info" %}}
 Use the full name of the document type to specify which type of document a menu should belong to (for example, `Microflows$Microflow` for microflows or `Pages$Page` for pages). For more information about these document type names, see [Access a Mendix Model Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/model-api/).
 {{% /alert %}}
 
-The code below does the following:
-
-1. Registers a command through the [Command API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/command-api/).
-2. Attaches the `commandId` to the new menu. 
-3. Uses the `appExplorer` API's `addContextMenu` method to add the menu to all `Microflow` document nodes.
+The code below uses the `appExplorer` API's `addContextMenu` method to add the menu to all `Microflow` document nodes. When this menu is clicked, the document's Id is sent as an argument through the `DocumentContext` argument parameter of the menu.
 
 ```typescript
-import { ComponentContext, IComponent, Menu, StudioProApi, getStudioProApi } from "@mendix/extensions-api";
+import { ComponentContext, DocumentContext, IComponent, Menu, getStudioProApi } from "@mendix/extensions-api";
 
 const extensionId = "myextension";
 
 export const component: IComponent = {
     async loaded(componentContext: ComponentContext) {
         const studioPro = getStudioProApi(componentContext);
 
-        const commandId = `${extensionId}.microflow.command`;
-        const menuId = `${commandId}.menu`;
+        const menuId = `${extensionId}.microflow.menu`;
 
-        await studioPro.app.commands.registerCommand<{ documentId: string }>(commandId, async (args: { documentId: string }) => {
+        const action = async (args: DocumentContext) => {
             await studioPro.ui.notifications.show({
-                title: `Microflow command executed`,
+                title: `Microflow action executed`,
                 message: `You clicked a context menu for a Microflow! (${args.documentId})`,
                 displayDurationInSeconds: 4
             });
-        });
+        };
 
-        const microflowMenu: Menu = { caption: `Microflow command menu`, menuId, commandId };
+        const microflowMenu: Menu<DocumentContext> = { caption: `Microflow menu`, menuId, action };
 
         await studioPro.ui.appExplorer.addContextMenu(microflowMenu, "Microflows$Microflow");
     }
-}
+};
 ```
 
-The payload of the command must be an object containing a document Id (`{ documentId: string }`). Registering the command requires the exact type of the payload, or your extension will not compile. The `documentId` will be the Id of the document the menu is attached to (in this scenario, the exact `Microflow` node in the App Explorer).
+The `DocumentContext` payload for the menu action is an object containing a document Id (`{ documentId: string }`). When creating a menu for the `appExplorer`'s `addContextMenu` method, the `DocumentContext` should be used as the context of your menu. The `documentId` will be the Id of the document the menu is attached to (in this example, the exact `Microflow` node in the App Explorer).
 
-{{% alert color="warning" %}}
-The command must be registered before creating the menu.
-{{% /alert %}}
+As explained in the [menu documentation](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/), the `DocumentContext` is not necessary to add your menu to Studio Pro. However, if it is not used, the menu will not receive the clicked document's ID.
 
 ## Extensibility Feedback
 

content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/command-api.md

@@ -193,7 +193,7 @@ To register a new document type, follow the steps below:
     import parseArgs from "minimist"
 
     const outDir = `dist/myextension`
-    const appDir = "/Users/petar.vukmirovic/Mendix/App-Guide-Test-Blob"
+    const appDir = "/Users/<USERNAME>/Mendix/App-Guide-Test-Blob"
     const extensionDirectoryName = "extensions"
 
     const entryPoints = [