From 3e64186e1e5ee18583883867a9bc3ffc19fc3899 Mon Sep 17 00:00:00 2001 From: Dan Piet Date: Tue, 21 Dec 2021 16:18:35 -0500 Subject: [PATCH 1/3] [UI] Upgrade UI packages and resolve errors --- ui/build/webpack.dev.conf.js | 10 - ui/build/webpack.prod.conf.js | 2 - ui/package.json | 37 +- ui/src/components/Flags.vue | 77 +- ui/src/components/Flags/Flag.vue | 63 +- ui/src/components/Flags/Rule.vue | 2 +- ui/src/components/Flags/Targeting.vue | 32 +- ui/src/components/Segments.vue | 79 +- ui/src/components/Segments/Segment.vue | 68 +- ui/yarn.lock | 6623 +++++++++++------------- 10 files changed, 3167 insertions(+), 3826 deletions(-) diff --git a/ui/build/webpack.dev.conf.js b/ui/build/webpack.dev.conf.js index ab38b4b386..571a70dd81 100755 --- a/ui/build/webpack.dev.conf.js +++ b/ui/build/webpack.dev.conf.js @@ -23,31 +23,21 @@ const devWebpackConfig = merge(baseWebpackConfig, { // these devServer options should be customized in /config/index.js devServer: { - clientLogLevel: 'warning', historyApiFallback: { rewrites: [ { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') }, ], }, hot: true, - contentBase: false, // since we use CopyWebpackPlugin. compress: true, host: HOST || config.dev.host, port: PORT || config.dev.port, open: config.dev.autoOpenBrowser, - overlay: config.dev.errorOverlay - ? { warnings: false, errors: true } - : false, - publicPath: config.dev.assetsPublicPath, proxy: { '/api': { target: 'http://localhost:8080', }, }, - quiet: true, // necessary for FriendlyErrorsPlugin - watchOptions: { - poll: config.dev.poll, - } }, plugins: [ new webpack.DefinePlugin({ diff --git a/ui/build/webpack.prod.conf.js b/ui/build/webpack.prod.conf.js index 0e243f70bf..a100aec711 100644 --- a/ui/build/webpack.prod.conf.js +++ b/ui/build/webpack.prod.conf.js @@ -100,8 +100,6 @@ const webpackConfig = merge(baseWebpackConfig, { // more options: // https://github.com/kangax/html-minifier#options-quick-reference }, - // necessary to consistently work with multiple chunks via CommonsChunkPlugin - chunksSortMode: 'dependency' }), // keep module.id stable when vendor modules does not change new webpack.HashedModuleIdsPlugin(), diff --git a/ui/package.json b/ui/package.json index 41e5141321..8765815718 100644 --- a/ui/package.json +++ b/ui/package.json @@ -5,7 +5,7 @@ "author": "Mark Phelps ", "private": true, "scripts": { - "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", + "dev": "webpack-dev-server --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "lint": "eslint --ext .js,.vue src __tests__", "build": "node build/build.js", @@ -13,13 +13,13 @@ }, "dependencies": { "axios": "^0.21.2", - "buefy": "^0.8.6", + "buefy": "^0.9.13", "bulma": "^0.8.0", "jpeg-js": "0.4.3", "lodash": "^4.17.21", - "node-sass": "^4.14.1", + "node-sass": "^6.0.0", "playwright": "^1.12.1", - "sass-loader": "^8.0.0", + "sass-loader": "^10.1.1", "uuid": "^3.3.2", "vue": "^2.6.14", "vue-moment": "^4.1.0", @@ -29,13 +29,13 @@ }, "devDependencies": { "@babel/core": "^7.7.2", - "@babel/plugin-proposal-class-properties": "^7.13.0", - "@babel/plugin-proposal-decorators": "^7.14.5", + "@babel/plugin-proposal-class-properties": "^7.16.5", + "@babel/plugin-proposal-decorators": "^7.16.4", "@babel/plugin-proposal-export-namespace-from": "^7.0.0", - "@babel/plugin-proposal-function-sent": "^7.14.5", + "@babel/plugin-proposal-function-sent": "^7.16.5", "@babel/plugin-proposal-json-strings": "^7.13.8", - "@babel/plugin-proposal-numeric-separator": "^7.0.0", - "@babel/plugin-proposal-throw-expressions": "^7.0.0", + "@babel/plugin-proposal-numeric-separator": "^7.16.5", + "@babel/plugin-proposal-throw-expressions": "^7.16.0", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/plugin-syntax-import-meta": "^7.0.0", "@babel/plugin-syntax-jsx": "^7.14.5", @@ -43,11 +43,12 @@ "@babel/plugin-transform-runtime": "^7.15.0", "@babel/preset-env": "^7.14.7", "@babel/runtime-corejs2": "^7.15.3", + "@webpack-cli/serve": "^1.6.0", "autoprefixer": "^9.6.1", "babel-eslint": "^10.0.1", "babel-helper-vue-jsx-merge-props": "^2.0.3", "babel-jest": "^27.2.4", - "babel-loader": "^8.2.2", + "babel-loader": "^8.2.3", "babel-plugin-transform-vue-jsx": "^4.0.1", "chalk": "^4.1.2", "copy-webpack-plugin": "^5.0.5", @@ -59,20 +60,20 @@ "eslint-loader": "^4.0.2", "eslint-plugin-import": "^2.24.2", "eslint-plugin-node": "^11.1.0", - "eslint-plugin-prettier": "^3.4.0", + "eslint-plugin-prettier": "^3.4.1", "eslint-plugin-promise": "^4.3.1", "eslint-plugin-standard": "^5.0.0", "eslint-plugin-vue": "^7.16.0", - "expect-playwright": "^0.2.6", + "expect-playwright": "^0.8.0", "file-loader": "^6.2.0", "friendly-errors-webpack-plugin": "^1.6.1", - "html-webpack-plugin": "^3.2.0", + "html-webpack-plugin": "^4.5.2", "jest": "~27.0.6", "mini-css-extract-plugin": "^0.8.0", - "node-notifier": "^10.0.0", + "node-notifier": "^8.0.1", "optimize-css-assets-webpack-plugin": "^6.0.1", "ora": "^4.0.3", - "playwright-core": "^1.17.1", + "playwright-core": "^1.5.2", "portfinder": "^1.0.13", "postcss-import": "^12.0.1", "postcss-loader": "^3.0.0", @@ -87,13 +88,13 @@ "vue-template-compiler": "^2.6.14", "webpack": "^4.46.0", "webpack-bundle-analyzer": "^4.4.2", - "webpack-cli": "^3.3.6", + "webpack-cli": "^4.3.0", "webpack-dev-server": "^4.6.0", "webpack-merge": "^4.2.1" }, "engines": { - "node": ">= 6.0.0", - "npm": ">= 3.0.0" + "node": ">= 16.0.0", + "npm": ">= 8.0.0" }, "browserslist": [ "> 1%", diff --git a/ui/src/components/Flags.vue b/ui/src/components/Flags.vue index 31d9a57ac3..1418b9ba8f 100644 --- a/ui/src/components/Flags.vue +++ b/ui/src/components/Flags.vue @@ -29,44 +29,51 @@ - - -