Skip to content

Commit a13e03b

Browse files
authored
Merge pull request #11122 from mendix/qt-review
Review Extensibility APIs
2 parents 4be1b0e + edf71a9 commit a13e03b

3 files changed

Lines changed: 62 additions & 59 deletions

File tree

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

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,20 @@
22
title: "Using the App Explorer API"
33
linktitle: "App Explorer API"
44
url: /apidocs-mxsdk/apidocs/web-extensibility-api-11/app-explorer-api/
5+
description: "Describes how to interact with the App Explorer in Studio Pro by creating a context menu for microflows."
56
---
67

78
## Introduction
89

9-
This how-to describes how to interact with the App Explorer in Studio Pro. In this example, you create a menu which will show for each microflow in the App Explorer.
10+
This how-to describes how to interact with the App Explorer in Studio Pro. In this example, you create a menu that displays for each microflow in the App Explorer.
1011

1112
## Prerequisites
1213

1314
{{% alert="info" %}}
14-
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/).
15+
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 Extensibility API 11.6 and follow the steps in the [Migration Guide](/apidocs-mxsdk/apidocs/web-extensibility-api-11/migration-guide/).
1516
{{% /alert%}}
1617

17-
Before starting this how-to, make sure you have completed the following prerequisites:
18+
Before starting this how-to, complete the following prerequisites:
1819

1920
* Review [how menus work](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu/) in the Web Extensibility API
2021
* 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.
@@ -25,7 +26,7 @@ Before starting this how-to, make sure you have completed the following prerequi
2526
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/).
2627
{{% /alert %}}
2728

28-
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.
29+
The code below uses the `appExplorer` API `addContextMenu` method to add the menu to all `Microflow` document nodes. When you click this menu, the document ID is sent as an argument through the `DocumentContext` argument parameter of the menu.
2930

3031
```typescript
3132
import { ComponentContext, DocumentContext, IComponent, Menu, getStudioProApi } from "@mendix/extensions-api";
@@ -53,9 +54,9 @@ export const component: IComponent = {
5354
};
5455
```
5556

56-
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).
57+
The `DocumentContext` payload for the menu action is an object containing a document ID (`{ documentId: string }`). When you create a menu for the `appExplorer` `addContextMenu` method, use the `DocumentContext` as the context of your menu. The `documentId` is the ID of the document the menu is attached to (in this example, the exact `Microflow` node in the App Explorer).
5758

58-
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.
59+
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 you do not use it, the menu will not receive the clicked document ID.
5960

6061
## Extensibility Feedback
6162

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

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,12 @@
22
title: "Register New Document Types With a Corresponding Editor"
33
linktitle: "Introduce New Document Types"
44
url: /apidocs-mxsdk/apidocs/web-extensibility-api-11/custom-blob-document-api/
5+
description: "Describes how to introduce a new document type and set up a custom editor that allows users to edit documents of that type."
56
---
67

78
## Introduction
89

9-
This how-to describes how to introduce a new document type and set up a custom editor that allows users to edit documents of that type.
10+
This how-to describes how to introduce a new document type and set up a custom editor for users to edit documents of that type.
1011

1112
## Prerequisites
1213

@@ -16,13 +17,13 @@ Before starting this how-to, make sure you have completed the following prerequi
1617

1718
## Custom Document Model
1819

19-
Studio Pro allows you to extend its metamodel by adding custom document types. These documents can store arbitrary data that can be serialized as strings. If you register an editor (a user-defined UI component) for a specific document type, documents of that type will be displayed in the UI alongside any other built-in document type, such as constants, Java Actions, and pages. Specifically, they will appear in the **New Document** and **Find Advanced** dialogs, context menus for adding documents, the App Explorer, and other UI elements that show Studio Pro documents. You can register custom editors to appear either as tabs or as modal dialogs.
20+
Studio Pro allows you to extend its metamodel by adding custom document types. These documents can store arbitrary data that can be serialized as strings. When you register an editor (a user-defined UI component) for a specific document type, documents of that type appear in the UI alongside built-in document types such as constants, Java actions, and pages. They appear in the **New Document** and **Find Advanced** dialogs, context menus for adding documents, the App Explorer, and other UI elements that display Studio Pro documents. You can register custom editors to appear as tabs or as modal dialogs.
2021

