This is an automated email from the ASF dual-hosted git repository.
ccondit pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/yunikorn-web.git
The following commit(s) were added to refs/heads/master by this push:
new d714335 [YUNIKORN-2954] Remove so-called modular sidebar (#219)
d714335 is described below
commit d714335f0953b2030dadc5b2553ede0c63f2672f
Author: Craig Condit <[email protected]>
AuthorDate: Tue Oct 29 15:51:57 2024 -0500
[YUNIKORN-2954] Remove so-called modular sidebar (#219)
Remove the modular remote sidebar functionality, as it goes against the
open philosophy of Apache YuniKorn development.
This reverts commit 21ebe5d9b1bbfc2e1eea8bbb8440d2a8bd38af4e.
Closes: #219
---
Makefile | 4 +-
angular.json | 47 ++----
package.json | 7 +-
pnpm-lock.yaml | 165 ++++-----------------
src/app/app.module.ts | 4 -
.../allocations-drawer.component.html | 94 ------------
.../allocations-drawer.component.scss | 154 -------------------
.../allocations-drawer.component.spec.ts | 113 --------------
.../allocations-drawer.component.ts | 133 -----------------
.../components/apps-view/apps-view.component.html | 122 ++++++++++++---
.../components/apps-view/apps-view.component.scss | 92 +++++++-----
.../apps-view/apps-view.component.spec.ts | 59 ++------
.../components/apps-view/apps-view.component.ts | 111 ++++++--------
src/app/models/envconfig.model.ts | 2 -
src/app/services/envconfig/envconfig.service.ts | 15 +-
src/app/testing/mocks.ts | 2 -
src/assets/config/envconfig.json | 4 +-
src/bootstrap.ts | 31 ----
src/main.ts | 14 +-
tsconfig.app.json | 3 +-
tsconfig.json | 3 +-
webpack.config.js | 37 -----
webpack.prod.config.js | 19 ---
23 files changed, 273 insertions(+), 962 deletions(-)
diff --git a/Makefile b/Makefile
index dc84d88..8dbc072 100644
--- a/Makefile
+++ b/Makefile
@@ -195,9 +195,9 @@ OS := $(shell uname -s | tr '[:upper:]' '[:lower:]')
license-check:
@echo "checking license headers:"
ifeq (darwin,$(OS))
- $(shell mkdir -p "$(OUTPUT)" && find -E . -not \( -path './.git*'
-prune \) -not \( -path ./coverage -prune \) -not \( -path ./node_modules
-prune \) -not \( -path ./build -prune \) -not \( -path ./tools -prune \) -not
-path ./pnpm-lock.yaml -not \( -path ./dist -prune \) -regex
".*\.(go|sh|md|conf|yaml|yml|html|mod|js)" -exec grep -L "Licensed to the
Apache Software Foundation" {} \; > "$(OUTPUT)/license-check.txt")
+ $(shell mkdir -p "$(OUTPUT)" && find -E . -not \( -path './.git*'
-prune \) -not \( -path ./coverage -prune \) -not \( -path ./node_modules
-prune \) -not \( -path ./build -prune \) -not \( -path ./tools -prune \) -not
-path ./pnpm-lock.yaml -regex ".*\.(go|sh|md|conf|yaml|yml|html|mod)" -exec
grep -L "Licensed to the Apache Software Foundation" {} \; >
"$(OUTPUT)/license-check.txt")
else
- $(shell mkdir -p "$(OUTPUT)" && find . -not \( -path './.git*' -prune
\) -not \( -path ./coverage -prune \) -not \( -path ./node_modules -prune \)
-not \( -path ./build -prune \) -not \( -path ./tools -prune \) -not -path
./pnpm-lock.yaml -not \( -path ./node_modules -prune \) -regex
".*\.\(go\|sh\|md\|conf\|yaml\|yml\|html\|mod\|js\)" -exec grep -L "Licensed to
the Apache Software Foundation" {} \; > "$(OUTPUT)/license-check.txt")
+ $(shell mkdir -p "$(OUTPUT)" && find . -not \( -path './.git*' -prune
\) -not \( -path ./coverage -prune \) -not \( -path ./node_modules -prune \)
-not \( -path ./build -prune \) -not \( -path ./tools -prune \) -not -path
./pnpm-lock.yaml -regex ".*\.\(go\|sh\|md\|conf\|yaml\|yml\|html\|mod\)" -exec
grep -L "Licensed to the Apache Software Foundation" {} \; >
"$(OUTPUT)/license-check.txt")
endif
@if [ -s "$(OUTPUT)/license-check.txt" ]; then \
echo "following files are missing license header:" ; \
diff --git a/angular.json b/angular.json
index da0bfdf..9fce7aa 100644
--- a/angular.json
+++ b/angular.json
@@ -22,7 +22,7 @@
"prefix": "app",
"architect": {
"build": {
- "builder": "ngx-build-plus:browser",
+ "builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/yunikorn-web",
"index": "src/index.html",
@@ -30,24 +30,14 @@
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"inlineStyleLanguage": "scss",
- "assets": [
- "src/favicon.ico",
- "src/assets",
- {
- "glob": "LICENSE",
- "input": "./",
- "output": "./"
- }
- ],
+ "assets": ["src/favicon.ico", "src/assets", {"glob": "LICENSE",
"input": "./", "output": "./"}],
"styles": [
"src/styles.scss",
"node_modules/@fontsource/roboto/index.css",
"node_modules/@fontsource/roboto/500.css",
"node_modules/@fortawesome/fontawesome-free/css/all.css"
],
- "scripts": [],
- "extraWebpackConfig": "webpack.config.js",
- "commonChunk": false
+ "scripts": []
},
"configurations": {
"production": {
@@ -69,8 +59,7 @@
"with": "src/environments/environment.prod.ts"
}
],
- "outputHashing": "all",
- "extraWebpackConfig": "webpack.prod.config.js"
+ "outputHashing": "all"
},
"development": {
"buildOptimizer": false,
@@ -84,28 +73,21 @@
"defaultConfiguration": "production"
},
"serve": {
- "builder": "ngx-build-plus:dev-server",
+ "builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
- "browserTarget": "yunikorn-web:build:production",
- "extraWebpackConfig": "webpack.prod.config.js"
+ "browserTarget": "yunikorn-web:build:production"
},
"development": {
"buildTarget": "yunikorn-web:build:development"
}
},
- "defaultConfiguration": "development",
- "options": {
- "port": 4200,
- "publicHost": "http://localhost:4200",
- "extraWebpackConfig": "webpack.config.js"
- }
+ "defaultConfiguration": "development"
},
"extract-i18n": {
- "builder": "ngx-build-plus:extract-i18n",
+ "builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
- "browserTarget": "yunikorn-web:build",
- "extraWebpackConfig": "webpack.config.js"
+ "browserTarget": "yunikorn-web:build"
}
},
"test": {
@@ -116,17 +98,12 @@
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"inlineStyleLanguage": "scss",
- "assets": [
- "src/favicon.ico",
- "src/assets"
- ],
- "styles": [
- "src/styles.scss"
- ],
+ "assets": ["src/favicon.ico", "src/assets"],
+ "styles": ["src/styles.scss"],
"scripts": []
}
}
}
}
}
-}
\ No newline at end of file
+}
diff --git a/package.json b/package.json
index de48204..c541154 100644
--- a/package.json
+++ b/package.json
@@ -13,8 +13,7 @@
"build:prod": "ng build --configuration production",
"start:srv": "json-server --watch json-db.json",
"test:coverage": "ng test --code-coverage
--karma-config=./karma.conf.ci.js",
- "prettify": "prettier --config ./.prettierrc --write
'src/**/*.{js,ts,json,css,scss,md,html}'",
- "run:all": "node
node_modules/@angular-architects/module-federation/src/server/mf-dev-server.js"
+ "prettify": "prettier --config ./.prettierrc --write
'src/**/*.{js,ts,json,css,scss,md,html}'"
},
"private": true,
"husky": {
@@ -29,7 +28,6 @@
]
},
"dependencies": {
- "@angular-architects/module-federation": "^18.0.6",
"@angular/animations": "^18.2.6",
"@angular/cdk": "^18.2.6",
"@angular/common": "^18.2.6",
@@ -83,7 +81,6 @@
"karma-super-dots-reporter": "^0.2.0",
"lint-staged": "^15.2.10",
"ng-mocks": "^14.13.1",
- "ngx-build-plus": "^18.0.0",
"prettier": "^3.3.3",
"puppeteer": "^23.4.1",
"typescript": "5.5.4"
@@ -93,4 +90,4 @@
"pnpm": "9"
},
"packageManager": "pnpm@9"
-}
\ No newline at end of file
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 7b53e82..b8b9ef9 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8,9 +8,6 @@ importers:
.:
dependencies:
- '@angular-architects/module-federation':
- specifier: ^18.0.6
- version:
18.0.6(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))([email protected])
'@angular/animations':
specifier: ^18.2.6
version: 18.2.6(@angular/[email protected]([email protected])([email protected]))
@@ -165,9 +162,6 @@ importers:
ng-mocks:
specifier: ^14.13.1
version:
14.13.1(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))(@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))(@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))(@angular/[email protected](@angular/[email protected]([email protected])(z
[...]
- ngx-build-plus:
- specifier: ^18.0.0
- version:
18.0.0(@angular-devkit/[email protected](@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))([email protected]))(@types/[email protected])([email protected])([email protected])([email protected]))([email protected])([email protected])
prettier:
specifier: ^3.3.3
version: 3.3.3
@@ -184,15 +178,6 @@ packages:
resolution: {integrity:
sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
engines: {node: '>=6.0.0'}
- '@angular-architects/[email protected]':
- resolution: {integrity:
sha512-rOpuNxg48Lk9ZrNRMcCvMu1D3MhnKPqLw7xhtX8Qva5BOuaQ3gMtBZI4NM5eI8WqPlZNbzVxMNrVzSKaxDApZQ==}
- peerDependencies:
- '@angular/common': '>=18.0.0'
- '@angular/core': '>=18.0.0'
-
- '@angular-architects/[email protected]':
- resolution: {integrity:
sha512-uI7Yqs8OM4leakD7sdnk2Pt+bIt9nLGbo6xcYGpLoTWpS0OnCQRQJinNCynAL+F+4NEzNToeNSXXKgffDuQtCQ==}
-
'@angular-devkit/[email protected]':
resolution: {integrity:
sha512-oF7cPFdTLxeuvXkK/opSdIxZ1E4LrBbmuytQ/nCoAGOaKBWdqvwagRZ6jVhaI0Gwu48rkcV7Zhesg/ESNnROdw==}
engines: {node: ^18.19.1 || ^20.11.1 || >=22.0.0, npm: ^6.11.0 || ^7.5.6
|| >=8.0.0, yarn: '>= 1.13.0'}
@@ -2171,9 +2156,6 @@ packages:
resolution: {integrity:
sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==}
engines: {node: '>= 0.4'}
- [email protected]:
- resolution: {integrity:
sha512-0vdNRFXn5q+dtOqjfFtmtlI9N2eVZ7LMyEV2iKC5mEEFvSg/69Ml6b/WU2qF8W1nLRa0wiSrDT3Y5jOHZCwKPQ==}
-
[email protected]:
resolution: {integrity:
sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
engines: {node: '>=6'}
@@ -2377,6 +2359,7 @@ packages:
[email protected]:
resolution: {integrity:
sha512-Oyqew0FGM0wYUSNqR0L6AteO5MpMoUU0rhKRieXeiKs+PmRTxiJMyaunYB2KF6fQ3dzChXKCpbFOEJx3OQ1v/Q==}
+ deprecated: Ownership of Critters has moved to the Nuxt team, who will be
maintaining the project going forward. If you'd like to keep using Critters,
please switch to the actively-maintained fork at
https://github.com/danielroe/beasties
[email protected]:
resolution: {integrity:
sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
@@ -3682,12 +3665,6 @@ packages:
'@angular/forms': 5.0.0-alpha - 5 || 6.0.0-alpha - 6 || 7.0.0-alpha - 7
|| 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 || 11.0.0-alpha - 11
|| 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha - 14 || 15.0.0-alpha
- 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17 || 18.0.0-alpha - 18
'@angular/platform-browser': 5.0.0-alpha - 5 || 6.0.0-alpha - 6 ||
7.0.0-alpha - 7 || 8.0.0-alpha - 8 || 9.0.0-alpha - 9 || 10.0.0-alpha - 10 ||
11.0.0-alpha - 11 || 12.0.0-alpha - 12 || 13.0.0-alpha - 13 || 14.0.0-alpha -
14 || 15.0.0-alpha - 15 || 16.0.0-alpha - 16 || 17.0.0-alpha - 17 ||
18.0.0-alpha - 18
- [email protected]:
- resolution: {integrity:
sha512-dmnD5CpwopUPoN51ysoTLkS7Csqkgbs2dNLL5QI5pIhV4MxDXNE8+75QTwy8EPvK37t8RjGCTBdOqmAp8Rpa/g==}
- peerDependencies:
- '@angular-devkit/build-angular': ^18.0.0
- rxjs: '>= 6.0.0'
-
[email protected]:
resolution: {integrity:
sha512-VWDSvLlCnaWqu0W1L+ybQIRHTbd+GffkX1sWs++iMPXMGVJ2ZCuzW32FHnu+p0regMUHU8r1/rvUcFD0YooJxQ==}
peerDependencies:
@@ -3705,15 +3682,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==}
- [email protected]:
- resolution: {integrity:
sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==}
- engines: {node: 4.x || >=6.0.0}
- peerDependencies:
- encoding: ^0.1.0
- peerDependenciesMeta:
- encoding:
- optional: true
-
[email protected]:
resolution: {integrity:
sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==}
engines: {node: '>= 6.13.0'}
@@ -4609,9 +4577,6 @@ packages:
resolution: {integrity:
sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==}
engines: {node: '>=0.6'}
- [email protected]:
- resolution: {integrity:
sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==}
-
[email protected]:
resolution: {integrity:
sha512-dpev9ABuLWdEubk+cIaI9cHwRNNDjkBBLXTwI4UCUFdQ5xXKqNXoK4FEciw/vxf+NQ7Cb7sGUyeUtORvHIdRXQ==}
engines: {node: '>=10.0'}
@@ -4783,9 +4748,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-DEAoo25RfSYMuTGc9vPJzZcZullwIqRDSI9LOy+fkCJPi6hykCnfKaXTuPBDuXAUcqHXyOgFtHNp/kB2FjYHbw==}
- [email protected]:
- resolution: {integrity:
sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==}
-
[email protected]:
resolution: {integrity:
sha512-xOO8n6eggxnwYpy1NlzUKpvrjfJTvae5/D6WOK0S2LSo7vjmo5gCM1DbLUmFqrMTJP+W/0YZNctm7jasWvLuBA==}
engines: {node: '>= 18.12.0'}
@@ -4808,10 +4770,6 @@ packages:
webpack-cli:
optional: true
- [email protected]:
- resolution: {integrity:
sha512-+4zXKdx7UnO+1jaN4l2lHVD+mFvnlZQP/6ljaJVb4SZiwIKeUnrT5l0gkT8z+n4hKpC+jpOv6O9R+gLtag7pSA==}
- engines: {node: '>=10.0.0'}
-
[email protected]:
resolution: {integrity:
sha512-hXXvrjtx2PLYx4qruKl+kyRSLc52V+cCvMxRjmKwoA+CBbbF5GfIBtR6kCvl0fYGqTUPKB+1ktVmTHqMOzgCBg==}
engines: {node: '>=18.0.0'}
@@ -4848,9 +4806,6 @@ packages:
resolution: {integrity:
sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==}
engines: {node: '>=0.8.0'}
- [email protected]:
- resolution: {integrity:
sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
-
[email protected]:
resolution: {integrity:
sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==}
hasBin: true
@@ -4868,10 +4823,6 @@ packages:
[email protected]:
resolution: {integrity:
sha512-CC1bOL87PIWSBhDcTrdeLo6eGT7mCFtrg0uIJtqJUFyK+eJnzl8A1niH56uu7KMa5XFrtiV+AQuHO3n7DsHnLQ==}
- [email protected]:
- resolution: {integrity:
sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
- engines: {node: '>=0.10.0'}
-
[email protected]:
resolution: {integrity:
sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==}
engines: {node: '>=8'}
@@ -4970,24 +4921,6 @@ snapshots:
'@jridgewell/gen-mapping': 0.3.5
'@jridgewell/trace-mapping': 0.3.25
-
'@angular-architects/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))':
- dependencies:
- '@angular/common':
18.2.6(@angular/[email protected]([email protected])([email protected]))([email protected])
- '@angular/core': 18.2.6([email protected])([email protected])
- tslib: 2.7.0
-
-
'@angular-architects/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))([email protected])':
- dependencies:
- '@angular-architects/module-federation-runtime':
18.0.6(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))
- callsite: 1.0.0
- node-fetch: 2.7.0([email protected])
- semver: 7.6.3
- word-wrap: 1.2.5
- transitivePeerDependencies:
- - '@angular/common'
- - '@angular/core'
- - encoding
-
'@angular-devkit/[email protected]([email protected])':
dependencies:
'@angular-devkit/core': 18.2.6([email protected])
@@ -4999,7 +4932,7 @@ snapshots:
dependencies:
'@ampproject/remapping': 2.3.0
'@angular-devkit/architect': 0.1802.6([email protected])
- '@angular-devkit/build-webpack':
0.1802.6([email protected])([email protected]([email protected]([email protected])))([email protected]([email protected]))
+ '@angular-devkit/build-webpack':
0.1802.6([email protected])([email protected]([email protected]))([email protected]([email protected]))
'@angular-devkit/core': 18.2.6([email protected])
'@angular/build':
18.2.6(@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))([email protected]))(@types/[email protected])([email protected])([email protected])([email protected])([email protected])([email protected])
'@angular/compiler-cli':
18.2.6(@angular/[email protected](@angular/[email protected]([email protected])([email protected])))([email protected])
@@ -5057,8 +4990,8 @@ snapshots:
vite: 5.4.6(@types/[email protected])([email protected])([email protected])([email protected])
watchpack: 2.4.1
webpack: 5.94.0([email protected])
- webpack-dev-middleware: 7.4.2([email protected]([email protected]))
- webpack-dev-server: 5.0.4([email protected]([email protected]))
+ webpack-dev-middleware: 7.4.2([email protected])
+ webpack-dev-server: 5.0.4([email protected])
webpack-merge: 6.0.1
webpack-subresource-integrity: 5.1.0([email protected]([email protected]))
optionalDependencies:
@@ -5082,12 +5015,12 @@ snapshots:
- utf-8-validate
- webpack-cli
-
'@angular-devkit/[email protected]([email protected])([email protected]([email protected]([email protected])))([email protected]([email protected]))':
+
'@angular-devkit/[email protected]([email protected])([email protected]([email protected]))([email protected]([email protected]))':
dependencies:
'@angular-devkit/architect': 0.1802.6([email protected])
rxjs: 7.8.1
webpack: 5.94.0([email protected])
- webpack-dev-server: 5.0.4([email protected]([email protected]))
+ webpack-dev-server: 5.0.4([email protected])
transitivePeerDependencies:
- chokidar
@@ -7169,8 +7102,6 @@ snapshots:
get-intrinsic: 1.2.4
set-function-length: 1.2.2
- [email protected]: {}
-
[email protected]: {}
[email protected]: {}
@@ -7387,7 +7318,7 @@ snapshots:
dom-serializer: 2.0.0
domhandler: 5.0.3
htmlparser2: 8.0.2
- postcss: 8.4.41
+ postcss: 8.4.47
postcss-media-query-parser: 0.2.3
[email protected]:
@@ -7398,12 +7329,12 @@ snapshots:
[email protected]([email protected]([email protected])):
dependencies:
- icss-utils: 5.1.0([email protected])
- postcss: 8.4.41
- postcss-modules-extract-imports: 3.1.0([email protected])
- postcss-modules-local-by-default: 4.0.5([email protected])
- postcss-modules-scope: 3.2.0([email protected])
- postcss-modules-values: 4.0.0([email protected])
+ icss-utils: 5.1.0([email protected])
+ postcss: 8.4.47
+ postcss-modules-extract-imports: 3.1.0([email protected])
+ postcss-modules-local-by-default: 4.0.5([email protected])
+ postcss-modules-scope: 3.2.0([email protected])
+ postcss-modules-values: 4.0.0([email protected])
postcss-value-parser: 4.2.0
semver: 7.6.3
optionalDependencies:
@@ -8143,9 +8074,9 @@ snapshots:
dependencies:
safer-buffer: 2.1.2
- [email protected]([email protected]):
+ [email protected]([email protected]):
dependencies:
- postcss: 8.4.41
+ postcss: 8.4.47
[email protected]: {}
@@ -8824,15 +8755,6 @@ snapshots:
'@angular/forms':
18.2.6(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))(@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected])))([email protected])
'@angular/platform-browser':
18.2.6(@angular/[email protected](@angular/[email protected]([email protected])([email protected])))(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected]))
-
[email protected](@angular-devkit/[email protected](@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))([email protected]))(@types/[email protected])([email protected])([email protected])([email protected]))([email protected])([email protected]):
- dependencies:
- '@angular-devkit/build-angular':
18.2.6(@angular/[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))([email protected]))(@types/[email protected])([email protected])([email protected])([email protected])
- '@schematics/angular': 18.2.6([email protected])
- rxjs: 7.8.1
- webpack-merge: 5.10.0
- transitivePeerDependencies:
- - chokidar
-
[email protected](@angular/[email protected](@angular/[email protected]([email protected])([email protected])))(@angular/[email protected](@angular/[email protected]([email protected])([email protected]))([email protected]))(@angular/[email protected]([email protected])([email protected])):
dependencies:
'@angular/animations':
18.2.6(@angular/[email protected]([email protected])([email protected]))
@@ -8851,12 +8773,6 @@ snapshots:
[email protected]: {}
- [email protected]([email protected]):
- dependencies:
- whatwg-url: 5.0.0
- optionalDependencies:
- encoding: 0.1.13
-
[email protected]: {}
[email protected]:
@@ -9159,26 +9075,26 @@ snapshots:
[email protected]: {}
- [email protected]([email protected]):
+ [email protected]([email protected]):
dependencies:
- postcss: 8.4.41
+ postcss: 8.4.47
- [email protected]([email protected]):
+ [email protected]([email protected]):
dependencies:
- icss-utils: 5.1.0([email protected])
- postcss: 8.4.41
+ icss-utils: 5.1.0([email protected])
+ postcss: 8.4.47
postcss-selector-parser: 6.1.2
postcss-value-parser: 4.2.0
- [email protected]([email protected]):
+ [email protected]([email protected]):
dependencies:
- postcss: 8.4.41
+ postcss: 8.4.47
postcss-selector-parser: 6.1.2
- [email protected]([email protected]):
+ [email protected]([email protected]):
dependencies:
- icss-utils: 5.1.0([email protected])
- postcss: 8.4.41
+ icss-utils: 5.1.0([email protected])
+ postcss: 8.4.47
[email protected]:
dependencies:
@@ -9328,7 +9244,7 @@ snapshots:
[email protected]:
dependencies:
- '@babel/runtime': 7.25.0
+ '@babel/runtime': 7.25.6
[email protected]: {}
@@ -9358,7 +9274,7 @@ snapshots:
adjust-sourcemap-loader: 4.0.0
convert-source-map: 1.9.0
loader-utils: 2.0.4
- postcss: 8.4.41
+ postcss: 8.4.47
source-map: 0.6.1
[email protected]:
@@ -9831,7 +9747,7 @@ snapshots:
mkdirp: 1.0.4
yallist: 4.0.0
- [email protected]([email protected])([email protected]([email protected])):
+ [email protected]([email protected])([email protected]):
dependencies:
'@jridgewell/trace-mapping': 0.3.25
jest-worker: 27.5.1
@@ -9875,8 +9791,6 @@ snapshots:
[email protected]: {}
- [email protected]: {}
-
[email protected]([email protected]):
dependencies:
tslib: 2.7.0
@@ -10000,9 +9914,7 @@ snapshots:
[email protected]: {}
- [email protected]: {}
-
- [email protected]([email protected]([email protected])):
+ [email protected]([email protected]):
dependencies:
colorette: 2.0.20
memfs: 4.12.0
@@ -10013,7 +9925,7 @@ snapshots:
optionalDependencies:
webpack: 5.94.0([email protected])
- [email protected]([email protected]([email protected])):
+ [email protected]([email protected]):
dependencies:
'@types/bonjour': 3.5.13
'@types/connect-history-api-fallback': 1.5.4
@@ -10043,7 +9955,7 @@ snapshots:
serve-index: 1.9.1
sockjs: 0.3.24
spdy: 4.0.2
- webpack-dev-middleware: 7.4.2([email protected]([email protected]))
+ webpack-dev-middleware: 7.4.2([email protected])
ws: 8.18.0
optionalDependencies:
webpack: 5.94.0([email protected])
@@ -10053,12 +9965,6 @@ snapshots:
- supports-color
- utf-8-validate
- [email protected]:
- dependencies:
- clone-deep: 4.0.1
- flat: 5.0.2
- wildcard: 2.0.1
-
[email protected]:
dependencies:
clone-deep: 4.0.1
@@ -10094,7 +10000,7 @@ snapshots:
neo-async: 2.6.2
schema-utils: 3.3.0
tapable: 2.2.1
- terser-webpack-plugin:
5.3.10([email protected])([email protected]([email protected]))
+ terser-webpack-plugin: 5.3.10([email protected])([email protected])
watchpack: 2.4.1
webpack-sources: 3.2.3
transitivePeerDependencies:
@@ -10110,11 +10016,6 @@ snapshots:
[email protected]: {}
- [email protected]:
- dependencies:
- tr46: 0.0.3
- webidl-conversions: 3.0.1
-
[email protected]:
dependencies:
isexe: 2.0.0
@@ -10129,8 +10030,6 @@ snapshots:
[email protected]: {}
- [email protected]: {}
-
[email protected]:
dependencies:
ansi-styles: 4.3.0
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 8fcac29..413394b 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -63,8 +63,6 @@ import { HealthchecksComponent } from
'@app/components/healthchecks/healthchecks
import { AppNodeUtilizationsComponent } from
'@app/components/app-node-utilizations/app-node-utilizations.component';
import { VerticalBarChartComponent } from
'@app/components/vertical-bar-chart/vertical-bar-chart.component';
import { LicensesModalComponent } from
'@app/components/licenses-modal/licenses-modal.component';
-import { AllocationsDrawerComponent } from
'@app/components/allocations-drawer/allocations-drawer.component';
-import { MatChipsModule } from '@angular/material/chips';
@NgModule({
declarations: [
@@ -87,7 +85,6 @@ import { MatChipsModule } from '@angular/material/chips';
AppNodeUtilizationsComponent,
VerticalBarChartComponent,
LicensesModalComponent,
- AllocationsDrawerComponent,
],
imports: [
BrowserModule,
@@ -114,7 +111,6 @@ import { MatChipsModule } from '@angular/material/chips';
MatExpansionModule,
MatIconModule,
MatDialogModule,
- MatChipsModule,
],
providers: [
{
diff --git
a/src/app/components/allocations-drawer/allocations-drawer.component.html
b/src/app/components/allocations-drawer/allocations-drawer.component.html
deleted file mode 100644
index b0b6629..0000000
--- a/src/app/components/allocations-drawer/allocations-drawer.component.html
+++ /dev/null
@@ -1,94 +0,0 @@
-<!--
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- -->
-
-<mat-drawer-container class="flex-primary" [hasBackdrop]="false">
- <mat-drawer #matDrawer mode="over" position="end">
- <mat-drawer-content>
- <div class="header">
- <span>{{ selectedRow?.applicationId }} ({{
selectedRow?.allocations?.length }} allocations)</span>
- <span class="far fa-clipboard copy-btn" (click)="copyLinkToClipboard()"
- matTooltip="Click to copy the URL to this view"
matTooltipShowDelay="500"></span>
- <span class="far fa-solid fa-xmark close-btn"
(click)="closeDrawer()"></span>
- </div>
- <div class="content">
-
- <mat-table [dataSource]="allocDataSource" matSort #allocSort="matSort">
- <ng-container [matColumnDef]="columnDef.colId" *ngFor="let columnDef
of allocColumnDef">
- <mat-header-cell *matHeaderCellDef mat-sort-header
[style.flex]="columnDef?.colWidth || 1">{{
- columnDef.colName }}</mat-header-cell>
-
- <ng-container *ngIf="columnDef.colId === 'priority'; else
renderNext_3">
- <mat-cell class="small" *matCellDef="let element"
[style.flex]="columnDef?.colWidth || 1"
- [title]="element[columnDef.colId]">{{
- element['priority'] }} </mat-cell>
- </ng-container>
-
- <ng-container *ngIf="columnDef.colId === 'resource'; else
renderNext_3">
- <mat-cell *matCellDef="let element" class="allocations-data"
[style.flex]="columnDef?.colWidth || 1"
- matTooltip="
- {{element[columnDef.colId]}}"
matTooltipShowDelay="500">
- <ng-container *ngIf="columnDef.colFormatter; else
showAllocRowData;">
- <ng-container
*ngIf="columnDef.colFormatter(element[columnDef.colId]) as colValue">
- <ul class="mat-res-ul">
- <ng-container *ngFor="let resource of
formatResources(colValue); let i = index">
- <li class="mat-res-li" *ngIf="i<1">
- {{ resource }}
- </li>
- <li class="mat-res-li" *ngIf="i>=1 &&
element['expanded']">
- {{ resource }}
- </li>
- </ng-container>
- </ul>
- </ng-container>
- </ng-container>
- <ng-template #showAllocRowData>
- <span>{{ element[columnDef.colId] }}</span>
- </ng-template>
- </mat-cell>
- </ng-container>
-
- <ng-template #renderNext_3>
- <mat-cell *matCellDef="let element" [class]="element['expanded']
? '' : 'ellipsis'"
- [style.flex]="columnDef?.colWidth || 1"
matTooltip="{{element[columnDef.colId]}}"
- matTooltipShowDelay="500">{{ element[columnDef.colId] || 'n/a'
- }}</mat-cell>
- </ng-template>
- </ng-container>
-
- <ng-container matColumnDef="noRecord">
- <mat-footer-cell *matFooterCellDef>
- <div class="no-record">No records found</div>
- </mat-footer-cell>
- </ng-container>
-
- <mat-header-row *matHeaderRowDef="allocColumnIds"></mat-header-row>
-
- <mat-row *matRowDef="let row; columns: allocColumnIds; let i =
index" (click)="allocationsDetailToggle(i)"
- [ngClass]="{'even-row': i % 2 === 0, 'row': true}"></mat-row>
-
- <mat-footer-row *matFooterRowDef="['noRecord']"
- [ngStyle]="{ display: isAllocDataSourceEmpty() ? '' : 'none'
}"></mat-footer-row>
- </mat-table>
-
- <mat-paginator #allocationMatPaginator [pageSizeOptions]="[10, 20, 50,
100]" [pageSize]="50"
- [ngStyle]="{ display: isAllocDataSourceEmpty() ? 'none' : '' }"
showFirstLastButtons></mat-paginator>
-
- </div>
- </mat-drawer-content>
- </mat-drawer>
-</mat-drawer-container>
\ No newline at end of file
diff --git
a/src/app/components/allocations-drawer/allocations-drawer.component.scss
b/src/app/components/allocations-drawer/allocations-drawer.component.scss
deleted file mode 100644
index 604b73b..0000000
--- a/src/app/components/allocations-drawer/allocations-drawer.component.scss
+++ /dev/null
@@ -1,154 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-.mat-drawer-container {
- min-width: 430px;
- width: 55%;
- height: calc(100vh - 60px);
- background: transparent;
- pointer-events: none;
- position: absolute;
- right: 0;
- bottom: 0;
- .mat-drawer {
- pointer-events: auto;
- width: 100%;
- .content {
- padding: 0 10px;
- }
- }
-
- .full-row-height {
- border: 1px solid red;
- }
-
- .mat-mdc-header-cell {
- font-size: 15px;
- font-weight: bold;
- color: #666;
- }
- .mat-mdc-cell {
- color: #333;
- display: flex;
- flex-direction: column;
- align-items: flex-start;
- .mat-res-ul{
- padding: 0;
- margin: 0;
- .mat-res-li{
- list-style-type: none;
- }
- }
- .mat-toggle-more {
- display: block;
- color: #a1a3b7;
- padding: 5px 45px 0 0;
- &:hover {
- color: #8d00d4;
- }
- }
- }
- .mat-mdc-row {
- &:hover {
- background: #cccccc;
- cursor: pointer;
- }
- &.selected-row {
- background: #303d54;
- .mat-mdc-cell {
- color: #fff;
- .mat-toggle-more {
- color: #b8bbff;
- &:hover {
- color: #b871dc;
- }
- }
- }
- }
- }
- .mat-mdc-header-cell.indicator-icon,
- .mat-mdc-cell.indicator-icon {
- max-width: 40px;
- font-size: 18px;
- margin-left: 10px;
- }
-
- .close-btn {
- float: right;
- font-size: 1.2em;
- cursor: pointer;
- padding-right: 5px;
- &:hover {
- color: #f44336;
- }
- }
- .copy-btn {
- font-size: 1em;
- cursor: pointer;
- padding-left: 5px;
- }
- .header {
- margin: 20px;
- font-weight: 100;
- font-size: 1em;
- }
- .content {
- border-top: 1px solid #e1e1e1;
- }
- .item-wrapper {
- .left-item {
- text-align: right;
- }
- .left-item,
- .right-item {
- width: 50%;
- padding: 6px;
- padding-right: 0;
- color: #666;
- }
- .right-item {
- font-weight: 600;
- }
- }
- .app-link {
- text-decoration: none;
- color: #666;
- &:hover {
- text-decoration: underline;
- }
- }
-
- .row {
- font-size: 0.9em;
- }
-
- .even-row {
- background: #eee;
- }
-
- .ellipsis {
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- display: inline-block;
- }
-
- .row {
- min-height: unset;
- }
-}
\ No newline at end of file
diff --git
a/src/app/components/allocations-drawer/allocations-drawer.component.spec.ts
b/src/app/components/allocations-drawer/allocations-drawer.component.spec.ts
deleted file mode 100644
index 49b8ec2..0000000
--- a/src/app/components/allocations-drawer/allocations-drawer.component.spec.ts
+++ /dev/null
@@ -1,113 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { DebugElement } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatDividerModule } from '@angular/material/divider';
-import { MatInputModule } from '@angular/material/input';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import { MatSelectModule } from '@angular/material/select';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { MatSortModule } from '@angular/material/sort';
-import { MatTableDataSource, MatTableModule } from '@angular/material/table';
-import { By } from '@angular/platform-browser';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { NgxSpinnerService } from 'ngx-spinner';
-
-import { MockNgxSpinnerService } from '@app/testing/mocks';
-import { AllocationInfo } from '@app/models/alloc-info.model';
-
-import { AllocationsDrawerComponent } from './allocations-drawer.component';
-
-describe('AllocationsDrawerComponent', () => {
- let component: AllocationsDrawerComponent;
- let fixture: ComponentFixture<AllocationsDrawerComponent>;
-
- beforeEach(() => {
- TestBed.configureTestingModule({
- declarations: [AllocationsDrawerComponent],
- imports: [
- NoopAnimationsModule,
- MatSidenavModule,
- MatPaginatorModule,
- MatDividerModule,
- MatSortModule,
- MatInputModule,
- MatTableModule,
- MatSelectModule,
- ],
- providers: [{ provide: NgxSpinnerService, useValue:
MockNgxSpinnerService }],
- }).compileComponents();
- fixture = TestBed.createComponent(AllocationsDrawerComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-
- it('should open drawer', () => {
- spyOn(component.matDrawer, 'open');
- component.openDrawer();
- expect(component.matDrawer.open).toHaveBeenCalled();
- });
-
- it('should close drawer', () => {
- spyOn(component.matDrawer, 'close');
- component.closeDrawer();
- expect(component.matDrawer.close).toHaveBeenCalled();
- });
-
- it('should copy the allocations URL to clipboard', () => {
- const debugEl: DebugElement = fixture.debugElement;
- const copyButton = debugEl.query(By.css('.copy-btn'));
- const copyButtonSpy = spyOn(component, 'copyLinkToClipboard');
- copyButton.triggerEventHandler('click', null);
- expect(copyButtonSpy).toHaveBeenCalled();
- });
-
- it('should toggle allocations detail with nothing previously selected', ()
=> {
- const row = 0;
- const allocDataSource = new MatTableDataSource([{ expanded: false }]);
- component.allocDataSource = allocDataSource as unknown as
MatTableDataSource<
- AllocationInfo & { expanded: boolean }
- >;
-
- component.allocationsDetailToggle(row);
- expect(component.allocDataSource.data[row].expanded).toBe(true);
-
- component.allocationsDetailToggle(row);
- expect(component.allocDataSource.data[row].expanded).toBe(false);
- });
-
- it('should toggle allocations detail with previous selection active', () => {
- const row = 0;
- const allocDataSource = new MatTableDataSource([{ expanded: false }, {
expanded: true }]);
- component.selectedAllocationsRow = 1;
- component.allocDataSource = allocDataSource as unknown as
MatTableDataSource<
- AllocationInfo & { expanded: boolean }
- >;
-
- component.allocationsDetailToggle(row);
- expect(component.allocDataSource.data[row].expanded).toBe(true);
-
- component.allocationsDetailToggle(row);
- expect(component.allocDataSource.data[row].expanded).toBe(false);
- });
-});
diff --git
a/src/app/components/allocations-drawer/allocations-drawer.component.ts
b/src/app/components/allocations-drawer/allocations-drawer.component.ts
deleted file mode 100644
index 7b69753..0000000
--- a/src/app/components/allocations-drawer/allocations-drawer.component.ts
+++ /dev/null
@@ -1,133 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from
'@angular/core';
-import { MatPaginator } from '@angular/material/paginator';
-import { MatDrawer } from '@angular/material/sidenav';
-import { MatSort } from '@angular/material/sort';
-import { MatTableDataSource } from '@angular/material/table';
-import { AllocationInfo } from '@app/models/alloc-info.model';
-import { AppInfo } from '@app/models/app-info.model';
-import { ColumnDef } from '@app/models/column-def.model';
-import { CommonUtil } from '@app/utils/common.util';
-
-@Component({
- selector: 'app-allocations-drawer',
- templateUrl: './allocations-drawer.component.html',
- styleUrls: ['./allocations-drawer.component.scss'],
-})
-export class AllocationsDrawerComponent implements OnInit {
- @ViewChild('matDrawer', { static: false }) matDrawer!: MatDrawer;
- @ViewChild('allocationMatPaginator', { static: true }) allocPaginator!:
MatPaginator;
- @ViewChild('allocSort', { static: true }) allocSort!: MatSort;
- @Input() allocDataSource!: MatTableDataSource<AllocationInfo & { expanded:
boolean }>;
- @Input() selectedRow!: AppInfo | null;
- @Input() partitionSelected!: string;
- @Input() leafQueueSelected!: string;
-
- @Output() removeRowSelection = new EventEmitter<void>();
-
- allocColumnDef: ColumnDef[] = [];
- allocColumnIds: string[] = [];
- selectedAllocationsRow: number = -1;
-
- ngOnChanges(): void {
- if (this.allocDataSource) {
- this.allocDataSource.paginator = this.allocPaginator;
- this.allocDataSource.sort = this.allocSort;
- }
- }
-
- ngOnInit(): void {
- this.allocColumnDef = [
- { colId: 'displayName', colName: 'Display Name', colWidth: 1 },
- { colId: 'allocationKey', colName: 'Allocation Key', colWidth: 1 },
- { colId: 'nodeId', colName: 'Node ID', colWidth: 1 },
- {
- colId: 'resource',
- colName: 'Resource',
- colFormatter: CommonUtil.resourceColumnFormatter,
- colWidth: 1,
- },
- { colId: 'priority', colName: 'Priority', colWidth: 0.5 },
- ];
- this.allocColumnIds = this.allocColumnDef.map((col) => col.colId);
- }
-
- formatResources(colValue: string): string[] {
- const arr: string[] = colValue.split('<br/>');
- // Check if there are "cpu" or "Memory" elements in the array
- const hasCpu = arr.some((item) => item.toLowerCase().includes('cpu'));
- const hasMemory = arr.some((item) =>
item.toLowerCase().includes('memory'));
- if (!hasCpu) {
- arr.unshift('CPU: n/a');
- }
- if (!hasMemory) {
- arr.unshift('Memory: n/a');
- }
-
- // Concatenate the two arrays, with "cpu" and "Memory" elements first
- const cpuAndMemoryElements = arr.filter(
- (item) => item.toLowerCase().includes('CPU') ||
item.toLowerCase().includes('Memory')
- );
- const otherElements = arr.filter(
- (item) => !item.toLowerCase().includes('CPU') &&
!item.toLowerCase().includes('Memory')
- );
- const result = cpuAndMemoryElements.concat(otherElements);
-
- return result;
- }
-
- isAllocDataSourceEmpty() {
- return this.allocDataSource?.data && this.allocDataSource.data.length ===
0;
- }
-
- allocationsDetailToggle(row: number) {
- if (this.selectedAllocationsRow !== -1) {
- if (this.selectedAllocationsRow !== row) {
- this.allocDataSource.data[this.selectedAllocationsRow].expanded =
false;
- this.selectedAllocationsRow = row;
- this.allocDataSource.data[row].expanded = true;
- } else {
- this.allocDataSource.data[this.selectedAllocationsRow].expanded =
false;
- this.selectedAllocationsRow = -1;
- }
- } else {
- this.selectedAllocationsRow = row;
- this.allocDataSource.data[row].expanded = true;
- }
- }
-
- closeDrawer() {
- this.selectedAllocationsRow = -1;
- this.matDrawer.close();
- this.removeRowSelection.emit();
- }
-
- openDrawer() {
- this.matDrawer.open();
- }
-
- copyLinkToClipboard() {
- const url = window.location.href.split('?')[0];
- const copyString =
`${url}?partition=${this.partitionSelected}&queue=${this.leafQueueSelected}&applicationId=${this?.selectedRow?.applicationId}`;
- navigator.clipboard
- .writeText(copyString)
- .catch((error) => console.error('Writing to the clipboard is not
allowed. ', error));
- }
-}
diff --git a/src/app/components/apps-view/apps-view.component.html
b/src/app/components/apps-view/apps-view.component.html
index 5c85aca..5e44df0 100644
--- a/src/app/components/apps-view/apps-view.component.html
+++ b/src/app/components/apps-view/apps-view.component.html
@@ -43,7 +43,7 @@
<mat-form-field class="search-wrapper white-mat-form-field">
<input matInput type="text" [(ngModel)]="searchText" placeholder="Search
By Application ID" #searchInput />
<button class="clear-btn" *ngIf="searchText" (click)="onClearSearch()"
matTooltip="Clear Search"
- matTooltipShowDelay="500">
+ matTooltipShowDelay="500">
<i class="far fa-times-circle"></i>
</button>
<i *ngIf="!searchText" class="fas fa-search search-icon"></i>
@@ -59,35 +59,32 @@
<div class="mat-elevation-z8">
<mat-table [dataSource]="appDataSource" matSort #appSort="matSort">
<ng-container [matColumnDef]="columnDef.colId" *ngFor="let columnDef of
appColumnDef">
- <mat-header-cell *matHeaderCellDef mat-sort-header
[style.flex]="columnDef.colWidth || 1">{{ columnDef.colName
- }}</mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header>{{
columnDef.colName }}</mat-header-cell>
<ng-container *ngIf="columnDef.colId === 'submissionTime'; else
renderNext_1">
- <mat-cell *matCellDef="let element" [style.flex]="columnDef.colWidth
|| 1">{{
- element['formattedSubmissionTime'] }}</mat-cell>
+ <mat-cell *matCellDef="let element">{{
element['formattedSubmissionTime'] }}</mat-cell>
</ng-container>
<ng-container *ngIf="columnDef.colId === 'lastStateChangeTime'; else
renderNext_1">
- <mat-cell *matCellDef="let element" [style.flex]="columnDef.colWidth
|| 1">{{
- element['formattedlastStateChangeTime'] }}</mat-cell>
+ <mat-cell *matCellDef="let element">{{
element['formattedlastStateChangeTime'] }}</mat-cell>
</ng-container>
<ng-template #renderNext_1>
<ng-container
*ngIf="columnDef.colId === 'usedResource' || columnDef.colId ===
'pendingResource'; else renderNext_1">
- <mat-cell *matCellDef="let element"
[style.flex]="columnDef.colWidth || 1">
+ <mat-cell *matCellDef="let element">
<ng-container *ngIf="columnDef.colFormatter; else
showAppRawData">
<ng-container
*ngIf="columnDef.colFormatter(element[columnDef.colId]) as colValue">
- <mat-chip-set aria-label="Resources"
[attr.data-test]="formatResources(colValue)">
+ <ul class="mat-res-ul">
<ng-container *ngFor="let resource of
formatResources(colValue); let i = index">
- <mat-chip class="mat-chip" *ngIf="i<2">
+ <li class="mat-res-li" *ngIf="i<2">
{{ resource }}
- </mat-chip>
- <mat-chip class="mat-chip" *ngIf="i>=2 && detailToggle">
+ </li>
+ <li class="mat-res-li" *ngIf="i>=2 && detailToggle">
{{ resource }}
- </mat-chip>
+ </li>
</ng-container>
- </mat-chip-set>
+ </ul>
</ng-container>
</ng-container>
<ng-template #showAppRawData>
@@ -128,19 +125,98 @@
<mat-header-row *matHeaderRowDef="appColumnIds"></mat-header-row>
- <mat-row *matRowDef="let row; columns: appColumnIds; let i = index"
[class.selected-row]="selectedRow === row"
- (click)="toggleRowSelection(row)" [ngClass]="{'even-row': i % 2 === 0,
'row': true}"></mat-row>
+ <mat-row *matRowDef="let row; columns: appColumnIds"
[class.selected-row]="selectedRow === row"
+ (click)="toggleRowSelection(row)"></mat-row>
<mat-footer-row *matFooterRowDef="['noRecord']"
- [ngStyle]="{ display: isAppDataSourceEmpty() ? '' : 'none'
}"></mat-footer-row>
+ [ngStyle]="{ display: isAppDataSourceEmpty() ? '' :
'none' }"></mat-footer-row>
</mat-table>
- <mat-paginator #appsViewMatPaginator [pageSizeOptions]="[10, 20, 50, 100]"
pageSize="50"
- [ngStyle]="{ display: isAppDataSourceEmpty() ? 'none' : '' }"
(page)="onPaginatorChanged()"
- showFirstLastButtons></mat-paginator>
+ <mat-paginator #appsViewMatPaginator [pageSizeOptions]="[10, 20, 50, 100]"
+ [ngStyle]="{ display: isAppDataSourceEmpty() ? 'none' : ''
}" (page)="onPaginatorChanged()"
+ showFirstLastButtons></mat-paginator>
</div>
- <ng-container #drawerContainer></ng-container>
- <ng-container #mfeContainer></ng-container>
+ <mat-drawer-container
+ class="flex-primary"
+ [hasBackdrop]="false"
+ >
+ <mat-drawer #matDrawer mode="over" position="end">
+ <mat-drawer-content>
+ <div class="header">
+ <span>{{ selectedRow?.applicationId }} ({{
selectedRow?.allocations?.length }} allocations)</span>
+ <span class="far fa-clipboard copy-btn"
(click)="copyLinkToClipboard()" matTooltip="Click to copy the URL to this view"
matTooltipShowDelay="500"></span>
+ <span class="far fa-solid fa-xmark close-btn"
(click)="closeDrawer()"></span>
+ </div>
+ <div class="content">
-</div>
\ No newline at end of file
+ <mat-table [dataSource]="allocDataSource" matSort
#allocSort="matSort">
+ <ng-container [matColumnDef]="columnDef.colId" *ngFor="let
columnDef of allocColumnDef">
+ <mat-header-cell *matHeaderCellDef mat-sort-header
[style.flex]="columnDef?.colWidth || 1">{{ columnDef.colName
}}</mat-header-cell>
+
+ <ng-container *ngIf="columnDef.colId === 'priority'; else
renderNext_3" >
+ <mat-cell class="small" *matCellDef="let element"
+ [style.flex]="columnDef?.colWidth || 1"
+ [style.min-height]="allocationsToggle ? '96px' :
'unset'"
+ [title]="element[columnDef.colId]"
+ >{{ element['priority'] }} </mat-cell>
+ </ng-container>
+
+ <ng-container *ngIf="columnDef.colId === 'resource'; else
renderNext_3">
+ <mat-cell *matCellDef="let element" class="allocations-data"
[style.flex]="columnDef?.colWidth || 1" matTooltip="
+ {{element[columnDef.colId]}}"
matTooltipShowDelay="500" >
+ <ng-container *ngIf="columnDef.colFormatter; else
showAllocRowData;">
+ <ng-container
*ngIf="columnDef.colFormatter(element[columnDef.colId]) as colValue">
+ <ul class="mat-res-ul">
+ <ng-container *ngFor="let resource of
formatResources(colValue); let i = index">
+ <li class="mat-res-li" *ngIf="i<1">
+ {{ resource }}
+ </li>
+ <li class="mat-res-li" *ngIf="i>=1 &&
allocationsToggle">
+ {{ resource }}
+ </li>
+ </ng-container>
+ </ul>
+ </ng-container>
+ </ng-container>
+ <ng-template #showAllocRowData>
+ <span>{{ element[columnDef.colId] }}</span>
+ </ng-template>
+ </mat-cell>
+ </ng-container>
+
+ <ng-template #renderNext_3>
+ <mat-cell *matCellDef="let element"
+ [class]="allocationsToggle ? '' : 'ellipsis'"
+ [style.flex]="columnDef?.colWidth || 1"
+ [style.min-height]="allocationsToggle ? '96px' :
'unset'"
+ matTooltip="{{element[columnDef.colId]}}"
matTooltipShowDelay="500"
+ >{{ element[columnDef.colId] || 'n/a' }}</mat-cell>
+ </ng-template>
+ </ng-container>
+
+ <ng-container matColumnDef="noRecord">
+ <mat-footer-cell *matFooterCellDef>
+ <div class="no-record">No records found</div>
+ </mat-footer-cell>
+ </ng-container>
+
+ <mat-header-row *matHeaderRowDef="allocColumnIds"></mat-header-row>
+
+ <mat-row *matRowDef="let row; columns: allocColumnIds; let i =
index" (click)="allocationsDetailToggle()"
+ [ngClass]="{'even-row': i % 2 === 0, 'row': true}"
+ ></mat-row>
+
+ <mat-footer-row *matFooterRowDef="['noRecord']"
+ [ngStyle]="{ display: isAllocDataSourceEmpty() ?
'' : 'none' }"></mat-footer-row>
+ </mat-table>
+
+ <mat-paginator #allocationMatPaginator [pageSizeOptions]="[10, 20,
50, 100]"
+ [ngStyle]="{ display: isAllocDataSourceEmpty() ?
'none' : '' }"
+ showFirstLastButtons></mat-paginator>
+
+ </div>
+ </mat-drawer-content>
+ </mat-drawer>
+ </mat-drawer-container>
+</div>
diff --git a/src/app/components/apps-view/apps-view.component.scss
b/src/app/components/apps-view/apps-view.component.scss
index 67cd8e3..be0dff8 100644
--- a/src/app/components/apps-view/apps-view.component.scss
+++ b/src/app/components/apps-view/apps-view.component.scss
@@ -17,19 +17,22 @@
*/
@import '~material-design-icons/iconfont/material-icons.css';
- .top-section {
+.top-section {
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
- .left-side{
+
+ .left-side {
display: flex;
flex-direction: row;
align-items: center;
+
.dropdown-wrapper {
padding-right: 40px;
+
.dropdown-label {
color: #333;
font-size: 14px;
@@ -37,19 +40,24 @@
}
}
}
- .right-side{
+
+ .right-side {
display: flex;
flex-direction: row;
align-items: center;
+
.btn-wrapper {
filter: drop-shadow(0px 2px 1px rgba(90, 90, 90, 0.5));
- &:hover{
+
+ &:hover {
filter: drop-shadow(0px 3px 3px rgba(90, 90, 90, 0.5));
}
- :hover{
+
+ :hover {
cursor: pointer;
}
- .btn{
+
+ .btn {
display: block;
border: none;
padding: 5px 16px;
@@ -57,31 +65,38 @@
font-size: 24px;
transform: translateY(-13px);
}
- .material-icons{
+
+ .material-icons {
transform: translateY(2px);
}
}
+
.search-wrapper {
width: 300px;
right: 20px;
padding-right: 20px;
+
input {
width: calc(100% - 22px);
color: #333;
}
+
.clear-btn {
outline: none;
border: none;
padding: 0 0 0 4px;
cursor: pointer;
background: transparent;
+
i {
font-size: 18px;
+
&:hover {
color: #f44336;
}
}
}
+
.search-icon {
margin-left: 4px;
font-size: 17px;
@@ -90,7 +105,7 @@
}
}
-.mdc-button .mdc-button__label{
+.mdc-button .mdc-button__label {
display: flex;
align-items: center;
}
@@ -99,72 +114,53 @@
width: 100%;
height: 100%;
- mat-chip {
- height: 20px;
- line-height: 14px;
- font-size: 12px;
- margin: 1px;
- // border-radius: 5px;
- // background-color: #313D54;
- background-color: transparent;
-
- span {
- font-size: 12px;
- }
- }
-
- .mat-mdc-standard-chip {
- --mdc-chip-label-text-color: #333;
- --mdc-chip-label-text-size: 12px;
- --mdc-chip-label-text-weight: 400;
- }
-
- .selected-row .mat-mdc-standard-chip {
- --mdc-chip-label-text-color: #fff;
- }
-
.mat-mdc-header-cell {
font-size: 15px;
font-weight: 500;
color: #666;
}
+
.mat-mdc-cell {
color: #333;
display: flex;
flex-direction: column;
align-items: flex-start;
- .mat-res-ul{
+
+ .mat-res-ul {
padding: 0;
margin: 0;
- .mat-res-li{
+
+ .mat-res-li {
list-style-type: none;
}
}
+
.mat-toggle-more {
display: block;
color: #a1a3b7;
padding: 5px 45px 0 0;
+
&:hover {
color: #8d00d4;
}
}
}
- .even-row {
- background: #eee;
- }
+
.mat-mdc-row {
- min-height: unset;
- font-size: 12px;
&:hover {
background: #cccccc;
cursor: pointer;
}
+
&.selected-row {
background: #303d54;
+
.mat-mdc-cell {
color: #fff;
+
.mat-toggle-more {
color: #b8bbff;
+
&:hover {
color: #b871dc;
}
@@ -172,18 +168,22 @@
}
}
}
+
.mat-mdc-header-cell.indicator-icon,
.mat-mdc-cell.indicator-icon {
max-width: 40px;
font-size: 18px;
margin-left: 10px;
}
+
.app-allocations {
margin-top: 40px;
+
.mat-mdc-table {
margin-top: 20px;
}
}
+
.no-record {
font-size: 14px;
font-weight: 500;
@@ -203,39 +203,48 @@
position: absolute;
right: 0;
bottom: 0;
+
.mat-drawer {
pointer-events: auto;
width: 100%;
+
.content {
padding: 0 10px;
}
}
+
.close-btn {
float: right;
font-size: 1.2em;
cursor: pointer;
padding-right: 5px;
+
&:hover {
color: #f44336;
}
}
+
.copy-btn {
font-size: 1em;
cursor: pointer;
padding-left: 5px;
}
+
.header {
margin: 20px;
font-weight: 100;
font-size: 1em;
}
+
.content {
border-top: 1px solid #e1e1e1;
}
+
.item-wrapper {
.left-item {
text-align: right;
}
+
.left-item,
.right-item {
width: 50%;
@@ -243,13 +252,16 @@
padding-right: 0;
color: #666;
}
+
.right-item {
font-weight: 600;
}
}
+
.app-link {
text-decoration: none;
color: #666;
+
&:hover {
text-decoration: underline;
}
@@ -273,4 +285,4 @@
.row {
min-height: unset;
}
-}
\ No newline at end of file
+}
diff --git a/src/app/components/apps-view/apps-view.component.spec.ts
b/src/app/components/apps-view/apps-view.component.spec.ts
index 36c8969..951b932 100644
--- a/src/app/components/apps-view/apps-view.component.spec.ts
+++ b/src/app/components/apps-view/apps-view.component.spec.ts
@@ -31,15 +31,8 @@ import { By, HAMMER_LOADER } from
'@angular/platform-browser';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
import { AppInfo } from '@app/models/app-info.model';
-import { EnvconfigService } from '@app/services/envconfig/envconfig.service';
import { SchedulerService } from '@app/services/scheduler/scheduler.service';
-import { MatChipsModule } from '@angular/material/chips';
-
-import {
- MockEnvconfigService,
- MockNgxSpinnerService,
- MockSchedulerService,
-} from '@app/testing/mocks';
+import { MockNgxSpinnerService, MockSchedulerService } from
'@app/testing/mocks';
import { NgxSpinnerService } from 'ngx-spinner';
import { of } from 'rxjs';
@@ -64,20 +57,15 @@ describe('AppsViewComponent', () => {
MatTooltipModule,
MatSelectModule,
MatSidenavModule,
- MatChipsModule,
],
providers: [
{ provide: SchedulerService, useValue: MockSchedulerService },
{ provide: NgxSpinnerService, useValue: MockNgxSpinnerService },
{ provide: HAMMER_LOADER, useValue: () => new Promise(() => {}) },
- { provide: EnvconfigService, useValue: MockEnvconfigService },
],
}).compileComponents();
fixture = TestBed.createComponent(AppsViewComponent);
component = fixture.componentInstance;
- spyOn(component, 'initializeSidebarComponent').and.callFake(
- (b = null) => new Promise(() => {})
- );
fixture.detectChanges();
});
@@ -85,7 +73,7 @@ describe('AppsViewComponent', () => {
expect(component).toBeTruthy();
});
- it('should have usedResource and pendingResource column with detailToggle
OFF', () => {
+ it('should have usedResource and pendingResource column', () => {
let service: SchedulerService;
service = TestBed.inject(SchedulerService);
let appInfo = new AppInfo(
@@ -102,45 +90,22 @@ describe('AppsViewComponent', () => {
);
spyOn(service, 'fetchAppList').and.returnValue(of([appInfo]));
component.fetchAppListForPartitionAndQueue('default', 'root');
+ component.toggle();
fixture.detectChanges();
const debugEl: DebugElement = fixture.debugElement;
expect(
- debugEl.query(By.css('[data-test="Memory: 500.0 KB,CPU: 10,pods:
1"]')).nativeElement
- .innerText
- ).toContain('Memory: 500.0 KB\nCPU: 10');
+
debugEl.query(By.css('mat-cell.mat-column-usedResource')).nativeElement.innerText
+ ).toContain('Memory: 500.0 KB\nCPU: 10\npods: 1');
expect(
- debugEl.query(By.css('[data-test="Memory: 0.0 bytes,CPU: 0,pods:
n/a"]')).nativeElement
- .innerText
- ).toContain('Memory: 0.0 bytes\nCPU: 0');
+
debugEl.query(By.css('mat-cell.mat-column-pendingResource')).nativeElement.innerText
+ ).toContain('Memory: 0.0 bytes\nCPU: 0\npods: n/a');
});
- it('should have usedResource and pendingResource column with detailToggle
ON', () => {
- let service: SchedulerService;
- service = TestBed.inject(SchedulerService);
- let appInfo = new AppInfo(
- 'app1',
- 'Memory: 500.0 KB, CPU: 10, pods: 1',
- 'Memory: 0.0 bytes, CPU: 0, pods: n/a',
- '',
- 1,
- 2,
- [],
- 2,
- 'RUNNING',
- []
- );
- spyOn(service, 'fetchAppList').and.returnValue(of([appInfo]));
- component.fetchAppListForPartitionAndQueue('default', 'root');
- component.detailToggle = true;
- fixture.detectChanges();
+ it('should copy the allocations URL to clipboard', () => {
const debugEl: DebugElement = fixture.debugElement;
- expect(
- debugEl.query(By.css('[data-test="Memory: 500.0 KB,CPU: 10,pods:
1"]')).nativeElement
- .innerText
- ).toContain('Memory: 500.0 KB\nCPU: 10\npods: 1');
- expect(
- debugEl.query(By.css('[data-test="Memory: 0.0 bytes,CPU: 0,pods:
n/a"]')).nativeElement
- .innerText
- ).toContain('Memory: 0.0 bytes\nCPU: 0\npods: n/a');
+ const copyButton = debugEl.query(By.css('.copy-btn'));
+ const copyButtonSpy = spyOn(component, 'copyLinkToClipboard');
+ copyButton.triggerEventHandler('click', null);
+ expect(copyButtonSpy).toHaveBeenCalled();
});
});
diff --git a/src/app/components/apps-view/apps-view.component.ts
b/src/app/components/apps-view/apps-view.component.ts
index c65d5cb..d742aac 100644
--- a/src/app/components/apps-view/apps-view.component.ts
+++ b/src/app/components/apps-view/apps-view.component.ts
@@ -16,36 +16,25 @@
* limitations under the License.
*/
-import {
- Component,
- ComponentRef,
- ElementRef,
- OnInit,
- ViewChild,
- ViewContainerRef,
-} from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
import { MatPaginator } from '@angular/material/paginator';
-import { MatSelect, MatSelectChange } from '@angular/material/select';
-import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
-import { ActivatedRoute, Router } from '@angular/router';
-import { AllocationsDrawerComponent } from
'@app/components/allocations-drawer/allocations-drawer.component';
-import { AllocationInfo } from '@app/models/alloc-info.model';
+import { MatSort } from '@angular/material/sort';
+import { MatSelectChange, MatSelect } from '@angular/material/select';
+import { finalize, debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import { NgxSpinnerService } from 'ngx-spinner';
+import { fromEvent } from 'rxjs';
+
+import { SchedulerService } from '@app/services/scheduler/scheduler.service';
import { AppInfo } from '@app/models/app-info.model';
+import { AllocationInfo } from '@app/models/alloc-info.model';
import { ColumnDef } from '@app/models/column-def.model';
-import { DropdownItem } from '@app/models/dropdown-item.model';
+import { CommonUtil } from '@app/utils/common.util';
import { PartitionInfo } from '@app/models/partition-info.model';
+import { DropdownItem } from '@app/models/dropdown-item.model';
import { QueueInfo } from '@app/models/queue-info.model';
-import { EnvconfigService } from '@app/services/envconfig/envconfig.service';
-import { SchedulerService } from '@app/services/scheduler/scheduler.service';
-import { CommonUtil } from '@app/utils/common.util';
-import { NgxSpinnerService } from 'ngx-spinner';
-import { fromEvent } from 'rxjs';
-import { debounceTime, distinctUntilChanged, finalize } from 'rxjs/operators';
-import {
- loadRemoteModule,
- LoadRemoteModuleEsmOptions,
-} from '@angular-architects/module-federation';
+import { MatDrawer } from '@angular/material/sidenav';
@Component({
selector: 'app-applications-view',
@@ -59,12 +48,7 @@ export class AppsViewComponent implements OnInit {
@ViewChild('allocSort', { static: true }) allocSort!: MatSort;
@ViewChild('searchInput', { static: true }) searchInput!: ElementRef;
@ViewChild('queueSelect', { static: false }) queueSelect!: MatSelect;
-
- @ViewChild('drawerContainer', { read: ViewContainerRef, static: true })
- drawerContainer!: ViewContainerRef;
-
- @ViewChild('mfeContainer', { read: ViewContainerRef, static: true })
- mfeContainer!: ViewContainerRef;
+ @ViewChild('matDrawer', { static: false }) matDrawer!: MatDrawer;
appDataSource = new MatTableDataSource<AppInfo>([]);
appColumnDef: ColumnDef[] = [];
@@ -83,14 +67,13 @@ export class AppsViewComponent implements OnInit {
leafQueueSelected = '';
detailToggle: boolean = false;
- allocationsDrawerComponent: ComponentRef<AllocationsDrawerComponent> |
undefined = undefined;
+ allocationsToggle: boolean = false;
constructor(
private scheduler: SchedulerService,
private spinner: NgxSpinnerService,
private activatedRoute: ActivatedRoute,
- private router: Router,
- private envConfig: EnvconfigService
+ private router: Router
) {}
ngOnInit() {
@@ -101,31 +84,27 @@ export class AppsViewComponent implements OnInit {
this.appSort.sort({ id: 'submissionTime', start: 'desc', disableClear:
false });
this.appColumnDef = [
- { colId: 'applicationId', colName: 'Application ID', colWidth: 1 },
- { colId: 'applicationState', colName: 'Application State', colWidth: 1 },
+ { colId: 'applicationId', colName: 'Application ID' },
+ { colId: 'applicationState', colName: 'Application State' },
{
colId: 'lastStateChangeTime',
colName: 'Last State Change Time',
colFormatter: CommonUtil.timeColumnFormatter,
- colWidth: 1,
},
{
colId: 'usedResource',
colName: 'Used Resource',
colFormatter: CommonUtil.resourceColumnFormatter,
- colWidth: 2,
},
{
colId: 'pendingResource',
colName: 'Pending Resource',
colFormatter: CommonUtil.resourceColumnFormatter,
- colWidth: 2,
},
{
colId: 'submissionTime',
colName: 'Submission Time',
colFormatter: CommonUtil.timeColumnFormatter,
- colWidth: 1,
},
];
@@ -175,31 +154,6 @@ export class AppsViewComponent implements OnInit {
this.clearQueueSelection();
}
});
-
- this.initializeSidebarComponent(
- this.envConfig.getAllocationsDrawerComponentRemoteConfig()
- ).catch(console.error);
- }
-
- async initializeSidebarComponent(remoteComponentConfig:
LoadRemoteModuleEsmOptions | null) {
- let component = AllocationsDrawerComponent;
-
- if (remoteComponentConfig !== null) {
- const { AllocationsDrawerComponent: allocationsDrawerComponent } =
- await loadRemoteModule(remoteComponentConfig);
- component = allocationsDrawerComponent;
- }
-
- this.drawerContainer.clear();
- this.allocationsDrawerComponent =
this.drawerContainer.createComponent(component);
-
- this.allocationsDrawerComponent.setInput('selectedRow', this.selectedRow);
- this.allocationsDrawerComponent.setInput('allocDataSource',
this.allocDataSource);
- this.allocationsDrawerComponent.setInput('partitionSelected',
this.partitionSelected);
- this.allocationsDrawerComponent.setInput('leafQueueSelected',
this.leafQueueSelected);
- this.allocationsDrawerComponent.instance.removeRowSelection.subscribe(()
=> {
- this.removeRowSelection();
- });
}
fetchQueuesForPartition(partitionName: string) {
@@ -323,12 +277,10 @@ export class AppsViewComponent implements OnInit {
} else {
this.selectedRow = row;
row.isSelected = true;
+ this.matDrawer.open();
if (row.allocations) {
this.allocDataSource.data = row.allocations;
}
- this.allocationsDrawerComponent?.setInput('selectedRow',
this.selectedRow);
- this.allocationsDrawerComponent?.setInput('allocDataSource',
this.allocDataSource);
- this.allocationsDrawerComponent?.instance.openDrawer();
}
}
@@ -348,6 +300,10 @@ export class AppsViewComponent implements OnInit {
return this.appDataSource.data && this.appDataSource.data.length === 0;
}
+ isAllocDataSourceEmpty() {
+ return this.allocDataSource.data && this.allocDataSource.data.length === 0;
+ }
+
onClearSearch() {
this.searchText = '';
this.removeRowSelection();
@@ -421,7 +377,9 @@ export class AppsViewComponent implements OnInit {
const otherElements = arr.filter(
(item) => !item.toLowerCase().includes('CPU') &&
!item.toLowerCase().includes('Memory')
);
- return cpuAndMemoryElements.concat(otherElements);
+ const result = cpuAndMemoryElements.concat(otherElements);
+
+ return result;
}
clearQueueSelection() {
@@ -437,4 +395,21 @@ export class AppsViewComponent implements OnInit {
toggle() {
this.detailToggle = !this.detailToggle;
}
+
+ allocationsDetailToggle() {
+ this.allocationsToggle = !this.allocationsToggle;
+ }
+
+ closeDrawer() {
+ this.matDrawer.close();
+ this.removeRowSelection();
+ }
+
+ copyLinkToClipboard() {
+ const url = window.location.href.split('?')[0];
+ const copyString =
`${url}?partition=${this.partitionSelected}&queue=${this.leafQueueSelected}&applicationId=${this?.selectedRow?.applicationId}`;
+ navigator.clipboard
+ .writeText(copyString)
+ .catch((error) => console.error('Writing to the clipboard is not
allowed. ', error));
+ }
}
diff --git a/src/app/models/envconfig.model.ts
b/src/app/models/envconfig.model.ts
index 78b3a41..0ca4a7e 100644
--- a/src/app/models/envconfig.model.ts
+++ b/src/app/models/envconfig.model.ts
@@ -18,6 +18,4 @@
export interface EnvConfig {
localSchedulerWebAddress: string;
- moduleFederationRemoteEntry?: string;
- allocationsDrawerRemoteComponent?: string;
}
diff --git a/src/app/services/envconfig/envconfig.service.ts
b/src/app/services/envconfig/envconfig.service.ts
index f351b46..8118795 100644
--- a/src/app/services/envconfig/envconfig.service.ts
+++ b/src/app/services/envconfig/envconfig.service.ts
@@ -21,7 +21,7 @@ import { HttpClient } from '@angular/common/http';
import { environment } from '../../../environments/environment';
import { EnvConfig } from '@app/models/envconfig.model';
-import { LoadRemoteModuleEsmOptions } from
'@angular-architects/module-federation';
+import { DEFAULT_PROTOCOL } from '@app/utils/constants';
const ENV_CONFIG_JSON_URL = './assets/config/envconfig.json';
@@ -63,17 +63,4 @@ export class EnvconfigService {
return `${this.uiProtocol}//${this.uiHostname}:${this.uiPort}`;
}
-
- getAllocationsDrawerComponentRemoteConfig(): LoadRemoteModuleEsmOptions |
null {
- if (
- this.envConfig.allocationsDrawerRemoteComponent &&
- this.envConfig.moduleFederationRemoteEntry
- )
- return {
- type: 'module',
- remoteEntry: this.envConfig.moduleFederationRemoteEntry,
- exposedModule: this.envConfig.allocationsDrawerRemoteComponent,
- };
- return null;
- }
}
diff --git a/src/app/testing/mocks.ts b/src/app/testing/mocks.ts
index c91ffd7..45efbd4 100644
--- a/src/app/testing/mocks.ts
+++ b/src/app/testing/mocks.ts
@@ -21,7 +21,6 @@ import { AppInfo } from '@app/models/app-info.model';
import { CommonUtil } from '@app/utils/common.util';
export const noopFn = () => {};
-export const nullFn = () => null;
export const MockSchedulerService = {
fetchClusterByName: () => of({}),
@@ -42,7 +41,6 @@ export const MockNgxSpinnerService = {
export const MockEnvconfigService = {
getSchedulerWebAddress: noopFn,
- getAllocationsDrawerComponentRemoteConfig: nullFn,
};
export const MockEventBusService = {
diff --git a/src/assets/config/envconfig.json b/src/assets/config/envconfig.json
index 8e21192..fb22397 100644
--- a/src/assets/config/envconfig.json
+++ b/src/assets/config/envconfig.json
@@ -1,5 +1,3 @@
{
- "localSchedulerWebAddress": "http://localhost:9889",
- "moduleFederationRemoteEntry": "",
- "allocationsDrawerRemoteComponent": ""
+ "localSchedulerWebAddress": "http://localhost:9889"
}
diff --git a/src/bootstrap.ts b/src/bootstrap.ts
deleted file mode 100644
index be5f6fc..0000000
--- a/src/bootstrap.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements. See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership. The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License. You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { enableProdMode } from '@angular/core';
-import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
-
-import { AppModule } from './app/app.module';
-import { environment } from './environments/environment';
-
-if (environment.production) {
- enableProdMode();
-}
-
-platformBrowserDynamic()
- .bootstrapModule(AppModule)
- .catch((err) => console.error(err));
diff --git a/src/main.ts b/src/main.ts
index 8039bb0..be5f6fc 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -16,4 +16,16 @@
* limitations under the License.
*/
-import('./bootstrap').catch((err) => console.error(err));
+import { enableProdMode } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
+
+if (environment.production) {
+ enableProdMode();
+}
+
+platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch((err) => console.error(err));
diff --git a/tsconfig.app.json b/tsconfig.app.json
index 58c0f98..82d91dc 100644
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -1,3 +1,4 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
@@ -11,4 +12,4 @@
"include": [
"src/**/*.d.ts"
]
-}
\ No newline at end of file
+}
diff --git a/tsconfig.json b/tsconfig.json
index 5fe89cf..bfb36a8 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,3 +1,4 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
@@ -37,4 +38,4 @@
"strictInputAccessModifiers": true,
"strictTemplates": true
}
-}
\ No newline at end of file
+}
diff --git a/webpack.config.js b/webpack.config.js
deleted file mode 100644
index f730193..0000000
--- a/webpack.config.js
+++ /dev/null
@@ -1,37 +0,0 @@
-//
-// Licensed to the Apache Software Foundation (ASF) under one
-// or more contributor license agreements. See the NOTICE file
-// distributed with this work for additional information
-// regarding copyright ownership. The ASF licenses this file
-// to you under the Apache License, Version 2.0 (the
-// "License"); you may not use this file except in compliance
-// with the License. You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing,
-// software distributed under the License is distributed on an
-// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-// KIND, either express or implied. See the License for the
-// specific language governing permissions and limitations
-// under the License.
-//
-
-const {
- shareAll,
- withModuleFederationPlugin,
-} = require('@angular-architects/module-federation/webpack');
-
-const webpackConfig = withModuleFederationPlugin({
- shared: {
- ...shareAll({ singleton: true, strictVersion: true, requiredVersion:
'auto' }),
- },
-});
-
-module.exports = {
- ...webpackConfig,
- output: {
- ...webpackConfig.output,
- scriptType: 'text/javascript',
- },
-};
diff --git a/webpack.prod.config.js b/webpack.prod.config.js
deleted file mode 100644
index f2e70c2..0000000
--- a/webpack.prod.config.js
+++ /dev/null
@@ -1,19 +0,0 @@
-//
-// Licensed to the Apache Software Foundation (ASF) under one
-// or more contributor license agreements. See the NOTICE file
-// distributed with this work for additional information
-// regarding copyright ownership. The ASF licenses this file
-// to you under the Apache License, Version 2.0 (the
-// "License"); you may not use this file except in compliance
-// with the License. You may obtain a copy of the License at
-//
-// http://www.apache.org/licenses/LICENSE-2.0
-//
-// Unless required by applicable law or agreed to in writing,
-// software distributed under the License is distributed on an
-// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-// KIND, either express or implied. See the License for the
-// specific language governing permissions and limitations
-// under the License.
-//
-module.exports = require('./webpack.config');
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]