@wavemaker/angular-codegen 11.10.0-next.24980 → 11.10.0-next.25079

package/angular-app/src/framework/services/customwidget-config-provider.service.ts

@@ -0,0 +1,13 @@
+import { Injectable } from '@angular/core';
+
+import { CustomwidgetConfigProvider } from '@wm/runtime/base';
+
+import { getCustomWidgetConfig } from '../util/page-util';
+
+@Injectable()
+export class CustomwidgetConfigProviderService extends CustomwidgetConfigProvider {
+
+    public getConfig(widgetname: string): Promise<any> {
+        return Promise.resolve(getCustomWidgetConfig(widgetname));
+    }
+}

package/angular-app/src/framework/util/page-util.ts

@@ -0,0 +1,7 @@
+const prefabConfigs = new Map<string, any>();
+const customWidgetConfigs = new Map<string, any>();
+
+export const registerPrefabConfig = (prefabName: string, config: any) => prefabConfigs.set(prefabName, config);
+export const getPrefabConfig = prefabName => prefabConfigs.get(prefabName);
+export const registerCustomWidgetConfig = (customWidget: string, config: any) => customWidgetConfigs.set(customWidget, config);
+export const getCustomWidgetConfig = customWidget => customWidgetConfigs.get(customWidget);

package/angular-app/src/main.ts

@@ -0,0 +1,67 @@
+import { ApplicationRef, enableProdMode, NgModuleRef } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
+
+import initWmProjectProperties from './app/wm-project-properties';
+import { WMAppProperties } from './app/wmProperties';
+import * as fontConfig from './font.config';
+
+
+let formatAcceptHeader = (languages: any) => {
+  let result: string[] = [];
+  let addedLanguages = new Set<string>(); // To track already added languages
+  let qValue = 1.0;
+
+  languages.forEach((lang: any) => {
+    if (!addedLanguages.has(lang)) {
+      // Add the full language (e.g., en-US or en) if not already added
+      result.push(`${lang}${qValue === 1.0 ? '' : `;q=${qValue.toFixed(1)}`}`);
+      addedLanguages.add(lang);
+      // Decrease qValue for the next language
+      qValue = Math.max(0.1, qValue - 0.1); // Decrease qValue, minimum is 0.1
+    }
+
+    // If language has a region code (e.g., en-US), also add the base language (e.g., en)
+    if (lang.includes('-')) {
+      const baseLang = lang.split('-')[0];
+      if (!addedLanguages.has(baseLang)) {
+        result.push(`${baseLang};q=${qValue.toFixed(1)}`);
+        addedLanguages.add(baseLang);
+
+        // Decrease qValue for the next language
+        qValue = Math.max(0.1, qValue - 0.1);
+      }
+    }
+  });
+
+  return result.join(',');
+}
+WMAppProperties['preferredLanguage'] = formatAcceptHeader(navigator.languages);
+WMAppProperties['fontConfig'] = fontConfig;
+
+
+(window as any)._WM_APP_PROPERTIES  = WMAppProperties
+initWmProjectProperties();
+
+if (environment.production) {
+    enableProdMode();
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+    new Promise<Event | void>( resolve => {
+        if (window['cordova']) {
+            document.addEventListener('deviceready', resolve);
+        } else {
+            resolve();
+        }
+    }).then(() => platformBrowserDynamic().bootstrapModule(AppModule))
+        .then((appModuleRef: NgModuleRef<AppModule>) => {
+            const applicationRef = appModuleRef.injector.get(ApplicationRef);
+            window.addEventListener('unload', () => {
+                applicationRef.components.map(c => c && c.destroy());
+            });
+            console.timeEnd('bootstrap'), err => console.log(err);
+        }, err => console.log(err));
+});

{angular-codegen → package}/angular-app/tsconfig.json