2122
## Registering a New Document Type
2223

23-
To register a new document type, follow the steps below:
24+
To register a new document type, follow these steps:
2425

25-
1. Generate a new extension named `myextension` as described in the [Get Started](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/) guide.
26+
1. Generate a new extension named `myextension` as described in [Get Started with the Web Extensibility API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/).
2627
2. Replace the contents of `src/main/index.ts` with the code below:
2728

2829
```typescript {hl_lines=["8-24"]}
@@ -244,30 +245,31 @@ To register a new document type, follow the steps below:
244245

245246
### Register the Document Type
246247

247-
In `src/main/index.ts`, you begin by registering a new document type. Once registered, you can perform all CRUD operations on it. However, it will not appear in the UI until an editor is also registered.
248+
In `src/main/index.ts`, you register a new document type. After you register the document type, you can perform all CRUD operations on it. However, the document type does not appear in the UI until you also register an editor.
248249

249-
Optionally, you can provide a `readableTypeName` to display a user-friendly name in logs and the Studio Pro UI instead of the full type name. You can also customize serialization of the document contents to a string. By default, the API uses `JSON.stringify` for serialization and `JSON.parse` for deserialization.
250+
Optionally, you can provide a `readableTypeName` to display a user-friendly name in logs and the Studio Pro UI instead of the full type name. You can also customize how the document contents serialize to a string. By default, the API uses `JSON.stringify` for serialization and `JSON.parse` for deserialization.
250251

251252
### Register the Editor
252253

253-
The next call to the Studio Pro API in `src/main/index.ts` registers an editor for the document type. This does the following:
254+
The next call to the Studio Pro API in `src/main/index.ts` registers an editor for the document type. This call does the following:
254255

255-
* It registers the `editor` entry point of the extension to the document type, so the editor is shown when users interacts with the document in Studio Pro (for example, through the **App Explorer** or **Find Results**).
256-
* This editor is shown as a tab, but you can also configure it to be shown as a modal dialog.
257-
* Icons for both the light and dark themes are registered; these icons appear wherever a document icon is needed.
258-
* Note that this editor will behave like editors for other, built-in document types. For example, the `studioPro.ui.editors.editDocument` call will open the registered editor for custom documents.
256+
* Registers the `editor` entry point of the extension to the document type, so the editor appears when users interact with the document in Studio Pro (for example, through the **App Explorer** or **Find Results**)
257+
* Displays the editor as a tab, though you can also configure it to display as a modal dialog
258+
* Registers icons for both the light and dark themes; these icons appear wherever a document icon is needed
259+
260+
This editor behaves like editors for other built-in document types. For example, the `studioPro.ui.editors.editDocument` call opens the registered editor for custom documents.
259261

260262
### Changes in the Editor
261263

262-
In `src/ui/editor.tsx`, the first highlighted block of code listens for changes to documents to ensure the most recent version of the currently active document is shown. Note that the document can be changed outside the currently open editor, either by calls to the custom blob document API, or by Studio Pro operations like **Undo**.
264+
In `src/ui/editor.tsx`, the first highlighted block of code listens for changes to documents. This ensures the most recent version of the currently active document appears. The document can change outside the currently open editor, either through calls to the custom blob document API or through Studio Pro operations like **Undo**.
263265

264-
In the next highlighted block, document contents are fetched whenever a new document is opened or an existing document is updated.
266+
In the next highlighted block, document contents are fetched whenever a new document opens or an existing document updates.
265267

266-
We then provide a way to save changes.
268+
The code then provides a way to save changes.
267269

268270
### Update Build and Manifest Files
269271

270-
Highlighted text in `build-extension.mjs` and `manifest.json` shows changes necessary to ensure the `editor` entry point is built and loaded properly.
272+
The highlighted text in `build-extension.mjs` and `manifest.json` shows the changes necessary to ensure the `editor` entry point builds and loads properly.
271273

272274
## Extensibility Feedback
273275

0 commit comments

Comments
 (0)