Merge branch 'ent-9941-odometro-no-muestra-el-color-del-modulo-en-la-barra-con-enlace-publico' into 'develop'

Ent 9941 odometro no muestra el color del modulo en la barra con enlace publico

See merge request artica/pandorafms!5387

visual_console_client/package.json

@@ -29,28 +29,29 @@
     "@types/jest": "^24.9.1",
     "@typescript-eslint/eslint-plugin": "^1.13.0",
     "@typescript-eslint/parser": "^1.13.0",
-    "awesome-typescript-loader": "^5.2.1",
-    "clean-webpack-plugin": "^2.0.2",
-    "css-loader": "^2.1.1",
+    "clean-webpack-plugin": "^4.0.0",
+    "css-loader": "^6.7.3",
     "d3-shape": "^1.3.7",
     "eslint": "^5.16.0",
     "eslint-config-prettier": "^4.3.0",
     "eslint-plugin-prettier": "^3.4.0",
-    "file-loader": "^3.0.1",
-    "jest": "^24.9.0",
-    "mini-css-extract-plugin": "^0.5.0",
+    "file-loader": "^6.2.0",
+    "jest": "^29.3.1",
+    "mini-css-extract-plugin": "^2.7.2",
     "npm-watch": "^0.11.0",
     "postcss-loader": "^3.0.0",
     "prettier": "^1.19.1",
-    "ts-jest": "^24.3.0",
-    "typescript": "^3.9.9",
-    "url-loader": "^1.1.2",
-    "webpack": "^4.46.0",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.11.2"
+    "ts-jest": "^29.0.3",
+    "typescript": "^4.9.4",
+    "webpack": "^5.75.0",
+    "webpack-cli": "^5.0.1",
+    "webpack-dev-server": "^4.11.1"
   },
   "browserslist": [
     "> 1%",
     "last 2 versions"
-  ]
+  ],
+  "devDependencies": {
+    "ts-loader": "^9.4.2"
+  }
 }

visual_console_client/src/VisualConsole.ts

@@ -722,7 +722,7 @@ export default class VisualConsole {
       context.containerRef.append(itemInstance.elementRef);
       return itemInstance;
     } catch (error) {
-      console.error("Error creating a new element:", error.message);
+      console.error("Error creating a new element:", (error as Error).message);
     }
     return;
   }
@@ -759,7 +759,10 @@ export default class VisualConsole {
           try {
             this.elementsById[item.id].props = decodeProps(item);
           } catch (error) {
-            console.error("Error updating an element:", error.message);
+            console.error(
+              "Error updating an element:",
+              (error as Error).message
+            );
           }
         }
       }
@@ -780,7 +783,7 @@ export default class VisualConsole {
         ...decodeProps(item)
       };
     } catch (error) {
-      console.error("Error updating element:", error.message);
+      console.error("Error updating element:", (error as Error).message);
     }
 
     // Re-build relations.

visual_console_client/src/items/Odometer.ts

