Sample Angular App V3 Upgrade

.github/workflows/build_test.yml

@@ -138,7 +138,7 @@ jobs:
       - name: '[Prep 3] Setup Node'
         uses: actions/setup-node@v2
         with:
-          node-version: 18
+          node-version: 22
 
       - name: '[Prep 4] Setup jFrog CLI'
         uses: jfrog/setup-jfrog-cli@v2

CHANGELOG.md

@@ -2,6 +2,17 @@
 
 All notable changes to the sample angular app will be documented in this file.
 
+## 3.0.0
+
+- AI DISCLAIMER: This upgrade was performed with Claude Opus 4.6.
+- Upgraded to Angular 18.2.14 for Zowe V3 desktop compatibility.
+- Replaced ts-loader and angular2-template-loader with @ngtools/webpack for AOT compilation.
+- Switched webpack config to extend webpack5.base.js.
+- Updated output path to web/v3/ with versioned entryPoint in pluginDefinition.json.
+- Upgraded all dependencies: rxjs 7.8.1, typescript 5.4.5, zone.js 0.14.4, webpack 5.92.0.
+- Removed legacy loaders (html-loader, exports-loader, file-loader) and NODE_OPTIONS workaround.
+- Updated angular.json, removing deprecated options and using Angular 18 conventions.
+
 ## 2.0.1
 - Bugfix: Schema file was not included, preventing installation as a component
 - Bugfix: Manifest build content template was never resolved, so it has been removed.

bin/validate.sh

@@ -0,0 +1,22 @@
+#!/bin/sh
+
+#######################################################################
+# This program and the accompanying materials are made available
+# under the terms of the Eclipse Public License v2.0 which
+# accompanies this distribution, and is available at
+# https://www.eclipse.org/legal/epl-v20.html
+#
+# SPDX-License-Identifier: EPL-2.0
+#
+# Copyright Contributors to the Zowe Project.
+#######################################################################
+
+name="angular-sample"
+id="org.zowe.zlux.sample.angular"
+
+rc=0
+if [ "${ZWE_components_app_server_enabled}" != "true" ]; then
+  echo "${name} (${id}) cannot run because app-server is not enabled."
+  rc=1
+fi
+exit $rc

manifest.yaml

@@ -19,6 +19,8 @@ repository:
   type: git
   url: https://github.com/zowe/sample-angular-app.git
 # we do not specify encoding here because its already tagged ascii
+commands:
+  validate: bin/validate.sh
 appfwPlugins:
   - path: .
 schemas:

pluginDefinition.json

@@ -11,13 +11,17 @@
     "launchDefinition": {
       "pluginShortNameKey": "sampleangular",
       "pluginShortNameDefault": "Angular Sample",
-      "imageSrc": "assets/icon.png"
+      "imageSrc": "v3/assets/icon.png"
     },
     "descriptionKey": "sampleangulardescription",
     "descriptionDefault": "Sample App Showcasing Angular Adapter",
     "defaultWindowStyle": {
       "width": 850,
       "height": 540
+    },
+    "entryPoint": {
+      "2.0": "main.js",
+      "3.0": "v3/main.js"
     }
   },
   "dataServices": [
@@ -47,21 +51,6 @@
       "dependenciesIncluded": true,
       "initializerLookupMethod": "external",
       "version": "1.0.1"
-    },
-    {
-      "type": "service",
-      "name": "zssStorage",
-      "libraryName31": "storage31.so",
-      "libraryName64": "storage64.so",
-      "dependenciesIncluded": true,
-      "methods": [
-        "GET",
-        "POST",
-        "DELETE"
-      ],
-      "initializerName": "storageServiceInstaller",
-      "initializerLookupMethod": "external",
-      "version": "0.0.1"
     }
   ],
   "configurationData": {

schemas/trivial-schema.json

@@ -1,6 +1,6 @@
 {  
   "$schema": "https://json-schema.org/draft/2019-09/schema",
-  "$id": "https://abcdef.com/schemas/v2/sample-angular",
+  "$id": "https://zowe.org/schemas/v2/angular-sample",
   "allOf": [
     { "$ref": "https://zowe.org/schemas/v2/server-base" },
     { 
@@ -10,7 +10,7 @@
           "type": "object",
           "additionalProperties": true,
           "properties": {  
-            "sample-angular": {
+            "angular-sample": {
               "$ref": "https://zowe.org/schemas/v2/server-base#zoweComponent"
             }
           }

webClient/angular.json

@@ -15,7 +15,6 @@
             "index": "src/index.html",
             "main": "src/main.ts",
             "tsConfig": "src/tsconfig.app.json",
-            "polyfills": "src/polyfills.ts",
             "assets": [
               "src/assets",
               "src/favicon.ico"
@@ -30,9 +29,7 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,
@@ -48,27 +45,18 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "mvd-plugin-name:build"
+            "buildTarget": "mvd-plugin-name:build"
           },
           "configurations": {
             "production": {
-              "browserTarget": "mvd-plugin-name:build:production"
+              "buildTarget": "mvd-plugin-name:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "mvd-plugin-name:build"
-          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "tsconfig.app.json"
-            ],
-            "exclude": []
+            "buildTarget": "mvd-plugin-name:build"
           }
         }
       }
@@ -79,11 +67,10 @@
       "projectType": "application"
     }
   },
-  "defaultProject": "mvd-plugin-name",
   "schematics": {
     "@schematics/angular:component": {
       "prefix": "app",
-      "styleext": "css"
+      "style": "css"
     },
     "@schematics/angular:directive": {
       "prefix": "app"