updated visium branch

client/configuration/webpack/webpack.config.dev.js

@@ -2,7 +2,6 @@ const path = require("path");
 const webpack = require("webpack");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 const FaviconsWebpackPlugin = require("favicons-webpack-plugin");
-const ScriptExtHtmlWebpackPlugin = require("script-ext-html-webpack-plugin");
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
 const { merge } = require("webpack-merge");
@@ -73,9 +72,6 @@ const devConfig = {
         CXG_SERVER_PORT: process.env.CXG_SERVER_PORT || "5005",
       }),
     }),
-    new ScriptExtHtmlWebpackPlugin({
-      async: "obsolete",
-    }),
   ],
   infrastructureLogging: {
     level: "warn",

client/configuration/webpack/webpack.config.prod.js

@@ -3,8 +3,6 @@ const webpack = require("webpack");
 const HtmlWebpackPlugin = require("html-webpack-plugin");
 const { CleanWebpackPlugin } = require("clean-webpack-plugin");
 const TerserJSPlugin = require("terser-webpack-plugin");
-const CleanCss = require("clean-css");
-const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
 const FaviconsWebpackPlugin = require("favicons-webpack-plugin");
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 
@@ -27,12 +25,7 @@ const prodConfig = {
   },
   optimization: {
     minimize: true,
-    minimizer: [
-      new TerserJSPlugin({}),
-      new OptimizeCSSAssetsPlugin({
-        cssProcessor: CleanCss,
-      }),
-    ],
+    minimizer: [new TerserJSPlugin({})],
   },
   devtool: "source-map",
   module: {

client/configuration/webpack/webpack.config.shared.js

@@ -1,22 +1,12 @@
 const path = require("path");
-const fs = require("fs");
 const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const ObsoleteWebpackPlugin = require("obsolete-webpack-plugin");
 // eslint-disable-next-line @blueprintjs/classes-constants -- incorrect match
-const ScriptExtHtmlWebpackPlugin = require("script-ext-html-webpack-plugin");
 
 const src = path.resolve("src");
 const nodeModules = path.resolve("node_modules");
 
 const publicPath = "";
 
-const rawObsoleteHTMLTemplate = fs.readFileSync(
-  `${__dirname}/obsoleteHTMLTemplate.html`,
-  "utf8"
-);
-
-const obsoleteHTMLTemplate = rawObsoleteHTMLTemplate.replace(/'/g, '"');
-
 module.exports = {
   entry: [
     "core-js",
@@ -61,14 +51,4 @@ module.exports = {
       },
     ],
   },
-  plugins: [
-    new ObsoleteWebpackPlugin({
-      name: "obsolete",
-      template: obsoleteHTMLTemplate,
-      promptOnNonTargetBrowser: false,
-    }),
-    new ScriptExtHtmlWebpackPlugin({
-      async: "obsolete",
-    }),
-  ],
 };

client/package.json

@@ -84,6 +84,8 @@
     "@babel/plugin-proposal-function-bind": "^7.10.5",
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4",
     "@babel/plugin-proposal-optional-chaining": "^7.10.4",
+    "@babel/plugin-proposal-private-methods": "^7.18.6",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@babel/plugin-transform-react-constant-elements": "^7.13.13",
     "@babel/plugin-transform-runtime": "^7.13.15",
     "@babel/preset-env": "^7.13.15",
@@ -133,12 +135,9 @@
     "lodash.map": "^4.6.0",
     "lodash.zip": "^4.2.0",
     "mini-css-extract-plugin": "^1.5.0",
-    "obsolete-webpack-plugin": "^0.5.6",
-    "optimize-css-assets-webpack-plugin": "^5.0.3",
     "prettier": "^2.0.5",
     "puppeteer": "^8.0.0",
     "rimraf": "^3.0.2",
-    "script-ext-html-webpack-plugin": "^2.1.4",
     "serve-favicon": "^2.5.0",
     "terser-webpack-plugin": "^5.1.1",
     "webpack": "^5.34.0",

client/src/components/menubar/index.js

@@ -275,14 +275,14 @@ class MenuBar extends React.PureComponent {
         {layoutChoice?.available?.includes(globals.spatialEmbeddingKeyword) && (
           <ButtonGroup className={styles.menubarButton}>
             <Tooltip
-              content={"Toggle image"}
+              content="Toggle image"
               position="bottom"
               hoverOpenDelay={globals.tooltipHoverOpenDelay}
             >
               <AnchorButton
                 type="button"
                 data-testid="toggle-image-underlay"
-                icon={"media"}
+                icon="media"
                 intent={imageUnderlay.isActive ? "primary" : "none"}
                 active={imageUnderlay.isActive}
                 onClick={() => {