@@ -223,16 +223,11 @@ export default class Odometer extends Item<OdometerProps> {
 
     let script = document.createElement("script");
     script.type = "text/javascript";
-    script.onload = function() {
+    script.onload = () => {
       odometerB.style.transform = `rotate(${rotate}turn)`;
     };
-
-    if (typeof this.props.metaconsoleId !== "undefined") {
-      script.src = "./../../include/javascript/pandora_alerts.js";
-    } else {
-      script.src = "./include/javascript/pandora_alerts.js";
-    }
-
+    var url_pandora = window.location.pathname.split("/")[1];
+    script.src = `${document.dir}/${url_pandora}/include/javascript/pandora_alerts.js`;
     odometerA.appendChild(h1);
     odometerA.appendChild(h2);
     odometerContainer.appendChild(odometerB);
@@ -325,9 +320,7 @@ export default class Odometer extends Item<OdometerProps> {
   }
 
   private getCoords(percent: number, radio: number): string {
-    if (this.props.minMaxValue === "") {
-      percent = percent;
-    } else {
+    if (this.props.minMaxValue !== "") {
       const minMax = JSON.parse(this.props.minMaxValue);
       if (minMax["min"] === percent) {
         percent = 0;

visual_console_client/tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "outDir": "./dist/",
     "target": "es5",
     "module": "es6",
     "strict": true,

visual_console_client/webpack.config.js

@@ -1,8 +1,6 @@
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const path = require("path");
 // eslint-disable-next-line @typescript-eslint/no-var-requires
-const CleanWebpackPlugin = require("clean-webpack-plugin");
-// eslint-disable-next-line @typescript-eslint/no-var-requires
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
 const dev = process.env.NODE_ENV !== "production";
@@ -21,7 +19,9 @@ module.exports = {
   output: {
     path: buildPath, // The files will be created here.
     // filename: dev ? "vc.[name].min.js" : "vc.[name].[chunkhash:8].min.js"
-    filename: "vc.[name].min.js"
+    filename: "vc.[name].min.js",
+    assetModuleFilename: "[name][ext]",
+    clean: true
   },
   devtool: "source-map",
   resolve: {
@@ -31,19 +31,27 @@ module.exports = {
     rules: [
       // Loader for the Typescript compiler.
       {
-        test: /\.ts$/,
-        loader: "awesome-typescript-loader"
+        test: /\.(ts)x?$/,
+        exclude: /node_modules|\.d\.ts$/, // this line as well
+        use: {
+          loader: "ts-loader",
+          options: {
+            compilerOptions: {
+              noEmit: false
+            }
+          }
+        }
       },
       // This loader builds a main CSS file from all the CSS imports across the files.
       {
         test: /\.css$/,
-        loader: [
+        use: [
           // https://github.com/webpack-contrib/mini-css-extract-plugin
           {
             loader: MiniCssExtractPlugin.loader,
             options: {
-              hot: true, // if you want HMR - we try to automatically inject hot reloading but if it's not working, add it to the config
-              reloadAll: true // when desperation kicks in - this is a brute force HMR flag
+              //hot: true // if you want HMR - we try to automatically inject hot reloading but if it's not working, add it to the config
+              //reloadAll: true // when desperation kicks in - this is a brute force HMR flag
             }
           },
           // https://webpack.js.org/loaders/css-loader
@@ -52,20 +60,6 @@ module.exports = {
             options: {
               sourceMap: true
             }
-          },
-          // To post process CSS and add some things like prefixes to the rules. e.g.: -webkit-...
-          // https://github.com/postcss/postcss-loader
-          {
-            loader: "postcss-loader",
-            options: {
-              plugins: () => [
-                // Moved to package.json (?)
-                // // To improve the support for old browsers.
-                // require("autoprefixer")({
-                //   browsers: ["> 1%", "last 2 versions"]
-                // })
-              ]
-            }
           }
         ]
       },
@@ -74,32 +68,25 @@ module.exports = {
       // https://webpack.js.org/loaders/url-loader
       {
         test: /\.(png|jpg|gif|svg|eot|ttf|woff|woff2)$/,
-        loader: "url-loader",
-        options: {
-          limit: 10000,
-          // name: "[name].[hash:8].[ext]"
-          name: "[name].[ext]"
+        type: "asset",
+        generator: {
+          filename: "[name][ext]"
         }
       }
     ]
   },
   plugins: [
-    // This plugin will remove all files inside Webpack's output.path directory,
-    // as well as all unused webpack assets after every successful rebuild.
-    new CleanWebpackPlugin(),
     // Options for the plugin which extract the CSS files to build a main file.
     new MiniCssExtractPlugin({
       // Options similar to the same options in webpackOptions.output
       // both options are optional
       // filename: dev ? "vc.[name].css" : "vc.[name].[contenthash:8].css",
-      filename: "vc.[name].css",
-      // Disable to remove warnings about conflicting order between imports.
-      orderWarning: true
+      filename: "vc.[name].css"
     })
   ],
   // Static server which runs the playground on npm start.
   devServer: {
     open: true,
-    contentBase: "playground"
+    static: path.join(__dirname, "playground")
   }
 };