@@ -2,19 +2,23 @@
     "compileOnSave": false,
     "compilerOptions": {
         "baseUrl": "./",
-        "outDir": "./dist/out-tsc",
         "downlevelIteration": true,
-        "declaration": false,
+        "outDir": "./dist/out-tsc",
         "sourceMap": true,
+        "declaration": false,
+        "target": "es2022",
+        "module": "es2020",
+        "moduleResolution": "node",
+        "esModuleInterop": true,
         "emitDecoratorMetadata": true,
         "experimentalDecorators": true,
-        "esModuleInterop": true,
-        "moduleResolution": "node",
-        "target": "ES2022",
-        "module": "ES2022",
         "typeRoots": [
             "node_modules/@types"
         ],
+        "lib": [
+            "es2018",
+            "dom"
+        ],
         "paths": {
             "rxjs/observable/throw": [
                 "node_modules/rxjs-compat/_esm2015/observable/throw"
@@ -32,31 +36,34 @@
                 "node_modules/@wavemaker/app-ng-runtime/mobile-build-task"
             ],
             "@wm/core": [
-                "node_modules/@wavemaker/app-ng-runtime/core/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/core"
             ],
             "@wavemaker/variables": [
                 "node_modules/@wavemaker/variables/"
             ],
+            "@wavemaker/custom-widgets-m3": [
+                "node_modules/@wavemaker/custom-widgets-m3/"
+            ],
             "@wm/components/base": [
-                "node_modules/@wavemaker/app-ng-runtime/components/base/public_api.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/components/base"
             ],
             "@wm/components/basic": [
-                "node_modules/@wavemaker/app-ng-runtime/components/basic/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/components/basic/default"
             ],
             "@wm/components/input": [
-                "node_modules/@wavemaker/app-ng-runtime/components/input/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/components/input/default"
             ],
             "@wm/components/page": [
-                "node_modules/@wavemaker/app-ng-runtime/components/page/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/components/page/default"
             ],
             "@wm/mobile/components/basic": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/basic/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/components/basic/default"
             ],
             "@wm/mobile/components/page": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/page/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/components/page/default"
             ],
             "@wm/components/dialogs": [
-                "node_modules/@wavemaker/app-ng-runtime/components/dialogs/default/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/components/dialogs/default"
             ],
             "@wm/mobile/components/*": [
                 "node_modules/@wavemaker/app-ng-runtime/mobile/components/*"
@@ -65,67 +72,53 @@
                 "node_modules/@wavemaker/app-ng-runtime/components/*"
             ],
             "@wm/transpiler": [
-                "node_modules/@wavemaker/app-ng-runtime/transpiler/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/transpiler"
             ],
             "@wm/security": [
-                "node_modules/@wavemaker/app-ng-runtime/security/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/security"
             ],
             "@swipey": [
-                "node_modules/@wavemaker/app-ng-runtime/swipey/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/swipey"
             ],
             "@wm/http": [
-                "node_modules/@wavemaker/app-ng-runtime/http/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/http"
             ],
             "@wm/oAuth": [
-                "node_modules/@wavemaker/app-ng-runtime/oAuth/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/oAuth"
             ],
             "@wm/variables": [
-                "node_modules/@wavemaker/app-ng-runtime/variables/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/variables"
             ],
             "@wm/mobile/core": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/core/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/core"
             ],
             "@wm/mobile/components": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/components"
             ],
             "@wm/mobile/offline": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/offline/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/offline"
             ],
             "@wm/mobile/variables": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/variables/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/variables"
             ],
             "@wm/runtime/base": [
-                "node_modules/@wavemaker/app-ng-runtime/runtime/base/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/runtime/base"
             ],
             "@wm/runtime/dynamic": [
-                "node_modules/@wavemaker/app-ng-runtime/runtime/dynamic/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/runtime/dynamic"
             ],
             "@wm/mobile/runtime": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime"
             ],
             "@wm/mobile/runtime/dynamic": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime-dynamic/index.d.ts"
+                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime-dynamic"
             ]
         },
