@wavemaker/angular-codegen 11.10.5-rc.6100 → 11.11.0-next.27920

package/angular-app/src/main.ts

@@ -1,20 +1,20 @@
-import { ApplicationRef, enableProdMode, NgModuleRef } from '@angular/core';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
-import { AppModule } from './app/app.module';
+import { ApplicationRef, enableProdMode } from '@angular/core';
+import { bootstrapApplication } from '@angular/platform-browser';
 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
+import { appConfig } from './app/app.config';
+import { AppComponent } from '@wm/runtime/base';
+import { BootstrapWrapperComponent } from './app/bootstrap-wrapper.component';
+
+// Format Accept-Language header
+const formatAcceptHeader = (languages: string[]): string => {
+  const result: string[] = [];
+  const addedLanguages = new Set<string>(); // To track already added languages
   let qValue = 1.0;
 
-  languages.forEach((lang: any) => {
+  languages.forEach((lang: string) => {
     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)}`}`);
@@ -37,31 +37,27 @@ let formatAcceptHeader = (languages: any) => {
   });
 
   return result.join(',');
-}
-WMAppProperties['preferredLanguage'] = formatAcceptHeader(navigator.languages);
-WMAppProperties['fontConfig'] = fontConfig;
+};
 
-
-(window as any)._WM_APP_PROPERTIES  = WMAppProperties
+// Initialize WMAppProperties
+WMAppProperties['preferredLanguage'] = formatAcceptHeader((navigator as any).languages);
+WMAppProperties['fontConfig'] = fontConfig;
+(window as any)._WM_APP_PROPERTIES = WMAppProperties;
 initWmProjectProperties();
 
 if (environment.production) {
-    enableProdMode();
+  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));
-});
+  new Promise<Event | void>(resolve => {
+      resolve();
+  }).then(() => bootstrapApplication(AppComponent, appConfig))
+    .then((appRef: ApplicationRef) => {
+      appRef.bootstrap(BootstrapWrapperComponent);
+      window.addEventListener('unload', () => {
+        appRef.components.map(c => c?.destroy());
+      });
+    })
+    .catch(err => console.error('Error bootstrapping app:', err));
+});

package/angular-app/tsconfig.json

@@ -32,9 +32,6 @@
             "@wm/build-task": [
                 "node_modules/@wavemaker/app-ng-runtime/build-task/"
             ],
-            "@wm/mobile-build-task": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile-build-task"
-            ],
             "@wm/core": [
                 "node_modules/@wavemaker/app-ng-runtime/core"
             ],
@@ -56,18 +53,9 @@
             "@wm/components/page": [
                 "node_modules/@wavemaker/app-ng-runtime/components/page/default"
             ],
-            "@wm/mobile/components/basic": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/basic/default"
-            ],
-            "@wm/mobile/components/page": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/page/default"
-            ],
             "@wm/components/dialogs": [
                 "node_modules/@wavemaker/app-ng-runtime/components/dialogs/default"
             ],
