This is an automated email from the ASF dual-hosted git repository.
tiagobento pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-kie-tools.git
The following commit(s) were added to refs/heads/main by this push:
new 9a8d8c93f83 kie-issues#1498: Add "Generate form code for human
interactions" command in the BPMN VS Code extension (#2660)
9a8d8c93f83 is described below
commit 9a8d8c93f83ca0f5b972643b53691d2a7a2ed655
Author: Luiz João Motta <[email protected]>
AuthorDate: Tue Oct 29 12:26:50 2024 -0300
kie-issues#1498: Add "Generate form code for human interactions" command in
the BPMN VS Code extension (#2660)
---
packages/bpmn-vscode-extension/package.json | 11 +-
.../src/extension/extension.ts | 7 +
.../form-code-generator-bootstrap4-theme/README.md | 10 +-
.../src/theme.ts | 7 +-
.../src/uniforms/renderForm.tsx | 2 +-
.../form-code-generator-patternfly-theme/README.md | 10 +-
.../src/theme.ts | 7 +-
.../src/uniforms/AutoForm.tsx | 5 +-
.../src/uniforms/renderForm.tsx | 2 +-
.../tests/AutoForm.test.tsx | 2 +-
.../README.md | 24 +--
.../docs/vscode-command-diagram.png | Bin 0 -> 73465 bytes
.../env/index.js} | 11 +-
.../package.json | 37 ++++
.../src/generateFormCodeCommand.ts | 234 +++++++++++++++++++++
.../tsconfig.json | 3 +
.../form-code-generator/src/generateFormCode.ts | 21 +-
packages/form-code-generator/src/types.ts | 14 +-
.../tests/__mocks__/partternfly.ts | 6 +-
.../tests/generateFormCode.test.ts | 42 ++--
packages/jbpm-form-code-generator-themes/README.md | 18 +-
.../src/jbpmBootstrap4FormCodeGeneratorTheme.ts | 14 +-
.../src/jbpmPatternflyFormCodeGeneratorTheme.ts | 14 +-
...anitizationUtil.ts => removeInvalidVarChars.ts} | 3 +-
.../jbpm-form-code-generator-themes/src/types.ts | 5 +-
.../tests/jbpmBootstrap4FormGeneratorTheme.test.ts | 28 +--
.../tests/jbpmPatternflyFormGeneratorTheme.test.ts | 28 +--
.../kie-editors-dev-vscode-extension/package.json | 13 +-
.../src/extension/extension.ts | 7 +
pnpm-lock.yaml | 40 ++++
repo/graph.dot | 6 +-
repo/graph.json | 39 +++-
32 files changed, 515 insertions(+), 155 deletions(-)
diff --git a/packages/bpmn-vscode-extension/package.json
b/packages/bpmn-vscode-extension/package.json
index 276a8cf74d4..12f1b6d6e90 100644
--- a/packages/bpmn-vscode-extension/package.json
+++ b/packages/bpmn-vscode-extension/package.json
@@ -30,6 +30,7 @@
"@kie-tools-core/i18n": "workspace:*",
"@kie-tools-core/patternfly-base": "workspace:*",
"@kie-tools-core/vscode-extension": "workspace:*",
+ "@kie-tools/form-code-generator-vscode-command": "workspace:*",
"@kie-tools/kie-bc-editors": "workspace:*"
},
"devDependencies": {
@@ -65,11 +66,15 @@
"dark": "./static/svg-icon-dark.png",
"light": "./static/svg-icon-light.png"
},
- "title": "Get BPMN Editor Preview SVG"
+ "title": "BPMN Editor: Get preview SVG"
},
{
"command": "extension.kogito.silentlyGenerateSvgBpmn",
- "title": "Generate SVG without any notification"
+ "title": "BPMN Editor: Generate SVG without any notification"
+ },
+ {
+ "command": "extension.apache.kie.bpmnEditor.generateFormCode",
+ "title": "BPMN Editor: Generate form code for human interactions from
jBPM project"
}
],
"configuration": {
@@ -93,7 +98,7 @@
},
"customEditors": [
{
- "displayName": "BPMN Editor",
+ "displayName": "Apache KIE BPMN Editor",
"selector": [
{
"filenamePattern": "*.{bpmn,bpmn2}"
diff --git a/packages/bpmn-vscode-extension/src/extension/extension.ts
b/packages/bpmn-vscode-extension/src/extension/extension.ts
index 6be21138b73..6f6438483f6 100644
--- a/packages/bpmn-vscode-extension/src/extension/extension.ts
+++ b/packages/bpmn-vscode-extension/src/extension/extension.ts
@@ -23,6 +23,7 @@ import { I18n } from "@kie-tools-core/i18n/dist/core";
import { VsCodeBackendProxy } from "@kie-tools-core/backend/dist/vscode";
import * as KogitoVsCode from "@kie-tools-core/vscode-extension";
import * as vscode from "vscode";
+import { generateFormsCommand } from
"@kie-tools/form-code-generator-vscode-command/dist/generateFormCodeCommand";
let backendProxy: VsCodeBackendProxy;
@@ -49,6 +50,12 @@ export function activate(context: vscode.ExtensionContext) {
backendProxy: backendProxy,
});
+ context.subscriptions.push(
+
vscode.commands.registerCommand("extension.apache.kie.bpmnEditor.generateFormCode",
async (args: any) =>
+ generateFormsCommand()
+ )
+ );
+
KogitoVsCode.VsCodeRecommendation.showExtendedServicesRecommendation(context);
console.info("Extension is successfully setup.");
diff --git a/packages/form-code-generator-bootstrap4-theme/README.md
b/packages/form-code-generator-bootstrap4-theme/README.md
index 46e7ba68974..1ab727ae04d 100644
--- a/packages/form-code-generator-bootstrap4-theme/README.md
+++ b/packages/form-code-generator-bootstrap4-theme/README.md
@@ -33,11 +33,11 @@ You can consume this package in two ways:
```ts
{
- id: string; // The form id
- sanitizedId: string; // The form id, any # is replaced by _
- disabled?: boolean; // Enable/disable form (read only)
- placeholder?: boolean; // Enable/disable placeholders
- schema: Bridge; // A Uniforms Bridge instance
+ id: string; // The form id
+ idWithoutInvalidTsVarChars: string; // The form id, any # is replaced by _
+ disabled?: boolean; // Enable/disable form (read only)
+ placeholder?: boolean; // Enable/disable placeholders
+ schema: Bridge; // A Uniforms Bridge instance
}
```
diff --git a/packages/form-code-generator-bootstrap4-theme/src/theme.ts
b/packages/form-code-generator-bootstrap4-theme/src/theme.ts
index 6db8be721cc..a22fd0ae0d3 100644
--- a/packages/form-code-generator-bootstrap4-theme/src/theme.ts
+++ b/packages/form-code-generator-bootstrap4-theme/src/theme.ts
@@ -35,15 +35,14 @@ export const bootstrap4FormCodeGeneratorTheme:
FormCodeGeneratorTheme<Bootstrap4
generate: (formSchema) => {
const form = renderForm({
id: formSchema.name,
- sanitizedId: formSchema.name,
schema: new JSONSchemaBridge(formSchema.schema, () => true),
disabled: false,
placeholder: true,
});
return {
- id: formSchema.name,
- assetName: `${formSchema.name}.${BOOTSTRAP4_FILE_EXT}`,
- type: BOOTSTRAP4_FILE_EXT,
+ name: formSchema.name,
+ fileName: `${formSchema.name}.${BOOTSTRAP4_FILE_EXT}`,
+ fileExt: BOOTSTRAP4_FILE_EXT,
content: unescape(form),
config: {
schema: JSON.stringify(formSchema.schema),
diff --git
a/packages/form-code-generator-bootstrap4-theme/src/uniforms/renderForm.tsx
b/packages/form-code-generator-bootstrap4-theme/src/uniforms/renderForm.tsx
index 7a814c8bc37..8f63ae0c5f2 100644
--- a/packages/form-code-generator-bootstrap4-theme/src/uniforms/renderForm.tsx
+++ b/packages/form-code-generator-bootstrap4-theme/src/uniforms/renderForm.tsx
@@ -25,7 +25,7 @@ import unescape from "lodash/unescape";
interface Args {
id: string;
- sanitizedId: string;
+ idWithoutInvalidTsVarChars?: string;
disabled?: boolean;
placeholder?: boolean;
schema: Bridge;
diff --git a/packages/form-code-generator-patternfly-theme/README.md
b/packages/form-code-generator-patternfly-theme/README.md
index 068c7f80731..709cc3a2537 100644
--- a/packages/form-code-generator-patternfly-theme/README.md
+++ b/packages/form-code-generator-patternfly-theme/README.md
@@ -33,11 +33,11 @@ You can consume this package in two ways:
```ts
{
- id: string; // The form id
- sanitizedId: string; // The form id, any # is replaced by _
- disabled?: boolean; // Enable/disable form (read only)
- placeholder?: boolean; // Enable/disable placeholders
- schema: Bridge; // A Uniforms Bridge instance
+ id: string; // The form id
+ idWithoutInvalidTsVarChars: string; // The form id, any # is replaced by _
+ disabled?: boolean; // Enable/disable form (read only)
+ placeholder?: boolean; // Enable/disable placeholders
+ schema: Bridge; // A Uniforms Bridge instance
}
```
diff --git a/packages/form-code-generator-patternfly-theme/src/theme.ts
b/packages/form-code-generator-patternfly-theme/src/theme.ts
index 470794ef479..0e511903056 100644
--- a/packages/form-code-generator-patternfly-theme/src/theme.ts
+++ b/packages/form-code-generator-patternfly-theme/src/theme.ts
@@ -31,15 +31,14 @@ export const patternflyFormCodeGeneratorTheme:
FormCodeGeneratorTheme<Patternfly
generate: (formSchema) => {
const form = renderForm({
id: formSchema.name,
- sanitizedId: formSchema.name,
schema: new JSONSchemaBridge(formSchema.schema, () => true),
disabled: false,
placeholder: true,
});
return {
- id: formSchema.name,
- assetName: `${formSchema.name}.${PATTERNFLY_FILE_EXT}`,
- type: PATTERNFLY_FILE_EXT,
+ name: formSchema.name,
+ fileName: `${formSchema.name}.${PATTERNFLY_FILE_EXT}`,
+ fileExt: PATTERNFLY_FILE_EXT,
content: unescape(form),
config: {
schema: JSON.stringify(formSchema.schema),
diff --git
a/packages/form-code-generator-patternfly-theme/src/uniforms/AutoForm.tsx
b/packages/form-code-generator-patternfly-theme/src/uniforms/AutoForm.tsx
index 11088b0a087..ffb59cc8fec 100644
--- a/packages/form-code-generator-patternfly-theme/src/uniforms/AutoForm.tsx
+++ b/packages/form-code-generator-patternfly-theme/src/uniforms/AutoForm.tsx
@@ -35,7 +35,7 @@ import { getStaticCodeBlock } from
"./staticCode/staticCodeBlocks";
export type AutoFormProps = {
id: string;
- sanitizedId: string;
+ idWithoutInvalidTsVarChars?: string;
disabled?: boolean;
placeholder?: boolean;
schema: Bridge;
@@ -54,7 +54,8 @@ const AutoForm: React.FC<AutoFormProps> = (props) => {
staticCodeArray = union(staticCodeArray, input.requiredCode);
});
- const formName = `Form${props.sanitizedId ?
`${NS_SEPARATOR}${props.sanitizedId}` : ""}`;
+ const formId = props.idWithoutInvalidTsVarChars ?? props.id;
+ const formName = `Form${formId ? `${NS_SEPARATOR}${formId}` : ""}`;
const hooks = inputs.map((input) => input.stateCode).join("\n");
const elements = inputs.map((input) => input.jsxCode).join("\n");
const staticCodeStr: string = staticCodeArray.map((id) =>
JSON.stringify(getStaticCodeBlock(id))).join("\n");
diff --git
a/packages/form-code-generator-patternfly-theme/src/uniforms/renderForm.tsx
b/packages/form-code-generator-patternfly-theme/src/uniforms/renderForm.tsx
index 7a814c8bc37..8f63ae0c5f2 100644
--- a/packages/form-code-generator-patternfly-theme/src/uniforms/renderForm.tsx
+++ b/packages/form-code-generator-patternfly-theme/src/uniforms/renderForm.tsx
@@ -25,7 +25,7 @@ import unescape from "lodash/unescape";
interface Args {
id: string;
- sanitizedId: string;
+ idWithoutInvalidTsVarChars?: string;
disabled?: boolean;
placeholder?: boolean;
schema: Bridge;
diff --git
a/packages/form-code-generator-patternfly-theme/tests/AutoForm.test.tsx
b/packages/form-code-generator-patternfly-theme/tests/AutoForm.test.tsx
index 263fef45ddc..bfcf22fc40f 100644
--- a/packages/form-code-generator-patternfly-theme/tests/AutoForm.test.tsx
+++ b/packages/form-code-generator-patternfly-theme/tests/AutoForm.test.tsx
@@ -76,7 +76,7 @@ const schema = {
const props: AutoFormProps = {
id: "HRInterview",
- sanitizedId: "HRInterview",
+ idWithoutInvalidTsVarChars: "HRInterview",
schema: createSchema(schema),
disabled: false,
placeholder: true,
diff --git a/packages/form-code-generator-bootstrap4-theme/README.md
b/packages/form-code-generator-vscode-command/README.md
similarity index 59%
copy from packages/form-code-generator-bootstrap4-theme/README.md
copy to packages/form-code-generator-vscode-command/README.md
index 46e7ba68974..39f84cb4bd9 100644
--- a/packages/form-code-generator-bootstrap4-theme/README.md
+++ b/packages/form-code-generator-vscode-command/README.md
@@ -15,38 +15,26 @@
under the License.
-->
-## Form Code Generator Bootstrap4 Theme
+## Form Code Generator VS Code command
-This package is the Bootstrap4 theme for the
[form-code-generator](../form-code-generator/README.md) package.
+This package is a VS Code command for generating form code from jBPM projects.
## How it works?
-This package generates the form code of a [Uniforms](https://uniforms.tools/)
form using the Bootstrap4 style. [Uniforms](https://uniforms.tools/) is a
library that autogenerates forms based on schemas and supports multiple themes.
This package makes its own theme, describing the code that each field should
have. After it, the form is rendered using `ReactDOMServer.renderToString`
getting the form code.
+The command provides a user-friendly interface for generating form code from
jBPM projects. It interacts with the file system getting the jBPM JSON Schemas
that are generated during compile time, and feeding them to the
"form-code-generator" that will generate the form code using one of two themes:
Bootstrap4 or Patternfly.
## Usage
-You can consume this package in two ways:
+The command name will change depending on the host extension, but it should be
available in the command palette. After starting the command, the user will be
prompted with a few questions, which can be represented using the following
diagram:
-1. The `dist/theme.ts` file exports the `bootstrap4FormCodeGeneratorTheme`
which is a theme for the `form-code-generator` package. This theme implements
the `FormCodeGeneratorTheme` interface, and its `generate` function uses JSON
Schemas to generate the form code.
-
-2. You can create your own theme, and implement the `FormCodeGeneratorTheme`
interface, and make the `generate` fucntion use another type of schema that is
supported by [Uniforms](https://uniforms.tools/). To do so, you must use the
`dist/uniforms/renderForm` function, which will receive a [Uniforms
Bridge](https://uniforms.tools/docs/api-bridges/) and some parameters:
-
-```ts
-{
- id: string; // The form id
- sanitizedId: string; // The form id, any # is replaced by _
- disabled?: boolean; // Enable/disable form (read only)
- placeholder?: boolean; // Enable/disable placeholders
- schema: Bridge; // A Uniforms Bridge instance
-}
-```
+
## Build
In order to build the library you must run the following command in the root
folder of the repository:
```shell script
-pnpm -F @kie-tools/form-code-generator-bootstrap4-theme... build:prod
+pnpm -F @kie-tools/form-code-generator-vscode-command... build:prod
```
---
diff --git
a/packages/form-code-generator-vscode-command/docs/vscode-command-diagram.png
b/packages/form-code-generator-vscode-command/docs/vscode-command-diagram.png
new file mode 100644
index 00000000000..ef42a5d8d2b
Binary files /dev/null and
b/packages/form-code-generator-vscode-command/docs/vscode-command-diagram.png
differ
diff --git
a/packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
b/packages/form-code-generator-vscode-command/env/index.js
similarity index 79%
copy from packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
copy to packages/form-code-generator-vscode-command/env/index.js
index 6066c8a5306..61bc742bd66 100644
--- a/packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
+++ b/packages/form-code-generator-vscode-command/env/index.js
@@ -17,6 +17,11 @@
* under the License.
*/
-export const inputSanitizationUtil = (unsanitizedString: string) => {
- return unsanitizedString.replaceAll("#", "_");
-};
+const { varsWithName, composeEnv } = require("@kie-tools-scripts/build-env");
+
+module.exports = composeEnv([require("@kie-tools/root-env/env")], {
+ vars: varsWithName({}),
+ get env() {
+ return {};
+ },
+});
diff --git a/packages/form-code-generator-vscode-command/package.json
b/packages/form-code-generator-vscode-command/package.json
new file mode 100644
index 00000000000..d3651ad6ffc
--- /dev/null
+++ b/packages/form-code-generator-vscode-command/package.json
@@ -0,0 +1,37 @@
+{
+ "name": "@kie-tools/form-code-generator-vscode-command",
+ "version": "0.0.0",
+ "description": "",
+ "license": "Apache-2.0",
+ "keywords": [],
+ "homepage": "https://github.com/apache/incubator-kie-tools";,
+ "repository": {
+ "type": "git",
+ "url": "https://github.com/apache/incubator-kie-tools.git";
+ },
+ "bugs": {
+ "url": "https://github.com/apache/incubator-kie-tools/issues";
+ },
+ "files": [
+ "dist"
+ ],
+ "scripts": {
+ "build:dev": "rimraf dist && tsc",
+ "build:prod": "pnpm lint && rimraf dist && tsc",
+ "lint": "run-script-if --bool \"$(build-env linters.run)\" --then
\"kie-tools--eslint ./src\""
+ },
+ "dependencies": {
+ "@kie-tools/form-code-generator": "workspace:*",
+ "@kie-tools/form-code-generator-bootstrap4-theme": "workspace:*",
+ "@kie-tools/form-code-generator-patternfly-theme": "workspace:*",
+ "@kie-tools/jbpm-form-code-generator-themes": "workspace:*"
+ },
+ "devDependencies": {
+ "@kie-tools/eslint": "workspace:*",
+ "@kie-tools/root-env": "workspace:*",
+ "@kie-tools/tsconfig": "workspace:*",
+ "@types/vscode": "1.67.0",
+ "rimraf": "^3.0.2",
+ "typescript": "^5.5.3"
+ }
+}
diff --git
a/packages/form-code-generator-vscode-command/src/generateFormCodeCommand.ts
b/packages/form-code-generator-vscode-command/src/generateFormCodeCommand.ts
new file mode 100644
index 00000000000..6e09ac4c42d
--- /dev/null
+++ b/packages/form-code-generator-vscode-command/src/generateFormCodeCommand.ts
@@ -0,0 +1,234 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import * as vscode from "vscode";
+import * as fs from "fs";
+import * as path from "path";
+import { generateFormCode } from
"@kie-tools/form-code-generator/dist/generateFormCode";
+import { removeInvalidVarChars } from
"@kie-tools/jbpm-form-code-generator-themes/dist/removeInvalidVarChars";
+import { jbpmBootstrap4FormCodeGeneratorTheme } from
"@kie-tools/jbpm-form-code-generator-themes/dist/jbpmBootstrap4FormCodeGeneratorTheme";
+import { jbpmPatternflyFormCodeGeneratorTheme } from
"@kie-tools/jbpm-form-code-generator-themes/dist/jbpmPatternflyFormCodeGeneratorTheme";
+import { FormSchema } from "@kie-tools/form-code-generator/dist/types";
+import { PATTERNFLY_FILE_EXT } from
"@kie-tools/form-code-generator-patternfly-theme/dist/theme";
+import { BOOTSTRAP4_FILE_EXT } from
"@kie-tools/form-code-generator-bootstrap4-theme/dist/theme";
+
+const FORM_CODE_GENERATION_DEST_PATH = "src/main/resources/forms";
+const JSON_SCHEMA_PATH = "target/classes/META-INF/jsonSchema";
+
+export async function generateFormsCommand() {
+ // Get workspace path as default value
+ const defaultPath = vscode.workspace.workspaceFolders ?
vscode.workspace.workspaceFolders[0].uri.fsPath : undefined;
+
+ // Select project path
+ const projectUri = await vscode.window.showOpenDialog({
+ canSelectFiles: false,
+ canSelectFolders: true,
+ canSelectMany: false,
+ title: "Select Project Folder",
+ defaultUri: defaultPath ? vscode.Uri.file(defaultPath) : undefined,
+ });
+
+ // Check if a path was selected
+ if (projectUri === undefined || projectUri[0] === undefined) {
+ return;
+ }
+
+ // Get project path
+ const projectPath = projectUri[0].fsPath;
+
+ // Check if project has a target folder
+ if (fs.existsSync(`${projectPath}/target`) === false) {
+ vscode.window.showErrorMessage(
+ `Couldn't find project's "target" folder. Please, install the project
before using the command.`
+ );
+ return;
+ }
+ // Check if project has the JSON Schemas folder
+ if (fs.existsSync(`${projectPath}/${JSON_SCHEMA_PATH}`) === false) {
+ vscode.window.showErrorMessage(
+ `Couldn't find any JSON Schema, did you install your project ("mvn clean
install") using the jbpm dependency?`
+ );
+ return;
+ }
+
+ // Select theme
+ const theme = await vscode.window.showQuickPick(["Bootstrap4",
"Patternfly"], {
+ placeHolder: "Select the form theme",
+ });
+ // Check if a theme was selected
+ if (theme === undefined) {
+ return;
+ }
+
+ const formSchemas: FormSchema[] = await getFormSchemas(projectPath);
+
+ const existingFiles: { fileName: string; ext: string }[] = [];
+ for (const { name: fileName } of formSchemas) {
+ // Check if form `tsx` or `html` file already exists
+ if (
+ fs.existsSync(
+
`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}/${removeInvalidVarChars(path.parse(fileName).name)}.${PATTERNFLY_FILE_EXT}`
+ )
+ ) {
+ existingFiles.push({ fileName, ext: PATTERNFLY_FILE_EXT });
+ }
+ if (
+ fs.existsSync(
+
`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}/${removeInvalidVarChars(path.parse(fileName).name)}.${BOOTSTRAP4_FILE_EXT}`
+ )
+ ) {
+ existingFiles.push({ fileName, ext: BOOTSTRAP4_FILE_EXT });
+ }
+ }
+
+ if (existingFiles.length === 0) {
+ saveFormCode(projectPath, theme, formSchemas);
+ return;
+ }
+
+ const shouldOverride = await vscode.window.showQuickPick(["Override",
"Cancel"], {
+ placeHolder: "You already have custom forms in this project. Do you want
to override them?",
+ });
+ if (shouldOverride === "Override") {
+ // Remove previous files.
+ // In case the user has `tsx` files and are generating `html` files, the
`tsx` files should be removed
+ existingFiles.forEach(({ fileName, ext }) => {
+ fs.rmSync(
+
`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}/${removeInvalidVarChars(path.parse(fileName).name)}.${ext}`
+ );
+ });
+ saveFormCode(projectPath, theme, formSchemas);
+ }
+ return;
+}
+
+async function getFormSchemas(projectPath: string): Promise<FormSchema[]> {
+ const GENERATE_FOR_ALL_HUMAN_INTERACTIONS = "Generate form code for all
human interactions";
+ const GENERATE_FOR_SPECIFIC_HUMAN_INTERACTIONS = "Generate form code for
specific human interactions";
+
+ const generationChoice = await vscode.window.showQuickPick(
+ [GENERATE_FOR_ALL_HUMAN_INTERACTIONS,
GENERATE_FOR_SPECIFIC_HUMAN_INTERACTIONS],
+ {
+ placeHolder: "Select an option",
+ }
+ );
+
+ const jsonSchemaFilesName =
fs.readdirSync(`${projectPath}/${JSON_SCHEMA_PATH}`);
+ if (generationChoice === GENERATE_FOR_SPECIFIC_HUMAN_INTERACTIONS) {
+ const selectedOptions = await vscode.window.showQuickPick(
+ jsonSchemaFilesName.map((jsonSchemaFile) => ({
+ label: path.parse(jsonSchemaFile).name,
+ })),
+ {
+ canPickMany: true,
+ placeHolder: "Choose the human interactions",
+ }
+ );
+
+ if (selectedOptions === undefined || selectedOptions.length === 0) {
+ return [];
+ }
+
+ return readAndParseJsonSchemas(
+ projectPath,
+ selectedOptions.reduce(
+ (jsonSchemaFilesName: string[], option) =>
+ option.label ? [...jsonSchemaFilesName, `${option.label}.json`] :
jsonSchemaFilesName,
+ []
+ )
+ );
+ }
+
+ if (generationChoice === GENERATE_FOR_ALL_HUMAN_INTERACTIONS) {
+ return readAndParseJsonSchemas(projectPath, jsonSchemaFilesName);
+ }
+
+ return [];
+}
+
+function readAndParseJsonSchemas(projectPath: string, jsonSchemaFilesName:
string[]) {
+ const formSchemas: FormSchema[] = [];
+ const failedParsingFilesName: string[] = [];
+ for (const jsonSchemaFileName of jsonSchemaFilesName) {
+ try {
+ formSchemas.push({
+ name: path.parse(jsonSchemaFileName).name,
+ schema:
JSON.parse(fs.readFileSync(`${projectPath}/${JSON_SCHEMA_PATH}/${jsonSchemaFileName}`,
"utf-8")),
+ });
+ } catch (error) {
+ console.error(`Error while parsing ${jsonSchemaFileName}:`, error);
+ failedParsingFilesName.push(jsonSchemaFileName);
+ }
+ }
+ if (failedParsingFilesName.length > 0) {
+ vscode.window.showErrorMessage(
+ "JSON Schema parsing failed for the following files:",
+ failedParsingFilesName.join(", ")
+ );
+ }
+ return formSchemas;
+}
+
+function saveFormCode(projectPath: string, theme: string, formSchemas:
FormSchema[]) {
+ const formCode =
+ theme.toLowerCase() === "bootstrap4"
+ ? generateFormCode({ formCodeGeneratorTheme:
jbpmBootstrap4FormCodeGeneratorTheme, formSchemas })
+ : theme.toLowerCase() === "patternfly"
+ ? generateFormCode({ formCodeGeneratorTheme:
jbpmPatternflyFormCodeGeneratorTheme, formSchemas })
+ : undefined;
+
+ if (formCode === undefined) {
+ vscode.window.showErrorMessage(`The "${theme}" theme isn't available.`);
+ return undefined;
+ }
+
+ // Save form assets
+ const formAssets = formCode.reduce((acc, { formAsset }) => (formAsset !==
undefined ? [...acc, formAsset] : acc), []);
+ if (formAssets.length > 0) {
+ // Create FORMS_PATH directory if doesn't exist
+ if (fs.existsSync(`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}`) ===
false) {
+ fs.mkdirSync(`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}`);
+ }
+ // Create form code and config files
+ formAssets.forEach((formAsset) => {
+ fs.writeFileSync(
+
`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}/${formAsset.fileNameWithoutInvalidVarChars}`,
+ formAsset.content
+ );
+ fs.writeFileSync(
+
`${projectPath}/${FORM_CODE_GENERATION_DEST_PATH}/${formAsset.nameWithoutInvalidTsVarChars}.config`,
+ JSON.stringify(formAsset.config, null, 2)
+ );
+ });
+ vscode.window.showInformationMessage(
+ `Success generating form code for the following files:
${formAssets.map((formAsset) => formAsset.fileName).join(", ")}`
+ );
+ }
+
+ // Show errors
+ const formErrors = formCode.reduce(
+ (acc, { formError }) => (formError?.error !== undefined ? [...acc,
formError] : acc),
+ []
+ );
+ if (formErrors.length > 0) {
+ vscode.window.showErrorMessage(
+ `Error generating the form code for the following files:
${formErrors.map((formError) => formError.fileName).join(", ")}`
+ );
+ }
+}
diff --git a/packages/form-code-generator-vscode-command/tsconfig.json
b/packages/form-code-generator-vscode-command/tsconfig.json
new file mode 100644
index 00000000000..8cb7f1eed0e
--- /dev/null
+++ b/packages/form-code-generator-vscode-command/tsconfig.json
@@ -0,0 +1,3 @@
+{
+ "extends": "@kie-tools/tsconfig/tsconfig.esm.json"
+}
diff --git a/packages/form-code-generator/src/generateFormCode.ts
b/packages/form-code-generator/src/generateFormCode.ts
index 9db2d57ea5f..058d4fb1e07 100644
--- a/packages/form-code-generator/src/generateFormCode.ts
+++ b/packages/form-code-generator/src/generateFormCode.ts
@@ -34,13 +34,16 @@ export function generateFormCode<FormThemeFileExt extends
string, CustomFormAsse
formCodeGeneratorTheme: formGeneratorTheme,
formSchemas,
}: FormCodeGenerator<FormThemeFileExt, CustomFormAsset>) {
- return formSchemas.reduce((generatedForms, formSchema) => {
- try {
- generatedForms.push({ formAsset:
formGeneratorTheme.generate(formSchema), formError: undefined });
- } catch (error) {
- console.error(`Error generating form: ${error}`);
- generatedForms.push({ formAsset: undefined, formError: error });
- }
- return generatedForms;
- }, [] as FormCodeGeneration<FormThemeFileExt>[]);
+ return formSchemas.reduce(
+ (generatedForms, formSchema) => {
+ try {
+ generatedForms.push({ formAsset:
formGeneratorTheme.generate(formSchema), formError: undefined });
+ } catch (error) {
+ console.trace(`Error generating form: `, error);
+ generatedForms.push({ formAsset: undefined, formError: error });
+ }
+ return generatedForms;
+ },
+ [] as FormCodeGeneration<FormThemeFileExt, CustomFormAsset>[]
+ );
}
diff --git a/packages/form-code-generator/src/types.ts
b/packages/form-code-generator/src/types.ts
index 9943e2cde55..e0bdcec459d 100644
--- a/packages/form-code-generator/src/types.ts
+++ b/packages/form-code-generator/src/types.ts
@@ -33,15 +33,16 @@ export interface FormConfiguration {
}
export interface FormAsset<FormThemeFileExt extends string> {
- id: string;
- assetName: string;
+ name: string;
+ fileName: string;
content: string;
- type: FormThemeFileExt;
+ fileExt: FormThemeFileExt;
config: FormConfiguration;
}
export interface FormCodeGenerationError {
error: Error;
+ fileName: string;
}
export interface FormCodeGeneratorTheme<
@@ -51,7 +52,10 @@ export interface FormCodeGeneratorTheme<
generate: (formSchema: FormSchema) => CustomFormAsset;
}
-export interface FormCodeGeneration<FormThemeFileExt extends string> {
- formAsset: FormAsset<FormThemeFileExt> | undefined;
+export interface FormCodeGeneration<
+ FormThemeFileExt extends string,
+ CustomFormAsset extends FormAsset<FormThemeFileExt>,
+> {
+ formAsset: CustomFormAsset | undefined;
formError: FormCodeGenerationError | undefined;
}
diff --git a/packages/form-code-generator/tests/__mocks__/partternfly.ts
b/packages/form-code-generator/tests/__mocks__/partternfly.ts
index d54abc89d91..2b263ea6589 100644
--- a/packages/form-code-generator/tests/__mocks__/partternfly.ts
+++ b/packages/form-code-generator/tests/__mocks__/partternfly.ts
@@ -22,10 +22,10 @@ import { FormCodeGeneratorTheme, FormSchema } from
"../../dist/types";
export const dummyPatternflyTheme: FormCodeGeneratorTheme<"tsx"> = {
generate({ schema, name }: FormSchema) {
return {
- id: name,
+ name,
content: name,
- type: "tsx",
- assetName: `${name}.tsx`,
+ fileExt: "tsx",
+ fileName: `${name}.tsx`,
config: {
schema: JSON.stringify(schema),
resources: { styles: {}, scripts: {} },
diff --git a/packages/form-code-generator/tests/generateFormCode.test.ts
b/packages/form-code-generator/tests/generateFormCode.test.ts
index ca849e5b749..1cd4d899749 100644
--- a/packages/form-code-generator/tests/generateFormCode.test.ts
+++ b/packages/form-code-generator/tests/generateFormCode.test.ts
@@ -28,11 +28,11 @@ describe("FormCodeGenerator tests", () => {
formSchemas: [{ name: "", schema: {} }],
formCodeGeneratorTheme: {
generate: ({ name, schema }) => ({
- assetName: "",
+ fileName: "",
config: { schema: "", resources: { scripts: {}, styles: {} } },
content: "",
- id: "",
- type: "",
+ name: "",
+ fileExt: "",
}),
},
});
@@ -41,10 +41,10 @@ describe("FormCodeGenerator tests", () => {
expect(formCode[0]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "",
- assetName: "",
+ name: "",
+ fileName: "",
config: { resources: { scripts: {}, styles: {} }, schema: "" },
- type: "",
+ fileExt: "",
}),
formError: undefined,
})
@@ -61,10 +61,10 @@ describe("FormCodeGenerator tests", () => {
expect(formCode[0]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "test",
- assetName: "test.tsx",
+ name: "test",
+ fileName: "test.tsx",
config: { resources: { scripts: {}, styles: {} }, schema: "{}" },
- type: "tsx",
+ fileExt: "tsx",
}),
formError: undefined,
})
@@ -84,10 +84,10 @@ describe("FormCodeGenerator tests", () => {
expect(formCode[0]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "Apply#For#Visa",
- assetName: "Apply#For#Visa.tsx",
+ name: "Apply#For#Visa",
+ fileName: "Apply#For#Visa.tsx",
config: { resources: { scripts: {}, styles: {} }, schema:
JSON.stringify(ApplyForVisaSchema) },
- type: "tsx",
+ fileExt: "tsx",
}),
formError: undefined,
})
@@ -95,10 +95,10 @@ describe("FormCodeGenerator tests", () => {
expect(formCode[1]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "ConfirmTravel",
- assetName: "ConfirmTravel.tsx",
+ name: "ConfirmTravel",
+ fileName: "ConfirmTravel.tsx",
config: { resources: { scripts: {}, styles: {} }, schema:
JSON.stringify(ConfirmTravelSchema) },
- type: "tsx",
+ fileExt: "tsx",
}),
formError: undefined,
})
@@ -118,10 +118,10 @@ describe("FormCodeGenerator tests", () => {
}
return {
- id: schema.name,
+ name: schema.name,
content: schema.name,
- type: "txt",
- assetName: `${schema.name}.txt`,
+ fileExt: "txt",
+ fileName: `${schema.name}.txt`,
config: {
schema: "",
resources: { styles: {}, scripts: {} },
@@ -139,10 +139,10 @@ describe("FormCodeGenerator tests", () => {
expect(formCode[1]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "ConfirmTravel",
- assetName: "ConfirmTravel.txt",
+ name: "ConfirmTravel",
+ fileName: "ConfirmTravel.txt",
config: { resources: { scripts: {}, styles: {} }, schema: "" },
- type: "txt",
+ fileExt: "txt",
}),
formError: undefined,
})
diff --git a/packages/jbpm-form-code-generator-themes/README.md
b/packages/jbpm-form-code-generator-themes/README.md
index 625f509bb69..0bd1d8c0b06 100644
--- a/packages/jbpm-form-code-generator-themes/README.md
+++ b/packages/jbpm-form-code-generator-themes/README.md
@@ -51,17 +51,17 @@ The `jbpmFormsCode` will give you the following object:
```ts
{
- id: string, // The form id
- sanitizedId: string, // The same value as "id" but any "#"
occorrence is replaced by "_"
- assetName: string, // The form name
- sanitizedAssetName: string, // The same value as "assetName" but any "#"
occorrence is replaced by "_"
- type: string, // The file extension of the code
- content: string, // The unescaped form code
+ name: string, // The form id
+ nameWithoutInvalidTsVarChars: string, // The same value as "id" but any
"#" occorrence is replaced by "_"
+ fileName: string, // The form name
+ fileNameWithoutInvalidVarChars: string, // The same value as
"assetName" but any "#" occorrence is replaced by "_"
+ fileExt: string, // The file extension of the code
+ content: string, // The unescaped form code
config: {
- schema: string, // The stringifyied JSON Schema
+ schema: string, // The stringifyied JSON Schema
resources: {
- styles: {}, // Any style that need to be loaded
- scripts: {}, // Any script that need to be loaded
+ styles: {}, // Any style that need to be loaded
+ scripts: {}, // Any script that need to be
loaded
},
},
}
diff --git
a/packages/jbpm-form-code-generator-themes/src/jbpmBootstrap4FormCodeGeneratorTheme.ts
b/packages/jbpm-form-code-generator-themes/src/jbpmBootstrap4FormCodeGeneratorTheme.ts
index ad2f0cdbba6..f906af79f3c 100644
---
a/packages/jbpm-form-code-generator-themes/src/jbpmBootstrap4FormCodeGeneratorTheme.ts
+++
b/packages/jbpm-form-code-generator-themes/src/jbpmBootstrap4FormCodeGeneratorTheme.ts
@@ -29,7 +29,7 @@ import {
import unescape from "lodash/unescape";
import JSONSchemaBridge from "uniforms-bridge-json-schema";
import { getUniformsSchema } from "./getUniformsSchema";
-import { inputSanitizationUtil } from "./inputSanitizationUtil";
+import { removeInvalidVarChars } from "./removeInvalidVarChars";
import { JbpmFormAssetBase } from "./types";
export interface Bootstrap4FormAsset extends FormAsset<Bootstrap4FileExt>,
JbpmFormAssetBase {}
@@ -39,17 +39,17 @@ export const jbpmBootstrap4FormCodeGeneratorTheme:
FormCodeGeneratorTheme<Bootst
const uniformsSchema = getUniformsSchema(formSchema.schema);
const form = renderForm({
id: formSchema.name,
- sanitizedId: inputSanitizationUtil(formSchema.name),
+ idWithoutInvalidTsVarChars: removeInvalidVarChars(formSchema.name),
schema: new JSONSchemaBridge(uniformsSchema, () => true),
disabled: false,
placeholder: true,
});
return {
- id: formSchema.name,
- sanitizedId: inputSanitizationUtil(formSchema.name),
- assetName: `${formSchema.name}.${BOOTSTRAP4_FILE_EXT}`,
- sanitizedAssetName:
`${inputSanitizationUtil(formSchema.name)}.${BOOTSTRAP4_FILE_EXT}`,
- type: BOOTSTRAP4_FILE_EXT,
+ name: formSchema.name,
+ nameWithoutInvalidTsVarChars: removeInvalidVarChars(formSchema.name),
+ fileName: `${formSchema.name}.${BOOTSTRAP4_FILE_EXT}`,
+ fileNameWithoutInvalidVarChars:
`${removeInvalidVarChars(formSchema.name)}.${BOOTSTRAP4_FILE_EXT}`,
+ fileExt: BOOTSTRAP4_FILE_EXT,
content: unescape(form),
config: {
schema: JSON.stringify(formSchema.schema),
diff --git
a/packages/jbpm-form-code-generator-themes/src/jbpmPatternflyFormCodeGeneratorTheme.ts
b/packages/jbpm-form-code-generator-themes/src/jbpmPatternflyFormCodeGeneratorTheme.ts
index e6002898489..548f93b6fd5 100644
---
a/packages/jbpm-form-code-generator-themes/src/jbpmPatternflyFormCodeGeneratorTheme.ts
+++
b/packages/jbpm-form-code-generator-themes/src/jbpmPatternflyFormCodeGeneratorTheme.ts
@@ -23,7 +23,7 @@ import { PATTERNFLY_FILE_EXT, PatternflyFileExt } from
"@kie-tools/form-code-gen
import unescape from "lodash/unescape";
import JSONSchemaBridge from "uniforms-bridge-json-schema";
import { getUniformsSchema } from "./getUniformsSchema";
-import { inputSanitizationUtil } from "./inputSanitizationUtil";
+import { removeInvalidVarChars } from "./removeInvalidVarChars";
import { JbpmFormAssetBase } from "./types";
export interface PatternflyFormAsset extends FormAsset<PatternflyFileExt>,
JbpmFormAssetBase {}
@@ -33,17 +33,17 @@ export const jbpmPatternflyFormCodeGeneratorTheme:
FormCodeGeneratorTheme<Patter
const uniformsSchema = getUniformsSchema(formSchema.schema);
const form = renderForm({
id: formSchema.name,
- sanitizedId: inputSanitizationUtil(formSchema.name),
+ idWithoutInvalidTsVarChars: removeInvalidVarChars(formSchema.name),
schema: new JSONSchemaBridge(uniformsSchema, () => true),
disabled: false,
placeholder: true,
});
return {
- id: formSchema.name,
- sanitizedId: inputSanitizationUtil(formSchema.name),
- assetName: `${formSchema.name}.${PATTERNFLY_FILE_EXT}`,
- sanitizedAssetName:
`${inputSanitizationUtil(formSchema.name)}.${PATTERNFLY_FILE_EXT}`,
- type: PATTERNFLY_FILE_EXT,
+ name: formSchema.name,
+ nameWithoutInvalidTsVarChars: removeInvalidVarChars(formSchema.name),
+ fileName: `${formSchema.name}.${PATTERNFLY_FILE_EXT}`,
+ fileNameWithoutInvalidVarChars:
`${removeInvalidVarChars(formSchema.name)}.${PATTERNFLY_FILE_EXT}`,
+ fileExt: PATTERNFLY_FILE_EXT,
content: unescape(form),
config: {
schema: JSON.stringify(formSchema.schema),
diff --git
a/packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
b/packages/jbpm-form-code-generator-themes/src/removeInvalidVarChars.ts
similarity index 87%
rename from
packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
rename to packages/jbpm-form-code-generator-themes/src/removeInvalidVarChars.ts
index 6066c8a5306..2a3e27bb38f 100644
--- a/packages/jbpm-form-code-generator-themes/src/inputSanitizationUtil.ts
+++ b/packages/jbpm-form-code-generator-themes/src/removeInvalidVarChars.ts
@@ -17,6 +17,7 @@
* under the License.
*/
-export const inputSanitizationUtil = (unsanitizedString: string) => {
+// Remove character that are invalid during variable declaration
+export const removeInvalidVarChars = (unsanitizedString: string) => {
return unsanitizedString.replaceAll("#", "_");
};
diff --git a/packages/jbpm-form-code-generator-themes/src/types.ts
b/packages/jbpm-form-code-generator-themes/src/types.ts
index 8560d8fb3bf..2f6075b2e0a 100644
--- a/packages/jbpm-form-code-generator-themes/src/types.ts
+++ b/packages/jbpm-form-code-generator-themes/src/types.ts
@@ -17,7 +17,8 @@
* under the License.
*/
+// https://github.com/apache/incubator-kie-issues/issues/528
export interface JbpmFormAssetBase {
- sanitizedId: string;
- sanitizedAssetName: string;
+ nameWithoutInvalidTsVarChars: string;
+ fileNameWithoutInvalidVarChars: string;
}
diff --git
a/packages/jbpm-form-code-generator-themes/tests/jbpmBootstrap4FormGeneratorTheme.test.ts
b/packages/jbpm-form-code-generator-themes/tests/jbpmBootstrap4FormGeneratorTheme.test.ts
index f5b556f6d2f..7392c57afa2 100644
---
a/packages/jbpm-form-code-generator-themes/tests/jbpmBootstrap4FormGeneratorTheme.test.ts
+++
b/packages/jbpm-form-code-generator-themes/tests/jbpmBootstrap4FormGeneratorTheme.test.ts
@@ -34,10 +34,10 @@ describe("jbpmBootstrap4FormCodeGeneratorTheme tests", ()
=> {
});
expect(formAsset).not.toBeUndefined();
- expect(formAsset.id).toStrictEqual("ApplyFor#Visa");
- expect(formAsset.sanitizedId).toStrictEqual("ApplyFor_Visa");
- expect(formAsset.assetName).toStrictEqual("ApplyFor#Visa.html");
- expect(formAsset.sanitizedAssetName).toStrictEqual("ApplyFor_Visa.html");
+ expect(formAsset.name).toStrictEqual("ApplyFor#Visa");
+
expect(formAsset.nameWithoutInvalidTsVarChars).toStrictEqual("ApplyFor_Visa");
+ expect(formAsset.fileName).toStrictEqual("ApplyFor#Visa.html");
+
expect(formAsset.fileNameWithoutInvalidVarChars).toStrictEqual("ApplyFor_Visa.html");
expect(formAsset.content).not.toBeUndefined();
expect(formAsset.config).not.toBeUndefined();
expect(formAsset.config).toMatchObject({
@@ -67,10 +67,10 @@ describe("jbpmBootstrap4FormCodeGeneratorTheme tests", ()
=> {
expect(formAssets[0]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "Apply#For#Visa",
- sanitizedId: "Apply_For_Visa",
- assetName: "Apply#For#Visa.html",
- sanitizedAssetName: "Apply_For_Visa.html",
+ name: "Apply#For#Visa",
+ nameWithoutInvalidTsVarChars: "Apply_For_Visa",
+ fileName: "Apply#For#Visa.html",
+ fileNameWithoutInvalidVarChars: "Apply_For_Visa.html",
config: {
resources: {
styles: {
@@ -83,7 +83,7 @@ describe("jbpmBootstrap4FormCodeGeneratorTheme tests", () => {
},
schema: JSON.stringify(ApplyForVisaSchema),
},
- type: "html",
+ fileExt: "html",
}),
formError: undefined,
})
@@ -92,10 +92,10 @@ describe("jbpmBootstrap4FormCodeGeneratorTheme tests", ()
=> {
expect(formAssets[1]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "ConfirmTravel",
- sanitizedId: "ConfirmTravel",
- assetName: "ConfirmTravel.html",
- sanitizedAssetName: "ConfirmTravel.html",
+ name: "ConfirmTravel",
+ nameWithoutInvalidTsVarChars: "ConfirmTravel",
+ fileName: "ConfirmTravel.html",
+ fileNameWithoutInvalidVarChars: "ConfirmTravel.html",
config: {
resources: {
styles: {
@@ -108,7 +108,7 @@ describe("jbpmBootstrap4FormCodeGeneratorTheme tests", ()
=> {
},
schema: JSON.stringify(ConfirmTravelSchema),
},
- type: "html",
+ fileExt: "html",
}),
formError: undefined,
})
diff --git
a/packages/jbpm-form-code-generator-themes/tests/jbpmPatternflyFormGeneratorTheme.test.ts
b/packages/jbpm-form-code-generator-themes/tests/jbpmPatternflyFormGeneratorTheme.test.ts
index 371e8827e06..f7c112a044d 100644
---
a/packages/jbpm-form-code-generator-themes/tests/jbpmPatternflyFormGeneratorTheme.test.ts
+++
b/packages/jbpm-form-code-generator-themes/tests/jbpmPatternflyFormGeneratorTheme.test.ts
@@ -29,10 +29,10 @@ describe("jbpmPatternflyFormCodeGeneratorTheme tests", ()
=> {
});
expect(formAsset).not.toBeUndefined();
- expect(formAsset.id).toStrictEqual("ApplyFor#Visa");
- expect(formAsset.sanitizedId).toStrictEqual("ApplyFor_Visa");
- expect(formAsset.assetName).toStrictEqual("ApplyFor#Visa.tsx");
- expect(formAsset.sanitizedAssetName).toStrictEqual("ApplyFor_Visa.tsx");
+ expect(formAsset.name).toStrictEqual("ApplyFor#Visa");
+
expect(formAsset.nameWithoutInvalidTsVarChars).toStrictEqual("ApplyFor_Visa");
+ expect(formAsset.fileName).toStrictEqual("ApplyFor#Visa.tsx");
+
expect(formAsset.fileNameWithoutInvalidVarChars).toStrictEqual("ApplyFor_Visa.tsx");
expect(formAsset.content).not.toBeUndefined();
expect(formAsset.content).toContain("const Form__ApplyFor_Visa");
expect(formAsset.content).toContain("export default Form__ApplyFor_Visa;");
@@ -59,12 +59,12 @@ describe("jbpmPatternflyFormCodeGeneratorTheme tests", ()
=> {
expect(formAssets[0]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "Apply#For#Visa",
- sanitizedId: "Apply_For_Visa",
- assetName: "Apply#For#Visa.tsx",
- sanitizedAssetName: "Apply_For_Visa.tsx",
+ name: "Apply#For#Visa",
+ nameWithoutInvalidTsVarChars: "Apply_For_Visa",
+ fileName: "Apply#For#Visa.tsx",
+ fileNameWithoutInvalidVarChars: "Apply_For_Visa.tsx",
config: { resources: { scripts: {}, styles: {} }, schema:
JSON.stringify(ApplyForVisaSchema) },
- type: "tsx",
+ fileExt: "tsx",
}),
formError: undefined,
})
@@ -73,12 +73,12 @@ describe("jbpmPatternflyFormCodeGeneratorTheme tests", ()
=> {
expect(formAssets[1]).toEqual(
expect.objectContaining({
formAsset: expect.objectContaining({
- id: "ConfirmTravel",
- sanitizedId: "ConfirmTravel",
- assetName: "ConfirmTravel.tsx",
- sanitizedAssetName: "ConfirmTravel.tsx",
+ name: "ConfirmTravel",
+ nameWithoutInvalidTsVarChars: "ConfirmTravel",
+ fileName: "ConfirmTravel.tsx",
+ fileNameWithoutInvalidVarChars: "ConfirmTravel.tsx",
config: { resources: { scripts: {}, styles: {} }, schema:
JSON.stringify(ConfirmTravelSchema) },
- type: "tsx",
+ fileExt: "tsx",
}),
formError: undefined,
})
diff --git a/packages/kie-editors-dev-vscode-extension/package.json
b/packages/kie-editors-dev-vscode-extension/package.json
index e6f92302c56..cb21f557cc2 100644
--- a/packages/kie-editors-dev-vscode-extension/package.json
+++ b/packages/kie-editors-dev-vscode-extension/package.json
@@ -39,6 +39,7 @@
"@kie-tools-core/patternfly-base": "workspace:*",
"@kie-tools-core/vscode-extension": "workspace:*",
"@kie-tools-core/workspace": "workspace:*",
+ "@kie-tools/form-code-generator-vscode-command": "workspace:*",
"@kie-tools/kie-bc-editors": "workspace:*",
"@kie-tools/pmml-editor": "workspace:*",
"@kie-tools/vscode-java-code-completion-extension-plugin": "workspace:*",
@@ -96,15 +97,19 @@
"dark": "./static/svg-icon-dark.png",
"light": "./static/svg-icon-light.png"
},
- "title": "Save Preview SVG"
+ "title": "Kogito Editors: Save Preview SVG"
},
{
"command": "extension.kogito.runTest",
- "title": "Run"
+ "title": "Kogito Editors: Run"
},
{
"command": "extension.kogito.silentlyGenerateSvg",
- "title": "Generate SVG without any notification"
+ "title": "Kogito Editors: Generate SVG without any notification"
+ },
+ {
+ "command": "extension.apache.kie.kogitoEditors.generateFormCode",
+ "title": "Kogito Editors: Generate form code for human interactions
from jBPM project"
}
],
"configuration": {
@@ -144,7 +149,7 @@
},
"customEditors": [
{
- "displayName": "KIE Kogito Editors",
+ "displayName": "Apache KIE Kogito Editors",
"selector": [
{
"filenamePattern": "*.{dmn,bpmn,bpmn2,scesim,pmml}"
diff --git
a/packages/kie-editors-dev-vscode-extension/src/extension/extension.ts
b/packages/kie-editors-dev-vscode-extension/src/extension/extension.ts
index 34a952c7eed..6c16d35aaf4 100644
--- a/packages/kie-editors-dev-vscode-extension/src/extension/extension.ts
+++ b/packages/kie-editors-dev-vscode-extension/src/extension/extension.ts
@@ -23,6 +23,7 @@ import { EditorEnvelopeLocator, EnvelopeContentType,
EnvelopeMapping } from "@ki
import { I18n } from "@kie-tools-core/i18n/dist/core";
import * as KogitoVsCode from "@kie-tools-core/vscode-extension";
import * as vscode from "vscode";
+import { generateFormsCommand } from
"@kie-tools/form-code-generator-vscode-command/dist/generateFormCodeCommand";
let backendProxy: VsCodeBackendProxy;
@@ -67,6 +68,12 @@ export async function activate(context:
vscode.ExtensionContext) {
backendProxy: backendProxy,
});
+ context.subscriptions.push(
+
vscode.commands.registerCommand("extension.apache.kie.kogitoEditors.generateFormCode",
async (args: any) =>
+ generateFormsCommand()
+ )
+ );
+
console.info("Extension is successfully setup.");
}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2b56e36c473..89ac815c00d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1131,6 +1131,9 @@ importers:
'@kie-tools-core/vscode-extension':
specifier: workspace:*
version: link:../vscode-extension
+ '@kie-tools/form-code-generator-vscode-command':
+ specifier: workspace:*
+ version: link:../form-code-generator-vscode-command
'@kie-tools/kie-bc-editors':
specifier: workspace:*
version: link:../kie-bc-editors
@@ -5013,6 +5016,40 @@ importers:
specifier: ^3.0.0
version: 3.0.0
+ packages/form-code-generator-vscode-command:
+ dependencies:
+ '@kie-tools/form-code-generator':
+ specifier: workspace:*
+ version: link:../form-code-generator
+ '@kie-tools/form-code-generator-bootstrap4-theme':
+ specifier: workspace:*
+ version: link:../form-code-generator-bootstrap4-theme
+ '@kie-tools/form-code-generator-patternfly-theme':
+ specifier: workspace:*
+ version: link:../form-code-generator-patternfly-theme
+ '@kie-tools/jbpm-form-code-generator-themes':
+ specifier: workspace:*
+ version: link:../jbpm-form-code-generator-themes
+ devDependencies:
+ '@kie-tools/eslint':
+ specifier: workspace:*
+ version: link:../eslint
+ '@kie-tools/root-env':
+ specifier: workspace:*
+ version: link:../root-env
+ '@kie-tools/tsconfig':
+ specifier: workspace:*
+ version: link:../tsconfig
+ '@types/vscode':
+ specifier: 1.67.0
+ version: 1.67.0
+ rimraf:
+ specifier: ^3.0.2
+ version: 3.0.2
+ typescript:
+ specifier: ^5.5.3
+ version: 5.5.3
+
packages/form-dmn:
dependencies:
'@kie-tools-core/i18n':
@@ -5879,6 +5916,9 @@ importers:
'@kie-tools-core/workspace':
specifier: workspace:*
version: link:../workspace
+ '@kie-tools/form-code-generator-vscode-command':
+ specifier: workspace:*
+ version: link:../form-code-generator-vscode-command
'@kie-tools/kie-bc-editors':
specifier: workspace:*
version: link:../kie-bc-editors
diff --git a/repo/graph.dot b/repo/graph.dot
index 46b184fa133..3090bb49c1b 100644
--- a/repo/graph.dot
+++ b/repo/graph.dot
@@ -49,6 +49,7 @@ digraph G {
"@kie-tools/bpmn-marshaller" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
"@kie-tools/xml-parser-ts-codegen" [ color = "blue", fontcolor = "blue",
style = "rounded" ];
"bpmn-vscode-extension" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
+ "@kie-tools/form-code-generator-vscode-command" [ color = "blue", fontcolor
= "blue", style = "rounded" ];
"@kie-tools/kie-bc-editors" [ color = "blue", fontcolor = "blue", style =
"rounded" ];
"@kie-tools/stunner-editors" [ color = "black", fontcolor = "black", style =
"dashed, rounded" ];
"@kie-tools/vscode-java-code-completion-extension-plugin" [ color = "black",
fontcolor = "black", style = "dashed, rounded" ];
@@ -120,10 +121,10 @@ digraph G {
"@kie-tools/form-code-generator" [ color = "blue", fontcolor = "blue", style
= "rounded" ];
"@kie-tools/form-code-generator-bootstrap4-theme" [ color = "blue",
fontcolor = "blue", style = "rounded" ];
"@kie-tools/form-code-generator-patternfly-theme" [ color = "blue",
fontcolor = "blue", style = "rounded" ];
+ "@kie-tools/jbpm-form-code-generator-themes" [ color = "blue", fontcolor =
"blue", style = "rounded" ];
"@kie-tools-core/i18n" [ color = "purple", fontcolor = "purple", style =
"rounded" ];
"@kie-tools/import-java-classes-component" [ color = "blue", fontcolor =
"blue", style = "rounded" ];
"@kie-tools-core/vscode-java-code-completion" [ color = "purple", fontcolor
= "purple", style = "rounded" ];
- "@kie-tools/jbpm-form-code-generator-themes" [ color = "blue", fontcolor =
"blue", style = "rounded" ];
"@kie-tools/runtime-tools-process-dev-ui-webapp" [ color = "blue", fontcolor
= "blue", style = "rounded" ];
"@kie-tools/jobs-service-webapp" [ color = "blue", fontcolor = "blue", style
= "rounded" ];
"@kie-tools/yaml-language-server" [ color = "blue", fontcolor = "blue",
style = "rounded" ];
@@ -250,6 +251,7 @@ digraph G {
"@kie-tools/boxed-expression-component" -> "@kie-tools/storybook-base" [
style = "dashed", color = "blue" ];
"@kie-tools/bpmn-marshaller" -> "@kie-tools/xml-parser-ts-codegen" [ style =
"dashed", color = "blue" ];
"bpmn-vscode-extension" -> "@kie-tools-core/vscode-extension" [ style =
"solid", color = "blue" ];
+ "bpmn-vscode-extension" -> "@kie-tools/form-code-generator-vscode-command" [
style = "solid", color = "blue" ];
"bpmn-vscode-extension" -> "@kie-tools/kie-bc-editors" [ style = "solid",
color = "blue" ];
"bpmn-vscode-extension" -> "@kie-tools/stunner-editors" [ style = "dashed",
color = "blue" ];
"bpmn-vscode-extension" ->
"@kie-tools/vscode-java-code-completion-extension-plugin" [ style = "dashed",
color = "blue" ];
@@ -390,6 +392,7 @@ digraph G {
"@kie-tools/form-code-generator-bootstrap4-theme" ->
"@kie-tools-core/webpack-base" [ style = "dashed", color = "blue" ];
"@kie-tools/form-code-generator-patternfly-theme" ->
"@kie-tools/form-code-generator" [ style = "solid", color = "blue" ];
"@kie-tools/form-code-generator-patternfly-theme" ->
"@kie-tools-core/webpack-base" [ style = "dashed", color = "blue" ];
+ "@kie-tools/form-code-generator-vscode-command" ->
"@kie-tools/jbpm-form-code-generator-themes" [ style = "solid", color = "blue"
];
"@kie-tools/form-dmn" -> "@kie-tools/form" [ style = "solid", color = "blue"
];
"@kie-tools-core/i18n" -> "@kie-tools/eslint" [ style = "dashed", color =
"purple" ];
"@kie-tools-core/i18n" -> "@kie-tools/jest-base" [ style = "dashed", color =
"purple" ];
@@ -421,6 +424,7 @@ digraph G {
"@kie-tools/kie-bc-editors" -> "@kie-tools/dmn-language-service" [ style =
"solid", color = "blue" ];
"@kie-tools/kie-bc-editors" -> "@kie-tools/pmml-editor-marshaller" [ style =
"solid", color = "blue" ];
"kie-editors-dev-vscode-extension" -> "@kie-tools-core/vscode-extension" [
style = "solid", color = "black" ];
+ "kie-editors-dev-vscode-extension" ->
"@kie-tools/form-code-generator-vscode-command" [ style = "solid", color =
"black" ];
"kie-editors-dev-vscode-extension" -> "@kie-tools/kie-bc-editors" [ style =
"solid", color = "black" ];
"kie-editors-dev-vscode-extension" -> "@kie-tools/pmml-editor" [ style =
"solid", color = "black" ];
"kie-editors-dev-vscode-extension" ->
"@kie-tools/vscode-java-code-completion-extension-plugin" [ style = "solid",
color = "black" ];
diff --git a/repo/graph.json b/repo/graph.json
index 3e1949c32b0..3ccae914e70 100644
--- a/repo/graph.json
+++ b/repo/graph.json
@@ -71,7 +71,9 @@
{ "id": "@kie-tools/xml-parser-ts-codegen" },
{ "id": "@kie-tools/xml-parser-ts" },
{ "id": "bpmn-vscode-extension" },
+ { "id": "@kie-tools/form-code-generator-vscode-command" },
{ "id": "@kie-tools/vscode-java-code-completion-extension-plugin" },
+ { "id": "@kie-tools/jbpm-form-code-generator-themes" },
{ "id": "@kie-tools/pmml-editor-marshaller" },
{ "id": "@kie-tools/stunner-editors-dmn-loader" },
{ "id": "chrome-extension-pack-kogito-kie-editors" },
@@ -133,7 +135,6 @@
{ "id": "@kie-tools/form-code-generator-bootstrap4-theme" },
{ "id": "@kie-tools/form-code-generator-patternfly-theme" },
{ "id": "@kie-tools/import-java-classes-component" },
- { "id": "@kie-tools/jbpm-form-code-generator-themes" },
{ "id": "@kie-tools/runtime-tools-process-webapp-components" },
{ "id": "@kie-tools/runtime-tools-shared-webapp-components" },
{ "id": "@kie-tools/jobs-service-webapp" },
@@ -854,6 +855,11 @@
"target": "@kie-tools-core/vscode-extension",
"weight": 1
},
+ {
+ "source": "bpmn-vscode-extension",
+ "target": "@kie-tools/form-code-generator-vscode-command",
+ "weight": 1
+ },
{
"source": "bpmn-vscode-extension",
"target": "@kie-tools/kie-bc-editors",
@@ -869,11 +875,26 @@
"target": "@kie-tools/vscode-java-code-completion-extension-plugin",
"weight": 1
},
+ {
+ "source": "@kie-tools/form-code-generator-vscode-command",
+ "target": "@kie-tools/jbpm-form-code-generator-themes",
+ "weight": 1
+ },
{
"source": "@kie-tools/vscode-java-code-completion-extension-plugin",
"target": "@kie-tools/maven-base",
"weight": 1
},
+ {
+ "source": "@kie-tools/jbpm-form-code-generator-themes",
+ "target": "@kie-tools/form-code-generator-bootstrap4-theme",
+ "weight": 1
+ },
+ {
+ "source": "@kie-tools/jbpm-form-code-generator-themes",
+ "target": "@kie-tools/form-code-generator-patternfly-theme",
+ "weight": 1
+ },
{
"source": "@kie-tools/pmml-editor-marshaller",
"target": "@kie-tools/eslint",
@@ -1639,16 +1660,6 @@
"target": "@kie-tools-core/webpack-base",
"weight": 1
},
- {
- "source": "@kie-tools/jbpm-form-code-generator-themes",
- "target": "@kie-tools/form-code-generator-bootstrap4-theme",
- "weight": 1
- },
- {
- "source": "@kie-tools/jbpm-form-code-generator-themes",
- "target": "@kie-tools/form-code-generator-patternfly-theme",
- "weight": 1
- },
{
"source": "@kie-tools/runtime-tools-process-webapp-components",
"target": "@kie-tools/runtime-tools-process-enveloped-components",
@@ -1684,6 +1695,11 @@
"target": "@kie-tools-core/vscode-extension",
"weight": 1
},
+ {
+ "source": "kie-editors-dev-vscode-extension",
+ "target": "@kie-tools/form-code-generator-vscode-command",
+ "weight": 1
+ },
{
"source": "kie-editors-dev-vscode-extension",
"target": "@kie-tools/kie-bc-editors",
@@ -2635,6 +2651,7 @@
["@kie-tools/form-code-generator", "packages/form-code-generator"],
["@kie-tools/form-code-generator-bootstrap4-theme",
"packages/form-code-generator-bootstrap4-theme"],
["@kie-tools/form-code-generator-patternfly-theme",
"packages/form-code-generator-patternfly-theme"],
+ ["@kie-tools/form-code-generator-vscode-command",
"packages/form-code-generator-vscode-command"],
["@kie-tools/form-dmn", "packages/form-dmn"],
["@kie-tools-core/i18n", "packages/i18n"],
["@kie-tools/i18n-common-dictionary", "packages/i18n-common-dictionary"],
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