-        "lib": [
-            "es2020",
-            "dom"
-        ],
-        "useDefineForClassFields": false,
-        "resolveJsonModule": true
+        "useDefineForClassFields": false
     },
     "angularCompilerOptions": {
         "compilationMode": "full",
         "strictMetadataEmit": false,
-        "fullTemplateTypeCheck": false,
-        "extendedDiagnostics": {
-            "checks": {
-                "optionalChainNotNullable": "suppress"
-            }
-        },
-        "enableI18nLegacyMessageIdFormat": false,
-        "strictInjectionParameters": false,
-        "strictInputAccessModifiers": false,
-        "trace": true
+        "fullTemplateTypeCheck": false
     }
 }

package/build-angular-app.js

@@ -0,0 +1,123 @@
+
+/**
+ *  Download and install the app-ng-runtime package
+ *  Run the build and post build for the generated angular app.
+ *  
+ *  CONSOLE ARGUMENTS:-
+ *  nodeVMArgs:String: Node environment params  (Eg: '--max-old-space-size=2040')
+ *  ngBuildParams:String: Anglar build params (Eg: '--prod=true --source-map=false')
+ *  runtimeUIVersion:String: Runtime version (Eg: 10.6.6-next.10243)
+ *  appSrc:String: Source folder to generate the angular app (current directory Eg: '.')
+ *  appTarget:String: Target folder to save the generated app (Eg: 'target/ui-build/generated-app')
+ *  codegenPath:String: Input to the codegen-CLI -->  Codegen installation path to copy the angular-template-app
+ *  optimizeUIBuild : By default this flag will be true. If it's windows platform we are making the flag to false, it means no optimisation for windows.
+ */
+const fs = require('fs');
+const { downloadNPMPackage } = require('./download-packages');
+const archiver = require('archiver');
+const path = require("path");
+const { executeSyncCmd,  MSG_NG_RUNTIME_LOG, MSG_NG_RUNTIME_SUCCESS } = require('./build-util');
+const os = require("os");
+
+const NPM_PACKAGE_SCOPE = '@wavemaker';
+
+/**
+ * @TODO: This is a temporary workaround to extract deploy-url from 'ngBuildParams', need to be replaced in future.
+ */
+const updateDeployUrl = (args) => {
+    let buildArgs = args.ngBuildParams.split(' ');
+    const deployParam = buildArgs.find(i => i.startsWith("--deploy-url="));
+    if(!deployParam) {
+        buildArgs.push("--deploy-url=ng-bundle/");
+    } else {
+        buildArgs.filter((param, index) => {
+            if (param.includes('--deploy-url=_cdnUrl_')) {
+                buildArgs[index] = "--deploy-url=_cdnUrl_/ng-bundle/"
+                return true;
+            }
+        });
+    }
+    buildArgs.push(args.nodeVMArgs);
+    return buildArgs.join(" ");
+};
+
+/**
+ * Download the app runtime package
+ * Symlink to reuse the existing node modules (If windows optimizeUIBuild will be false and install all node modules every build )
+ * Run the ng build and post build for the project
+ */
+const buildAngularApp = (args) => {
+    const HOME_DIR = os.homedir(), ANGULAR_APP_TEMPLATE_NAME = "angular-app";
+    const TARBALL_DOWNLOAD_PATH = (HOME_DIR + '/.wm/node_modules') + '/' + ANGULAR_APP_TEMPLATE_NAME + '/' + args.runtimeUIVersion;
+    const PACKAGE_NAME = NPM_PACKAGE_SCOPE + '/' + ANGULAR_APP_TEMPLATE_NAME + '@' + args.runtimeUIVersion;
+    const TARBALL_NAME = 'wavemaker' + '-' + ANGULAR_APP_TEMPLATE_NAME + '-' + args.runtimeUIVersion + '.tgz';
+
+    fs.mkdirSync(TARBALL_DOWNLOAD_PATH, { recursive: true });
+    //npm pack will download the given package as a tar file
+    executeSyncCmd('cd ' + TARBALL_DOWNLOAD_PATH + ` && npm pack ${PACKAGE_NAME}`, null, `Downloading tarball - ${PACKAGE_NAME} to the location - ${TARBALL_DOWNLOAD_PATH}`);
+    executeSyncCmd('cd ' + TARBALL_DOWNLOAD_PATH + ` && tar -xvf ${TARBALL_NAME}`, null, `Unzipping the tarball - ${TARBALL_NAME}`);
+
+    let packageInfo = {
+        scope: NPM_PACKAGE_SCOPE,
+        name: ANGULAR_APP_TEMPLATE_NAME,
+        version: args.runtimeUIVersion,
+        packageJsonFile: `${TARBALL_DOWNLOAD_PATH}/package/package.json`,
+        packageJsonLockFile: `${TARBALL_DOWNLOAD_PATH}/package/package-lock.json`,
+        successMsg: MSG_NG_RUNTIME_SUCCESS,
+        infoMsg: MSG_NG_RUNTIME_LOG
+    }
+
+    try {
+        if (args.optimizeUIBuild) {
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/package.json`, TARBALL_DOWNLOAD_PATH + '/package.json');
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/package-lock.json`, TARBALL_DOWNLOAD_PATH + '/package-lock.json');
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/.npmrc`, TARBALL_DOWNLOAD_PATH + '/.npmrc');
+
+            // Download angular-app node_modules
+            executeSyncCmd('cd ' + TARBALL_DOWNLOAD_PATH + ' && npm install --prefix ' + TARBALL_DOWNLOAD_PATH, null, "Installing app dependencies...");
+
+            // Symlink to reuse the existing node_modules
+            fs.symlinkSync(TARBALL_DOWNLOAD_PATH + `/node_modules`, args.appTarget + '/node_modules', 'dir');
+        } else {
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/package/package.json`, args.appTarget + '/package.json');
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/package-lock.json`, args.appTarget + '/package-lock.json');
+            fs.copyFileSync(TARBALL_DOWNLOAD_PATH + `/package/.npmrc`, args.appTarget + '/.npmrc');
+            executeSyncCmd('cd ' + args.appTarget + ` && npm install `, null, MSG_NG_RUNTIME_LOG);
+        }
+    } catch (err) {
+        console.log(MSG_NG_RUNTIME_LOG + 'FAILED the symlink for the node_modules', err);
+        process.exit(err.code || err.pid);
+    }
+
+    let ngBuildParams = updateDeployUrl(args);
+    const NG_BUILD_MSG = 'NG BUILD MIGHT HAVE FAILED WITH HEAP OUT OF MEMORY, RE-EXECUTE THE BUILD BY INCREASING THE MAX-OLD-SPACE-SIZE ARGUMENT VALUE FOR BUILD.UI.NODE.ARGS PROPERTY IN DEPLOYMENT PROFILE';
+    // Generating the angular build and post build process.
+    executeSyncCmd('cd ' + args.appTarget + ' && node ./build-scripts/build.js ' + ngBuildParams, null, MSG_NG_RUNTIME_LOG, false, NG_BUILD_MSG);
+}
+
+const generateUiZip = async( sourceDir ) => {
+    return new Promise((resolve, reject) => {
+        const distDir = path.resolve(sourceDir + '/target/ui-build/output-files');
+        const zipFile = path.resolve(sourceDir + '/target/ui-artifact.zip');
+
+        const output = fs.createWriteStream(zipFile);
+        const archive = archiver('zip', {
+            zlib: {level: 9}
+        });
+        output.on('close', () => {
+            console.log(`✅ ui-artifact.zip created successfully: ${zipFile}`);
+            resolve();
+        });
+        archive.on('error', (err) => {
+            reject(err);
+        });
+        archive.pipe(output);
+        archive.directory(distDir, false);
+        archive.finalize();
+    });
+}
+
+module.exports = {
+    buildAngularApp,
+    generateUiZip
+}