-            "@wm/mobile/components/*": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components/*"
-            ],
             "@wm/components/*": [
                 "node_modules/@wavemaker/app-ng-runtime/components/*"
             ],
@@ -89,29 +77,11 @@
             "@wm/variables": [
                 "node_modules/@wavemaker/app-ng-runtime/variables"
             ],
-            "@wm/mobile/core": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/core"
-            ],
-            "@wm/mobile/components": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components"
-            ],
-            "@wm/mobile/offline": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/offline"
-            ],
-            "@wm/mobile/variables": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/variables"
-            ],
             "@wm/runtime/base": [
                 "node_modules/@wavemaker/app-ng-runtime/runtime/base"
             ],
             "@wm/runtime/dynamic": [
                 "node_modules/@wavemaker/app-ng-runtime/runtime/dynamic"
-            ],
-            "@wm/mobile/runtime": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime"
-            ],
-            "@wm/mobile/runtime/dynamic": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/runtime-dynamic"
             ]
         },
         "useDefineForClassFields": false

package/angular-app/tsconfig.web-app.json

@@ -31,9 +31,6 @@
             "@wm/build-task": [
                 "node_modules/@wavemaker/app-ng-runtime/build-task/"
             ],
-            "@wm/mobile-build-task": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile-build-task"
-            ],
             "@wm/core": [
                 "node_modules/@wavemaker/app-ng-runtime/core"
             ],
@@ -70,29 +67,11 @@
             "@wm/variables": [
                 "node_modules/@wavemaker/app-ng-runtime/variables"
             ],
-            "@wm/mobile/core": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/core"
-            ],
-            "@wm/mobile/components": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/components"
-            ],
-            "@wm/mobile/offline": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/offline"
-            ],
-            "@wm/mobile/variables": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/variables"
-            ],
             "@wm/runtime/base": [
                 "node_modules/@wavemaker/app-ng-runtime/runtime/base"
             ],
             "@wm/runtime/dynamic": [
                 "node_modules/@wavemaker/app-ng-runtime/runtime/dynamic"
-            ],
-            "@wm/mobile/runtime": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/placeholder/runtime"
-            ],
-            "@wm/mobile/runtime-dynamic": [
-                "node_modules/@wavemaker/app-ng-runtime/mobile/placeholder/runtime/dynamic"
             ]
         }
     },

package/angular-app/wm-custom-webpack.config.js

@@ -2,6 +2,18 @@ const CompressionPlugin = require(`compression-webpack-plugin`);
 const path = require(`path`);
 const {ConcatSource} = require("webpack-sources");
 
+const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
+
+const wmPropertiesPath = path.join(__dirname, '/src/app/wmProperties.js');
+
+const { WMAppProperties } = require(wmPropertiesPath);
+
+const localesToKeep = Object.values(WMAppProperties.supportedLanguages)
+  .map(lang => lang.moment)
+  .filter(locale => locale !== null);
+
+  const includeMomentPlugin = WMAppProperties.languageBundleSources === "STATIC";
+
 class ModifyCssAssetUrlsPlugin {
     apply(compiler) {
         compiler.hooks.compilation.tap('ModifyCssAssetUrlsPlugin', compilation => {
@@ -78,6 +90,12 @@ module.exports = {
             filename: "[name].br[ext]",
             algorithm: "brotliCompress"
         }),
+        // On STATIC WMAppProperties.languageBundleSources, required moment locales are included in the bundle
+        
+        /**
+         * MomentLocalesPlugin is used to include only the required moment locales in the bundle.
+         */
+        ...(includeMomentPlugin ? [ new MomentLocalesPlugin({ localesToKeep }) ] : [])
     ],
     optimization: {
         splitChunks: {

package/dependencies/app.component.html

@@ -1,28 +1,36 @@
-<ng-container *ngIf="startApp">
-    <router-outlet></router-outlet>
-    <div wmContainer partialContainer content="Common" hidden class="ng-hide" *ngIf="isApplicationType"></div>
-    <app-spinner name="globalspinner" classname="global-spinner" role="alert" aria-live="assertive" [attr.aria-label]="spinner.arialabel || 'Loading'" [show]="spinner.show" [spinnermessages]="spinner.messages"></app-spinner>
-    <div wmDialog name="oAuthLoginDialog" title="Application is requesting you to sign in with"
-         close.event="closeOAuthDialog()">
-        <ng-template #dialogBody>
-            <ul class="list-items">
-                <li class="list-item" *ngFor="let provider of providersConfig">
-                    <button class="btn" (click)="provider.invoke()">{{provider.name}}</button>
-                </li>
-            </ul>
-        </ng-template>
-    </div>
-    <div wmConfirmDialog name="_app-confirm-dialog" title.bind="title" message.bind="message" oktext.bind="oktext"
-         canceltext.bind="canceltext" closable="false" iconclass.bind="iconclass"
-         escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
-    <div  *ngIf="!isApplicationType" wmConfirmDialog name="PrefabConfirmDialog" title.bind="title" message.bind="text" oktext.bind="okButtonText"
-         canceltext.bind="cancelButtonText" closable="false" iconclass.bind="iconclass"
-         escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
-    <div  *ngIf="!isApplicationType" wmAlertDialog name="PrefabAlertDialog" title.bind="title" message.bind="text" oktext.bind="okButtonText"
-         canceltext.bind="cancelButtonText" closable="false" iconclass.bind="iconclass"
-         escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
-    <div wmAppExt></div>
-    <i id="wm-mobile-display"></i>
-</ng-container>
+@if (startApp) {
+  <router-outlet></router-outlet>
+  @if (isApplicationType) {
+    <div wmContainer partialContainer content="Common" hidden class="ng-hide"></div>
+  }
+  <app-spinner name="globalspinner" classname="global-spinner" role="alert" aria-live="assertive" [attr.aria-label]="spinner.arialabel || 'Loading'" [show]="spinner.show" [spinnermessages]="spinner.messages"></app-spinner>
+  <div wmDialog name="oAuthLoginDialog" title="Application is requesting you to sign in with"
+    close.event="closeOAuthDialog()">
+    <ng-template #dialogBody>
+      <ul class="list-items">
+        @for (provider of providersConfig; track provider) {
+          <li class="list-item">
+            <button class="btn" (click)="provider.invoke()">{{provider.name}}</button>
+          </li>
+        }
+      </ul>
+    </ng-template>
+  </div>
+  <div wmConfirmDialog name="_app-confirm-dialog" title.bind="title" message.bind="message" oktext.bind="oktext"
+    canceltext.bind="canceltext" closable="false" iconclass.bind="iconclass"
+  escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
+  @if (!isApplicationType) {
+    <div  wmConfirmDialog name="PrefabConfirmDialog" title.bind="title" message.bind="text" oktext.bind="okButtonText"
+      canceltext.bind="cancelButtonText" closable="false" iconclass.bind="iconclass"
+    escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
+  }
+  @if (!isApplicationType) {
+    <div  wmAlertDialog name="PrefabAlertDialog" title.bind="title" message.bind="text" oktext.bind="okButtonText"
+      canceltext.bind="cancelButtonText" closable="false" iconclass.bind="iconclass"
+    escape.event="onEscape()" ok.event="onOk()" cancel.event="onCancel()" close.event="onClose()" opened.event="onOpen()"></div>
+  }
+  <div wmAppExt></div>
+  <i id="wm-mobile-display"></i>
+}
 <!--Dummy container to create the component dynamically-->
 <ng-container #dynamicComponent></ng-container>