mirror of
https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui.git
synced 2025-10-30 18:27:53 +00:00
Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
9e3df09fb2 | ||
|
|
2445935627 |
@@ -17,9 +17,7 @@ metadata:
|
||||
{{- end }}
|
||||
|
||||
spec:
|
||||
{{- if $ingressValue.className }}
|
||||
ingressClassName: {{ $ingressValue.className }}
|
||||
{{- end }}
|
||||
|
||||
{{- if $ingressValue.tls }}
|
||||
tls:
|
||||
{{- range $ingressValue.tls }}
|
||||
|
||||
@@ -8,7 +8,7 @@ fullnameOverride: ""
|
||||
images:
|
||||
owgwui:
|
||||
repository: tip-tip-wlan-cloud-ucentral.jfrog.io/owgw-ui
|
||||
tag: v3.2.0
|
||||
tag: v3.0.0
|
||||
pullPolicy: Always
|
||||
|
||||
services:
|
||||
|
||||
351
package-lock.json
generated
351
package-lock.json
generated
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "ucentral-client",
|
||||
"version": "3.1.0(5)",
|
||||
"version": "3.0.0(1)",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "ucentral-client",
|
||||
"version": "3.1.0(5)",
|
||||
"version": "3.0.0(1)",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@chakra-ui/anatomy": "^2.1.1",
|
||||
@@ -88,7 +88,6 @@
|
||||
"lint-staged": "^13.2.1",
|
||||
"prettier": "^2.8.7",
|
||||
"vite-plugin-pwa": "^0.14.7",
|
||||
"vite-plugin-svgr": "^4.2.0",
|
||||
"vite-tsconfig-paths": "^4.2.0"
|
||||
}
|
||||
},
|
||||
@@ -3956,9 +3955,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@rollup/pluginutils": {
|
||||
"version": "5.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
|
||||
"integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
|
||||
"version": "5.0.2",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.0.2.tgz",
|
||||
"integrity": "sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/estree": "^1.0.0",
|
||||
@@ -3969,7 +3968,7 @@
|
||||
"node": ">=14.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
|
||||
"rollup": "^1.20.0||^2.0.0||^3.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"rollup": {
|
||||
@@ -3998,245 +3997,6 @@
|
||||
"sourcemap-codec": "^1.4.8"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-add-jsx-attribute": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-8.0.0.tgz",
|
||||
"integrity": "sha512-b9MIk7yhdS1pMCZM8VeNfUlSKVRhsHZNMl5O9SfaX0l0t5wjdgu4IDzGB8bpnGBBOjGST3rRFVsaaEtI4W6f7g==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-remove-jsx-attribute": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-attribute/-/babel-plugin-remove-jsx-attribute-8.0.0.tgz",
|
||||
"integrity": "sha512-BcCkm/STipKvbCl6b7QFrMh/vx00vIP63k2eM66MfHJzPr6O2U0jYEViXkHJWqXqQYjdeA9cuCl5KWmlwjDvbA==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-remove-jsx-empty-expression": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-remove-jsx-empty-expression/-/babel-plugin-remove-jsx-empty-expression-8.0.0.tgz",
|
||||
"integrity": "sha512-5BcGCBfBxB5+XSDSWnhTThfI9jcO5f0Ai2V24gZpG+wXF14BzwxxdDb4g6trdOux0rhibGs385BeFMSmxtS3uA==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-replace-jsx-attribute-value": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-replace-jsx-attribute-value/-/babel-plugin-replace-jsx-attribute-value-8.0.0.tgz",
|
||||
"integrity": "sha512-KVQ+PtIjb1BuYT3ht8M5KbzWBhdAjjUPdlMtpuw/VjT8coTrItWX6Qafl9+ji831JaJcu6PJNKCV0bp01lBNzQ==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-svg-dynamic-title": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-dynamic-title/-/babel-plugin-svg-dynamic-title-8.0.0.tgz",
|
||||
"integrity": "sha512-omNiKqwjNmOQJ2v6ge4SErBbkooV2aAWwaPFs2vUY7p7GhVkzRkJ00kILXQvRhA6miHnNpXv7MRnnSjdRjK8og==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-svg-em-dimensions": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-svg-em-dimensions/-/babel-plugin-svg-em-dimensions-8.0.0.tgz",
|
||||
"integrity": "sha512-mURHYnu6Iw3UBTbhGwE/vsngtCIbHE43xCRK7kCw4t01xyGqb2Pd+WXekRRoFOBIY29ZoOhUCTEweDMdrjfi9g==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-transform-react-native-svg": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-react-native-svg/-/babel-plugin-transform-react-native-svg-8.1.0.tgz",
|
||||
"integrity": "sha512-Tx8T58CHo+7nwJ+EhUwx3LfdNSG9R2OKfaIXXs5soiy5HtgoAEkDay9LIimLOcG8dJQH1wPZp/cnAv6S9CrR1Q==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-plugin-transform-svg-component": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-plugin-transform-svg-component/-/babel-plugin-transform-svg-component-8.0.0.tgz",
|
||||
"integrity": "sha512-DFx8xa3cZXTdb/k3kfPeaixecQLgKh5NVBMwD0AQxOzcZawK4oo1Jh9LbrcACUivsCA7TLG8eeWgrDXjTMhRmw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/babel-preset": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/babel-preset/-/babel-preset-8.1.0.tgz",
|
||||
"integrity": "sha512-7EYDbHE7MxHpv4sxvnVPngw5fuR6pw79SkcrILHJ/iMpuKySNCl5W1qcwPEpU+LgyRXOaAFgH0KhwD18wwg6ug==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@svgr/babel-plugin-add-jsx-attribute": "8.0.0",
|
||||
"@svgr/babel-plugin-remove-jsx-attribute": "8.0.0",
|
||||
"@svgr/babel-plugin-remove-jsx-empty-expression": "8.0.0",
|
||||
"@svgr/babel-plugin-replace-jsx-attribute-value": "8.0.0",
|
||||
"@svgr/babel-plugin-svg-dynamic-title": "8.0.0",
|
||||
"@svgr/babel-plugin-svg-em-dimensions": "8.0.0",
|
||||
"@svgr/babel-plugin-transform-react-native-svg": "8.1.0",
|
||||
"@svgr/babel-plugin-transform-svg-component": "8.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/core": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/core/-/core-8.1.0.tgz",
|
||||
"integrity": "sha512-8QqtOQT5ACVlmsvKOJNEaWmRPmcojMOzCz4Hs2BGG/toAp/K38LcsMRyLp349glq5AzJbCEeimEoxaX6v/fLrA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.21.3",
|
||||
"@svgr/babel-preset": "8.1.0",
|
||||
"camelcase": "^6.2.0",
|
||||
"cosmiconfig": "^8.1.3",
|
||||
"snake-case": "^3.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/core/node_modules/cosmiconfig": {
|
||||
"version": "8.3.6",
|
||||
"resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz",
|
||||
"integrity": "sha512-kcZ6+W5QzcJ3P1Mt+83OUv/oHFqZHIx8DuxG6eZ5RGMERoLqp4BuGjhHLYGK+Kf5XVkQvqBSmAy/nGWN3qDgEA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"import-fresh": "^3.3.0",
|
||||
"js-yaml": "^4.1.0",
|
||||
"parse-json": "^5.2.0",
|
||||
"path-type": "^4.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/d-fischer"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"typescript": ">=4.9.5"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"typescript": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/hast-util-to-babel-ast": {
|
||||
"version": "8.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/hast-util-to-babel-ast/-/hast-util-to-babel-ast-8.0.0.tgz",
|
||||
"integrity": "sha512-EbDKwO9GpfWP4jN9sGdYwPBU0kdomaPIL2Eu4YwmgP+sJeXT+L7bMwJUBnhzfH8Q2qMBqZ4fJwpCyYsAN3mt2Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/types": "^7.21.3",
|
||||
"entities": "^4.4.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
}
|
||||
},
|
||||
"node_modules/@svgr/plugin-jsx": {
|
||||
"version": "8.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@svgr/plugin-jsx/-/plugin-jsx-8.1.0.tgz",
|
||||
"integrity": "sha512-0xiIyBsLlr8quN+WyuxooNW9RJ0Dpr8uOnH/xrCVO8GLUcwHISwj1AG0k+LFzteTkAA0GbX0kj9q6Dk70PTiPA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@babel/core": "^7.21.3",
|
||||
"@svgr/babel-preset": "8.1.0",
|
||||
"@svgr/hast-util-to-babel-ast": "8.0.0",
|
||||
"svg-parser": "^2.0.4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/gregberge"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@svgr/core": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@tanstack/query-core": {
|
||||
"version": "4.29.1",
|
||||
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.29.1.tgz",
|
||||
@@ -5209,18 +4969,6 @@
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/camelcase": {
|
||||
"version": "6.3.0",
|
||||
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
|
||||
"integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/caniuse-lite": {
|
||||
"version": "1.0.30001480",
|
||||
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001480.tgz",
|
||||
@@ -5651,16 +5399,6 @@
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/dot-case": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz",
|
||||
"integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"no-case": "^3.0.4",
|
||||
"tslib": "^2.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/duplexer": {
|
||||
"version": "0.1.2",
|
||||
"license": "MIT"
|
||||
@@ -5671,9 +5409,8 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/ejs": {
|
||||
"version": "3.1.10",
|
||||
"resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
|
||||
"integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
|
||||
"version": "3.1.8",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"jake": "^10.8.5"
|
||||
},
|
||||
@@ -5694,18 +5431,6 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/entities": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
|
||||
"integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=0.12"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/fb55/entities?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/error-ex": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
|
||||
@@ -6683,15 +6408,14 @@
|
||||
}
|
||||
},
|
||||
"node_modules/follow-redirects": {
|
||||
"version": "1.15.6",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
|
||||
"integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
|
||||
"version": "1.15.2",
|
||||
"funding": [
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://github.com/sponsors/RubenVerborgh"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=4.0"
|
||||
},
|
||||
@@ -8221,15 +7945,6 @@
|
||||
"loose-envify": "cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/lower-case": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
|
||||
"integrity": "sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"tslib": "^2.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/lru-cache": {
|
||||
"version": "6.0.0",
|
||||
"dev": true,
|
||||
@@ -8369,16 +8084,6 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/no-case": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
|
||||
"integrity": "sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"lower-case": "^2.0.2",
|
||||
"tslib": "^2.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/node-fetch": {
|
||||
"version": "2.6.7",
|
||||
"license": "MIT",
|
||||
@@ -9663,16 +9368,6 @@
|
||||
"url": "https://github.com/chalk/ansi-styles?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/snake-case": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz",
|
||||
"integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"dot-case": "^3.0.4",
|
||||
"tslib": "^2.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map": {
|
||||
"version": "0.5.7",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
|
||||
@@ -10000,12 +9695,6 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/svg-parser": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/svg-parser/-/svg-parser-2.0.4.tgz",
|
||||
"integrity": "sha512-e4hG1hRwoOdRb37cIMSgzNsxyzKfayW6VOflrwvR+/bzrkyxY/31WkbgnQpgtrNp1SdpJvpUAGTa/ZoiPNDuRQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/temp": {
|
||||
"version": "0.9.4",
|
||||
"license": "MIT",
|
||||
@@ -10443,9 +10132,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "4.5.3",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
|
||||
"integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
|
||||
"version": "4.4.9",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-4.4.9.tgz",
|
||||
"integrity": "sha512-2mbUn2LlUmNASWwSCNSJ/EG2HuSRTnVNaydp6vMCm5VIqJsjMfbIWtbH2kDuwUVW5mMUKKZvGPX/rqeqVvv1XA==",
|
||||
"dependencies": {
|
||||
"esbuild": "^0.18.10",
|
||||
"postcss": "^8.4.27",
|
||||
@@ -10519,20 +10208,6 @@
|
||||
"workbox-window": "^6.5.4"
|
||||
}
|
||||
},
|
||||
"node_modules/vite-plugin-svgr": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/vite-plugin-svgr/-/vite-plugin-svgr-4.2.0.tgz",
|
||||
"integrity": "sha512-SC7+FfVtNQk7So0XMjrrtLAbEC8qjFPifyD7+fs/E6aaNdVde6umlVVh0QuwDLdOMu7vp5RiGFsB70nj5yo0XA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@rollup/pluginutils": "^5.0.5",
|
||||
"@svgr/core": "^8.1.0",
|
||||
"@svgr/plugin-jsx": "^8.1.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vite": "^2.6.0 || 3 || 4 || 5"
|
||||
}
|
||||
},
|
||||
"node_modules/vite-tsconfig-paths": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/vite-tsconfig-paths/-/vite-tsconfig-paths-4.2.0.tgz",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "ucentral-client",
|
||||
"version": "3.2.0",
|
||||
"version": "3.0.0(1)",
|
||||
"description": "",
|
||||
"private": true,
|
||||
"main": "index.tsx",
|
||||
@@ -94,7 +94,6 @@
|
||||
"lint-staged": "^13.2.1",
|
||||
"prettier": "^2.8.7",
|
||||
"vite-plugin-pwa": "^0.14.7",
|
||||
"vite-plugin-svgr": "^4.2.0",
|
||||
"vite-tsconfig-paths": "^4.2.0"
|
||||
},
|
||||
"browserslist": {
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 294 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 394 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 141 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 138 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 245 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 245 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 245 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 239 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 239 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 239 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 100 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 100 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 123 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 140 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 121 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 129 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 129 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 286 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 502 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 637 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 324 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 313 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 314 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 283 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 374 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 33 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 267 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 331 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 194 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 194 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 133 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 133 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 194 KiB |
@@ -54,7 +54,6 @@ const DeviceActionDropdown = ({
|
||||
}: Props) => {
|
||||
const { t } = useTranslation();
|
||||
const toast = useToast();
|
||||
const deviceType = device?.deviceType ?? 'ap';
|
||||
const connectColor = useColorModeValue('blackAlpha', 'gray');
|
||||
const addEventListeners = useControllerStore((state) => state.addEventListeners);
|
||||
const { refetch: getRtty, isFetching: isRtty } = useGetDeviceRtty({
|
||||
@@ -206,7 +205,7 @@ const DeviceActionDropdown = ({
|
||||
isDisabled={isDisabled}
|
||||
onClick={handleOpenScan}
|
||||
colorScheme="teal"
|
||||
hidden={isCompact || deviceType !== 'ap'}
|
||||
hidden={isCompact}
|
||||
/>
|
||||
</Tooltip>
|
||||
<Menu>
|
||||
@@ -222,7 +221,7 @@ const DeviceActionDropdown = ({
|
||||
<Portal>
|
||||
<MenuList maxH="315px" overflowY="auto">
|
||||
<MenuItem onClick={handleBlinkClick}>{t('commands.blink')}</MenuItem>
|
||||
<MenuItem onClick={handleOpenConfigure} hidden={!isCompact || deviceType !== 'ap'}>
|
||||
<MenuItem onClick={handleOpenConfigure} hidden={!isCompact}>
|
||||
{t('controller.configure.title')}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleConnectClick} hidden={!isCompact}>
|
||||
@@ -240,7 +239,7 @@ const DeviceActionDropdown = ({
|
||||
<MenuItem onClick={handleUpdateToLatest} hidden>
|
||||
{t('premium.toolbox.upgrade_to_latest')}
|
||||
</MenuItem>
|
||||
<MenuItem onClick={handleOpenScan} hidden={!isCompact || deviceType !== 'ap'}>
|
||||
<MenuItem onClick={handleOpenScan} hidden={!isCompact}>
|
||||
{t('commands.wifiscan')}
|
||||
</MenuItem>
|
||||
</MenuList>
|
||||
|
||||
@@ -26,7 +26,7 @@ export const ResponsiveTag = React.memo(({ label, icon, tooltip, isCompact, ...p
|
||||
return (
|
||||
<Tooltip label={tooltip ?? label}>
|
||||
<Tag size="lg" colorScheme="blue" {...props}>
|
||||
<TagLeftIcon boxSize="18px" as={icon} mt={-0.5} />
|
||||
<TagLeftIcon boxSize="18px" as={icon} />
|
||||
<TagLabel>{label}</TagLabel>
|
||||
</Tag>
|
||||
</Tooltip>
|
||||
|
||||
@@ -2,8 +2,7 @@ import * as React from 'react';
|
||||
import { ColumnDef, PaginationState, SortingColumnDef, SortingState, VisibilityState } from '@tanstack/react-table';
|
||||
import { useAuth } from 'contexts/AuthProvider';
|
||||
|
||||
const getDefaultSettings = ({ settings, showAllRows }: { settings?: string; showAllRows?: boolean }) => {
|
||||
if (showAllRows) return { pageSize: 1000, pageIndex: 0 };
|
||||
const getDefaultSettings = (settings?: string) => {
|
||||
let limit = 10;
|
||||
let index = 0;
|
||||
|
||||
@@ -55,10 +54,9 @@ export type UseDataGridProps = {
|
||||
tableSettingsId: string;
|
||||
defaultOrder: string[];
|
||||
defaultSortBy?: SortingState;
|
||||
showAllRows?: boolean;
|
||||
};
|
||||
|
||||
export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder, showAllRows }: UseDataGridProps) => {
|
||||
export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder }: UseDataGridProps) => {
|
||||
const orderSetting = `${tableSettingsId}.order`;
|
||||
const hiddenColumnSetting = `${tableSettingsId}.hiddenColumns`;
|
||||
const pageSetting = `${tableSettingsId}.page`;
|
||||
@@ -68,9 +66,8 @@ export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder, show
|
||||
const [columnOrder, setColumnOrder] = React.useState<string[]>(
|
||||
getSavedColumnOrder(defaultOrder ?? [], tableSettingsId),
|
||||
);
|
||||
const [pageInfo, setPageInfo] = React.useState<PaginationState>(
|
||||
getDefaultSettings({ settings: tableSettingsId, showAllRows }),
|
||||
);
|
||||
const [pageInfo, setPageInfo] = React.useState<PaginationState>(getDefaultSettings(tableSettingsId));
|
||||
|
||||
const setNewColumnOrder = React.useCallback(
|
||||
(newOrder: string[]) => {
|
||||
setColumnOrder(newOrder);
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React from 'react';
|
||||
import { FormControl, FormErrorMessage, FormLabel } from '@chakra-ui/react';
|
||||
import { CreatableSelect, Select } from 'chakra-react-select';
|
||||
import { Select } from 'chakra-react-select';
|
||||
import PropTypes from 'prop-types';
|
||||
import isEqual from 'react-fast-compare';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
@@ -25,7 +25,6 @@ const propTypes = {
|
||||
isHidden: PropTypes.bool,
|
||||
isPortal: PropTypes.bool.isRequired,
|
||||
definitionKey: PropTypes.string,
|
||||
isCreatable: PropTypes.bool,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
@@ -37,7 +36,6 @@ const defaultProps = {
|
||||
isDisabled: false,
|
||||
isHidden: false,
|
||||
definitionKey: null,
|
||||
isCreatable: false,
|
||||
};
|
||||
|
||||
const FastMultiSelectInput = ({
|
||||
@@ -52,7 +50,6 @@ const FastMultiSelectInput = ({
|
||||
isRequired,
|
||||
isDisabled,
|
||||
isHidden,
|
||||
isCreatable,
|
||||
isPortal,
|
||||
definitionKey,
|
||||
}) => {
|
||||
@@ -64,32 +61,6 @@ const FastMultiSelectInput = ({
|
||||
{label}
|
||||
<ConfigurationFieldExplanation definitionKey={definitionKey} />
|
||||
</FormLabel>
|
||||
{isCreatable ? (
|
||||
<CreatableSelect
|
||||
chakraStyles={{
|
||||
control: (provided, { isDisabled: isControlDisabled }) => ({
|
||||
...provided,
|
||||
borderRadius: '15px',
|
||||
opacity: isControlDisabled ? '0.8 !important' : '1',
|
||||
border: '2px solid',
|
||||
}),
|
||||
dropdownIndicator: (provided) => ({
|
||||
...provided,
|
||||
backgroundColor: 'unset',
|
||||
border: 'unset',
|
||||
}),
|
||||
}}
|
||||
classNamePrefix={isPortal ? 'chakra-react-select' : ''}
|
||||
menuPortalTarget={isPortal ? document.body : undefined}
|
||||
isMulti
|
||||
closeMenuOnSelect={false}
|
||||
options={options}
|
||||
value={value}
|
||||
onChange={onChange}
|
||||
onBlur={onBlur}
|
||||
isDisabled={isDisabled}
|
||||
/>
|
||||
) : (
|
||||
<Select
|
||||
chakraStyles={{
|
||||
control: (provided, { isDisabled: isControlDisabled }) => ({
|
||||
@@ -119,7 +90,6 @@ const FastMultiSelectInput = ({
|
||||
onBlur={onBlur}
|
||||
isDisabled={isDisabled}
|
||||
/>
|
||||
)}
|
||||
<FormErrorMessage>{error}</FormErrorMessage>
|
||||
</FormControl>
|
||||
);
|
||||
|
||||
@@ -20,7 +20,6 @@ const propTypes = {
|
||||
canSelectAll: PropTypes.bool,
|
||||
isPortal: PropTypes.bool,
|
||||
definitionKey: PropTypes.string,
|
||||
isCreatable: PropTypes.bool,
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
@@ -32,7 +31,6 @@ const defaultProps = {
|
||||
canSelectAll: false,
|
||||
isPortal: false,
|
||||
definitionKey: null,
|
||||
isCreatable: false,
|
||||
};
|
||||
|
||||
const MultiSelectField = ({
|
||||
@@ -45,23 +43,12 @@ const MultiSelectField = ({
|
||||
emptyIsUndefined,
|
||||
canSelectAll,
|
||||
hasVirtualAll,
|
||||
isCreatable,
|
||||
isPortal,
|
||||
definitionKey,
|
||||
}) => {
|
||||
const [{ value }, { touched, error }, { setValue, setTouched }] = useField(name);
|
||||
|
||||
const onChange = useCallback(
|
||||
(option) => {
|
||||
if (isCreatable) {
|
||||
if (typeof option === 'string') {
|
||||
setValue([...value, option]);
|
||||
} else {
|
||||
setValue(option);
|
||||
}
|
||||
|
||||
// setValue([...value, option]);
|
||||
} else {
|
||||
const onChange = useCallback((option) => {
|
||||
const allIndex = option.findIndex((opt) => opt.value === '*');
|
||||
if (option.length === 0 && emptyIsUndefined) {
|
||||
setValue(undefined);
|
||||
@@ -74,10 +61,7 @@ const MultiSelectField = ({
|
||||
} else if (option.length > 0) setValue(option.map((val) => val.value));
|
||||
else setValue([]);
|
||||
setTouched(true);
|
||||
}
|
||||
},
|
||||
[value],
|
||||
);
|
||||
}, []);
|
||||
|
||||
const onFieldBlur = useCallback(() => {
|
||||
setTouched(true);
|
||||
@@ -98,7 +82,6 @@ const MultiSelectField = ({
|
||||
isHidden={isHidden}
|
||||
isPortal={isPortal}
|
||||
definitionKey={definitionKey}
|
||||
isCreatable={isCreatable}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -59,44 +59,17 @@ const _ConfigureModal = ({ serialNumber, modalProps }: ConfigureModalProps) => {
|
||||
try {
|
||||
const config = JSON.parse(newConfig);
|
||||
configure.mutate(config, {
|
||||
onSuccess: (data) => {
|
||||
if (data.errorCode === 0) {
|
||||
onSuccess: () => {
|
||||
toast({
|
||||
id: `configure-success-${serialNumber}`,
|
||||
title: t('common.success'),
|
||||
description:
|
||||
data.status === 'pending'
|
||||
? 'Command is pending! It will execute once the device connects'
|
||||
: t('controller.configure.success'),
|
||||
description: t('controller.configure.success'),
|
||||
status: 'success',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
modalProps.onClose();
|
||||
} else if (data.errorCode === 1) {
|
||||
toast({
|
||||
id: `configure-warning-${serialNumber}`,
|
||||
title: 'Warning',
|
||||
description: `${data?.errorText ?? 'Unknown Warning'}`,
|
||||
status: 'warning',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
modalProps.onClose();
|
||||
} else {
|
||||
toast({
|
||||
id: `config-error-${serialNumber}`,
|
||||
title: t('common.error'),
|
||||
description: `${data?.errorText ?? 'Unknown Error'} (Code ${data.errorCode})`,
|
||||
status: 'error',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
}
|
||||
modalProps.onClose();
|
||||
},
|
||||
});
|
||||
} catch (e) {
|
||||
|
||||
@@ -25,7 +25,6 @@ import { useTranslation } from 'react-i18next';
|
||||
import { Modal } from '../Modal';
|
||||
import { lowercaseFirstLetter } from 'helpers/stringHelper';
|
||||
import { useTelemetry } from 'hooks/Network/Telemetry';
|
||||
import { secondsDuration } from 'helpers/dateFormatting';
|
||||
|
||||
export type TelemetryModalProps = {
|
||||
serialNumber: string;
|
||||
@@ -147,7 +146,8 @@ const _TelemetryModal = ({ serialNumber, modalProps }: TelemetryModalProps) => {
|
||||
{t('controller.telemetry.interval')}: {form.interval} {lowercaseFirstLetter(t('common.seconds'))}
|
||||
</p>
|
||||
<p>
|
||||
{t('controller.telemetry.duration')}: {secondsDuration(form.lifetime, t)}
|
||||
{t('controller.telemetry.duration')}: {form.interval}{' '}
|
||||
{lowercaseFirstLetter(t('controller.telemetry.minutes'))}
|
||||
</p>
|
||||
<p>
|
||||
{t('controller.telemetry.types')}: {form.types.join(', ')}
|
||||
|
||||
1
src/custom.d.ts
vendored
1
src/custom.d.ts
vendored
@@ -8,4 +8,3 @@ declare module '*.png' {
|
||||
const value: string;
|
||||
export = value;
|
||||
}
|
||||
/// <reference types="vite-plugin-svgr/client" />
|
||||
|
||||
@@ -174,37 +174,12 @@ export const useGetEventQueue = () => {
|
||||
};
|
||||
|
||||
const configureDevice = (serialNumber: string) => async (configuration: Record<string, unknown>) =>
|
||||
axiosGw
|
||||
.post<unknown>(`device/${serialNumber}/configure`, {
|
||||
axiosGw.post<unknown>(`device/${serialNumber}/configure`, {
|
||||
when: 0,
|
||||
UUID: 1,
|
||||
serialNumber,
|
||||
configuration,
|
||||
})
|
||||
.then(
|
||||
(res) =>
|
||||
res.data as Partial<{
|
||||
UUID: string;
|
||||
attachFile: number;
|
||||
command: string;
|
||||
completed: number;
|
||||
custom: number;
|
||||
deferred: boolean;
|
||||
details: Record<string, unknown>;
|
||||
errorCode: number;
|
||||
errorText: string;
|
||||
executed: number;
|
||||
executionTime: number;
|
||||
lastTry: number;
|
||||
results: Record<string, unknown>;
|
||||
serialNumber: string;
|
||||
status: string;
|
||||
submitted: number;
|
||||
submittedBy: string;
|
||||
waitingForFile: number;
|
||||
when: number;
|
||||
}>,
|
||||
);
|
||||
});
|
||||
|
||||
export const useConfigureDevice = ({ serialNumber }: { serialNumber: string }) => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
@@ -3,12 +3,10 @@ import { axiosGw } from 'constants/axiosInstances';
|
||||
import { useEndpointStatus } from 'hooks/useEndpointStatus';
|
||||
import { AxiosError } from 'models/Axios';
|
||||
import { DeviceConfiguration } from 'models/Device';
|
||||
import { DevicePlatform } from './Devices';
|
||||
|
||||
export type DefaultConfigurationResponse = {
|
||||
configuration: DeviceConfiguration;
|
||||
created: number;
|
||||
platform: DevicePlatform;
|
||||
description: string;
|
||||
lastModified: number;
|
||||
modelIds: string[];
|
||||
|
||||
@@ -9,21 +9,15 @@ import { AxiosError } from 'models/Axios';
|
||||
import { DeviceRttyApiResponse, GatewayDevice, WifiScanCommand, WifiScanResult } from 'models/Device';
|
||||
import { Note } from 'models/Note';
|
||||
import { PageInfo } from 'models/Table';
|
||||
import { DeviceCommandHistory } from './Commands';
|
||||
|
||||
export const DEVICE_PLATFORMS = ['all', 'ap', 'switch'] as const;
|
||||
export type DevicePlatform = (typeof DEVICE_PLATFORMS)[number];
|
||||
const getDeviceCount = () =>
|
||||
axiosGw.get('devices?countOnly=true').then((response) => response.data) as Promise<{ count: number }>;
|
||||
|
||||
const getDeviceCount = (platform: DevicePlatform) =>
|
||||
axiosGw.get(`devices?countOnly=true&platform=${platform}`).then((response) => response.data) as Promise<{
|
||||
count: number;
|
||||
}>;
|
||||
|
||||
export const useGetDeviceCount = ({ enabled, platform = 'all' }: { enabled: boolean; platform?: DevicePlatform }) => {
|
||||
export const useGetDeviceCount = ({ enabled }: { enabled: boolean }) => {
|
||||
const { t } = useTranslation();
|
||||
const toast = useToast();
|
||||
|
||||
return useQuery(['devices', 'count', { platform }], () => getDeviceCount(platform), {
|
||||
return useQuery(['devices', 'count'], getDeviceCount, {
|
||||
enabled,
|
||||
onError: (e: AxiosError) => {
|
||||
if (!toast.isActive('inventory-fetching-error'))
|
||||
@@ -48,14 +42,13 @@ export type DeviceWithStatus = {
|
||||
associations_2G: number;
|
||||
associations_5G: number;
|
||||
associations_6G: number;
|
||||
blackListed?: boolean;
|
||||
compatible: string;
|
||||
connected: boolean;
|
||||
connectReason?: string;
|
||||
certificateExpiryDate?: number;
|
||||
createdTimestamp: number;
|
||||
devicePassword: string;
|
||||
deviceType: 'ap' | 'switch';
|
||||
deviceType: 'AP' | 'SWITCH' | 'IOT' | 'MESH';
|
||||
entity: string;
|
||||
firmware: string;
|
||||
fwUpdatePolicy: string;
|
||||
@@ -102,27 +95,25 @@ export const getSingleDeviceWithStatus = (serialNumber: string) =>
|
||||
})
|
||||
.catch(() => undefined);
|
||||
|
||||
const getDevices = (limit: number, offset: number, platform: DevicePlatform) =>
|
||||
const getDevices = (limit: number, offset: number) =>
|
||||
axiosGw
|
||||
.get(`devices?deviceWithStatus=true&limit=${limit}&offset=${offset}&platform=${platform}`)
|
||||
.get(`devices?deviceWithStatus=true&limit=${limit}&offset=${offset}`)
|
||||
.then((response) => response.data) as Promise<{ devicesWithStatus: DeviceWithStatus[] }>;
|
||||
|
||||
export const useGetDevices = ({
|
||||
pageInfo,
|
||||
enabled,
|
||||
onError,
|
||||
platform = 'all',
|
||||
}: {
|
||||
pageInfo?: PageInfo;
|
||||
enabled: boolean;
|
||||
onError?: (e: AxiosError) => void;
|
||||
platform?: DevicePlatform;
|
||||
}) => {
|
||||
const offset = pageInfo?.limit !== undefined ? pageInfo.limit * pageInfo.index : 0;
|
||||
|
||||
return useQuery(
|
||||
['devices', 'all', { limit: pageInfo?.limit, offset, platform }],
|
||||
() => getDevices(pageInfo?.limit || 0, offset, platform),
|
||||
['devices', 'all', { limit: pageInfo?.limit, offset }],
|
||||
() => getDevices(pageInfo?.limit || 0, offset),
|
||||
{
|
||||
keepPreviousData: true,
|
||||
enabled: enabled && pageInfo !== undefined,
|
||||
@@ -132,28 +123,22 @@ export const useGetDevices = ({
|
||||
);
|
||||
};
|
||||
|
||||
const getAllDevices = async (platform: DevicePlatform) => {
|
||||
const getAllDevices = async () => {
|
||||
let offset = 0;
|
||||
let devices: DeviceWithStatus[] = [];
|
||||
let devicesResponse: { devicesWithStatus: DeviceWithStatus[] };
|
||||
do {
|
||||
// eslint-disable-next-line no-await-in-loop
|
||||
devicesResponse = await getDevices(500, offset, platform);
|
||||
devicesResponse = await getDevices(500, offset);
|
||||
devices = devices.concat(devicesResponse.devicesWithStatus);
|
||||
offset += 500;
|
||||
} while (devicesResponse.devicesWithStatus.length === 500);
|
||||
return devices;
|
||||
};
|
||||
|
||||
export const useGetAllDevicesWithStatus = ({
|
||||
onError,
|
||||
platform = 'all',
|
||||
}: {
|
||||
onError?: (e: AxiosError) => void;
|
||||
platform?: DevicePlatform;
|
||||
}) => {
|
||||
export const useGetAllDevicesWithStatus = ({ onError }: { onError?: (e: AxiosError) => void }) => {
|
||||
const { isReady } = useEndpointStatus('owgw');
|
||||
return useQuery(['devices', 'all', 'full', { platform }], () => getAllDevices(platform), {
|
||||
return useQuery(['devices', 'all', 'full'], getAllDevices, {
|
||||
enabled: isReady && false,
|
||||
onError,
|
||||
});
|
||||
@@ -446,45 +431,3 @@ export const useUpdateDevice = ({ serialNumber }: { serialNumber: string }) => {
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const deleteDeviceBatch = async (pattern: string) => {
|
||||
if (pattern.length < 6) throw new Error('Pattern must be at least 6 characters long');
|
||||
|
||||
axiosGw.delete(`devices?macPattern=${pattern}`);
|
||||
};
|
||||
|
||||
export const useDeleteDeviceBatch = () => {
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation(deleteDeviceBatch, {
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries(['devices']);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export type PowerCyclePort = {
|
||||
/** Ex.: Ethernet0 */
|
||||
name: string;
|
||||
/** Cycle length in MS. Default is 10 000 */
|
||||
cycle?: number;
|
||||
};
|
||||
|
||||
export type PowerCycleRequest = {
|
||||
serial: string;
|
||||
when: number;
|
||||
ports: PowerCyclePort[];
|
||||
};
|
||||
|
||||
export const usePowerCycle = () => {
|
||||
const queryClient = useQueryClient();
|
||||
return useMutation(
|
||||
(request: PowerCycleRequest) =>
|
||||
axiosGw.post(`device/${request.serial}/powercycle`, request).then((res) => res.data as DeviceCommandHistory),
|
||||
{
|
||||
onSettled: () => {
|
||||
queryClient.invalidateQueries(['commands']);
|
||||
},
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
@@ -70,34 +70,15 @@ export const useUpdateDeviceFirmware = ({ serialNumber, onClose }: { serialNumbe
|
||||
|
||||
return useMutation(
|
||||
({ keepRedirector, uri, signature }: { keepRedirector: boolean; uri: string; signature?: string }) =>
|
||||
axiosGw
|
||||
.post(`device/${serialNumber}/upgrade${signature ? `?FWsignature=${signature}` : ''}`, {
|
||||
axiosGw.post(`device/${serialNumber}/upgrade${signature ? `?FWsignature=${signature}` : ''}`, {
|
||||
serialNumber,
|
||||
when: 0,
|
||||
keepRedirector,
|
||||
uri,
|
||||
signature,
|
||||
})
|
||||
.then(
|
||||
(response) =>
|
||||
response as {
|
||||
data: {
|
||||
errorCode: number;
|
||||
errorText: string;
|
||||
status: string;
|
||||
results?: {
|
||||
status?: {
|
||||
error?: number;
|
||||
resultCode?: number;
|
||||
text?: string;
|
||||
};
|
||||
};
|
||||
};
|
||||
},
|
||||
),
|
||||
}),
|
||||
{
|
||||
onSuccess: ({ data }) => {
|
||||
if (data.errorCode === 0) {
|
||||
onSuccess: () => {
|
||||
toast({
|
||||
id: `device-upgrade-success-${uuid()}`,
|
||||
title: t('common.success'),
|
||||
@@ -108,28 +89,6 @@ export const useUpdateDeviceFirmware = ({ serialNumber, onClose }: { serialNumbe
|
||||
position: 'top-right',
|
||||
});
|
||||
onClose();
|
||||
} else if (data.errorCode === 1) {
|
||||
toast({
|
||||
id: `device-upgrade-warning-${uuid()}`,
|
||||
title: 'Warning',
|
||||
description: `${data?.errorText ?? 'Unknown Warning'}`,
|
||||
status: 'warning',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
onClose();
|
||||
} else {
|
||||
toast({
|
||||
id: `device-upgrade-error-${uuid()}`,
|
||||
title: t('common.error'),
|
||||
description: `${data?.errorText ?? 'Unknown Error'} (Code ${data.errorCode})`,
|
||||
status: 'error',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
}
|
||||
},
|
||||
onError: (e: AxiosError) => {
|
||||
toast({
|
||||
|
||||
@@ -2,24 +2,7 @@ import { useQuery } from '@tanstack/react-query';
|
||||
import { axiosGw } from 'constants/axiosInstances';
|
||||
import { AxiosError } from 'models/Axios';
|
||||
|
||||
export type DeviceLinkState = {
|
||||
carrier?: number;
|
||||
counters?: {
|
||||
collisions: number;
|
||||
multicast: number;
|
||||
rx_bytes: number;
|
||||
rx_dropped: number;
|
||||
rx_errors: number;
|
||||
rx_packets: number;
|
||||
tx_bytes: number;
|
||||
tx_dropped: number;
|
||||
tx_errors: number;
|
||||
tx_packets: number;
|
||||
};
|
||||
duplex?: string;
|
||||
speed?: number;
|
||||
};
|
||||
export type DeviceInterfaceStatistics = {
|
||||
type DeviceInterfaceStatistics = {
|
||||
clients: {
|
||||
ipv4_addresses?: string[];
|
||||
ipv6_addresses?: string[];
|
||||
@@ -59,7 +42,6 @@ export type DeviceInterfaceStatistics = {
|
||||
dynamic_vlan?: number;
|
||||
inactive: number;
|
||||
ipaddr_v4: string;
|
||||
fingerprint?: object;
|
||||
rssi: number;
|
||||
rx_bytes: number;
|
||||
rx_duration: number;
|
||||
@@ -130,21 +112,11 @@ export type DeviceStatistics = {
|
||||
channel: number;
|
||||
band?: string[];
|
||||
channel_width: string;
|
||||
noise?: number;
|
||||
noise: number;
|
||||
phy: string;
|
||||
receive_ms: number;
|
||||
transmit_ms: number;
|
||||
temperature?: number;
|
||||
tx_power: number;
|
||||
frequency?: number[];
|
||||
survey?: {
|
||||
busy: number;
|
||||
frequency: number;
|
||||
noise: number;
|
||||
time: number;
|
||||
time_rx: number;
|
||||
time_tx: number;
|
||||
}[];
|
||||
}[];
|
||||
dynamic_vlans?: {
|
||||
vid: number;
|
||||
@@ -166,10 +138,18 @@ export type DeviceStatistics = {
|
||||
};
|
||||
'link-state'?: {
|
||||
downstream: {
|
||||
[key: string]: DeviceLinkState;
|
||||
eth1?: {
|
||||
carrier?: number;
|
||||
duplex?: string;
|
||||
speed?: number;
|
||||
};
|
||||
};
|
||||
upstream: {
|
||||
[key: string]: DeviceLinkState;
|
||||
eth0?: {
|
||||
carrier?: number;
|
||||
duplex?: string;
|
||||
speed?: number;
|
||||
};
|
||||
};
|
||||
};
|
||||
'lldp-peers'?: {
|
||||
@@ -210,7 +190,6 @@ export const useGetDeviceLastStats = ({
|
||||
useQuery(['device', serialNumber, 'last-statistics'], () => getLastStats(serialNumber), {
|
||||
enabled: serialNumber !== undefined && serialNumber !== '',
|
||||
staleTime: 1000 * 60,
|
||||
refetchInterval: 1000 * 60,
|
||||
onError,
|
||||
});
|
||||
|
||||
|
||||
@@ -1,6 +1,16 @@
|
||||
import * as React from 'react';
|
||||
import { Flex, Heading, Icon, Text, Tooltip, VStack } from '@chakra-ui/react';
|
||||
import { ArrowSquareDown, ArrowSquareUp } from '@phosphor-icons/react';
|
||||
import {
|
||||
Box,
|
||||
CircularProgress,
|
||||
CircularProgressLabel,
|
||||
Flex,
|
||||
Heading,
|
||||
Icon,
|
||||
Text,
|
||||
Tooltip,
|
||||
VStack,
|
||||
} from '@chakra-ui/react';
|
||||
import { ArrowSquareDown, ArrowSquareUp, Clock } from '@phosphor-icons/react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Card } from 'components/Containers/Card';
|
||||
import { compactSecondsToDetailed, minimalSecondsToDetailed } from 'helpers/dateFormatting';
|
||||
@@ -10,26 +20,74 @@ import { useGetDevicesStats } from 'hooks/Network/Devices';
|
||||
const SidebarDevices = () => {
|
||||
const { t } = useTranslation();
|
||||
const getStats = useGetDevicesStats({});
|
||||
const [lastTime, setLastTime] = React.useState<Date | undefined>();
|
||||
const [lastUpdate, setLastUpdate] = React.useState<Date | undefined>();
|
||||
|
||||
const time = React.useMemo(() => {
|
||||
if (lastTime === undefined || lastUpdate === undefined) return null;
|
||||
|
||||
const seconds = lastTime.getTime() - lastUpdate.getTime();
|
||||
|
||||
return Math.max(0, Math.floor(seconds / 1000));
|
||||
}, [lastTime, lastUpdate]);
|
||||
|
||||
const circleColor = () => {
|
||||
if (time === null) return 'gray.300';
|
||||
if (time < 10) return 'green.300';
|
||||
if (time < 30) return 'yellow.300';
|
||||
return 'red.300';
|
||||
};
|
||||
|
||||
React.useEffect(() => {
|
||||
setLastUpdate(new Date());
|
||||
}, [getStats.data]);
|
||||
|
||||
React.useEffect(() => {
|
||||
const interval = setInterval(() => {
|
||||
setLastTime(new Date());
|
||||
}, 1000);
|
||||
return () => {
|
||||
clearInterval(interval);
|
||||
};
|
||||
}, []);
|
||||
|
||||
if (!getStats.data) return null;
|
||||
|
||||
return (
|
||||
<Card p={4}>
|
||||
<Tooltip hasArrow label={t('controller.stats.seconds_ago', { s: time })}>
|
||||
<CircularProgress
|
||||
isIndeterminate
|
||||
color={circleColor()}
|
||||
position="absolute"
|
||||
right="6px"
|
||||
top="6px"
|
||||
w="unset"
|
||||
size={6}
|
||||
thickness="14px"
|
||||
>
|
||||
<CircularProgressLabel fontSize="1.9em">{time}s</CircularProgressLabel>
|
||||
</CircularProgress>
|
||||
</Tooltip>
|
||||
<Tooltip hasArrow label={t('controller.stats.seconds_ago', { s: time })}>
|
||||
<Box position="absolute" right="8px" top="8px" w="unset" hidden>
|
||||
<Clock size={16} />
|
||||
</Box>
|
||||
</Tooltip>
|
||||
<VStack mb={-1}>
|
||||
<Flex flexDir="column" textAlign="center">
|
||||
<Heading size="md">{getStats.data.connectedDevices}</Heading>
|
||||
<Heading size="xs" display="flex" justifyContent="center">
|
||||
<Text>
|
||||
{t('common.connected')} {t('devices.title')}{' '}
|
||||
</Text>{' '}
|
||||
</Heading>
|
||||
<Heading size="md">{getStats.data.connectedDevices}</Heading>
|
||||
<Heading size="xs">{t('controller.devices.average_uptime')}</Heading>
|
||||
<Tooltip hasArrow label={compactSecondsToDetailed(getStats.data.averageConnectionTime, t)}>
|
||||
<Heading size="md" textAlign="center" mt={1}>
|
||||
{minimalSecondsToDetailed(getStats.data.averageConnectionTime, t)}
|
||||
</Heading>
|
||||
</Tooltip>
|
||||
|
||||
<Heading size="xs">{t('controller.devices.average_uptime')}</Heading>
|
||||
<Flex fontSize="sm" fontWeight="bold" alignItems="center" justifyContent="center" mt={1}>
|
||||
<Tooltip hasArrow label="Rx">
|
||||
<Flex alignItems="center" mr={1}>
|
||||
|
||||
@@ -3,7 +3,6 @@ import { Note } from './Note';
|
||||
|
||||
export interface GatewayDevice {
|
||||
UUID: number;
|
||||
blackListed?: boolean;
|
||||
certificateExpiryDate: number;
|
||||
compatible: string;
|
||||
configuration: unknown;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import { Box, Flex, useBoolean, useDisclosure, useToast } from '@chakra-ui/react';
|
||||
import { Box, SimpleGrid, useBoolean, useDisclosure, useToast } from '@chakra-ui/react';
|
||||
import { Formik, FormikProps } from 'formik';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
@@ -16,7 +16,6 @@ import { useGetDeviceTypes } from 'hooks/Network/Firmware';
|
||||
import { useFormModal } from 'hooks/useFormModal';
|
||||
import { useFormRef } from 'hooks/useFormRef';
|
||||
import { AxiosError } from 'models/Axios';
|
||||
import { SelectField } from 'components/Form/Fields/SelectField';
|
||||
|
||||
const CreateDefaultConfigurationModal = () => {
|
||||
const { t } = useTranslation();
|
||||
@@ -69,9 +68,7 @@ const CreateDefaultConfigurationModal = () => {
|
||||
key={formKey}
|
||||
validationSchema={DefaultConfigurationSchema(t)}
|
||||
onSubmit={(data, { setSubmitting, resetForm }) => {
|
||||
createConfig.mutateAsync(
|
||||
{ ...data, modelIds: data.modelIds.map((v) => v.value) },
|
||||
{
|
||||
createConfig.mutateAsync(data, {
|
||||
onSuccess: () => {
|
||||
toast({
|
||||
id: `config-create-success`,
|
||||
@@ -99,33 +96,14 @@ const CreateDefaultConfigurationModal = () => {
|
||||
});
|
||||
setSubmitting(false);
|
||||
},
|
||||
},
|
||||
);
|
||||
});
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Flex mb={4}>
|
||||
<StringField
|
||||
name="name"
|
||||
label={t('common.name')}
|
||||
isRequired
|
||||
isDisabled={isDisabled}
|
||||
maxW="340px"
|
||||
mr={4}
|
||||
/>
|
||||
<SelectField
|
||||
name="platform"
|
||||
label="Platform"
|
||||
options={[
|
||||
{ label: 'AP', value: 'ap' },
|
||||
{ label: 'Switch', value: 'switch' },
|
||||
]}
|
||||
isRequired
|
||||
isDisabled={isDisabled}
|
||||
w="max-content"
|
||||
/>
|
||||
</Flex>
|
||||
<StringField name="description" label={t('common.description')} isDisabled={isDisabled} mb={4} />
|
||||
<SimpleGrid spacing={4} minChildWidth="200px">
|
||||
<StringField name="name" label={t('common.name')} isRequired isDisabled={isDisabled} />
|
||||
<StringField name="description" label={t('common.description')} isDisabled={isDisabled} />
|
||||
</SimpleGrid>
|
||||
<MultiSelectField
|
||||
name="modelIds"
|
||||
label={t('controller.dashboard.device_types')}
|
||||
@@ -136,10 +114,9 @@ const CreateDefaultConfigurationModal = () => {
|
||||
value: devType,
|
||||
})) ?? []
|
||||
}
|
||||
isCreatable
|
||||
isRequired
|
||||
/>
|
||||
<StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} mt={4} />
|
||||
<StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} />
|
||||
</Box>
|
||||
</Formik>
|
||||
</Box>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import { Box, Flex, useBoolean, UseDisclosureReturn, useToast } from '@chakra-ui/react';
|
||||
import { Box, SimpleGrid, useBoolean, UseDisclosureReturn, useToast } from '@chakra-ui/react';
|
||||
import { Formik, FormikProps } from 'formik';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
@@ -15,7 +15,6 @@ import { useGetDeviceTypes } from 'hooks/Network/Firmware';
|
||||
import { useFormModal } from 'hooks/useFormModal';
|
||||
import { useFormRef } from 'hooks/useFormRef';
|
||||
import { AxiosError } from 'models/Axios';
|
||||
import { SelectField } from 'components/Form/Fields/SelectField';
|
||||
|
||||
type Props = {
|
||||
modalProps: UseDisclosureReturn;
|
||||
@@ -70,15 +69,12 @@ const EditDefaultConfiguration = ({ modalProps, config }: Props) => {
|
||||
innerRef={formRef as React.Ref<FormikProps<DefaultConfigurationResponse>>}
|
||||
initialValues={{
|
||||
...config,
|
||||
modelIds: config.modelIds.map((v) => ({ label: v, value: v })),
|
||||
configuration: JSON.stringify(config.configuration, null, 2),
|
||||
}}
|
||||
key={formKey}
|
||||
validationSchema={DefaultConfigurationSchema(t)}
|
||||
onSubmit={(data, { setSubmitting, resetForm }) => {
|
||||
updateConfig.mutateAsync(
|
||||
{ ...data, modelIds: data.modelIds.map((v) => v.value) },
|
||||
{
|
||||
updateConfig.mutateAsync(data, {
|
||||
onSuccess: () => {
|
||||
toast({
|
||||
id: `config-edit-success`,
|
||||
@@ -106,33 +102,14 @@ const EditDefaultConfiguration = ({ modalProps, config }: Props) => {
|
||||
});
|
||||
setSubmitting(false);
|
||||
},
|
||||
},
|
||||
);
|
||||
});
|
||||
}}
|
||||
>
|
||||
<Box>
|
||||
<Flex mb={4}>
|
||||
<StringField
|
||||
name="name"
|
||||
label={t('common.name')}
|
||||
isRequired
|
||||
isDisabled={isDisabled}
|
||||
maxW="340px"
|
||||
mr={4}
|
||||
/>
|
||||
<SelectField
|
||||
name="platform"
|
||||
label="Platform"
|
||||
options={[
|
||||
{ label: 'AP', value: 'ap' },
|
||||
{ label: 'Switch', value: 'switch' },
|
||||
]}
|
||||
isRequired
|
||||
isDisabled
|
||||
w="max-content"
|
||||
/>
|
||||
</Flex>
|
||||
<StringField name="description" label={t('common.description')} isDisabled={isDisabled} mb={4} />
|
||||
<SimpleGrid spacing={4} minChildWidth="200px">
|
||||
<StringField name="name" label={t('common.name')} isRequired isDisabled={isDisabled} />
|
||||
<StringField name="description" label={t('common.description')} isDisabled={isDisabled} />
|
||||
</SimpleGrid>
|
||||
<MultiSelectField
|
||||
name="modelIds"
|
||||
label={t('controller.dashboard.device_types')}
|
||||
@@ -143,16 +120,9 @@ const EditDefaultConfiguration = ({ modalProps, config }: Props) => {
|
||||
value: devType,
|
||||
})) ?? []
|
||||
}
|
||||
isCreatable
|
||||
isRequired
|
||||
/>
|
||||
<StringField
|
||||
name="configuration"
|
||||
label={t('configurations.one')}
|
||||
isArea
|
||||
isDisabled={isDisabled}
|
||||
mt={4}
|
||||
/>
|
||||
<StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} />
|
||||
</Box>
|
||||
</Formik>
|
||||
)}
|
||||
|
||||
@@ -58,14 +58,6 @@ const DefaultConfigurationsList = () => {
|
||||
Cell: ({ cell }) => dateCell(cell.row.original.lastModified),
|
||||
customWidth: '50px',
|
||||
},
|
||||
{
|
||||
id: 'platform',
|
||||
Header: 'Platform',
|
||||
Footer: '',
|
||||
accessor: 'platform',
|
||||
Cell: ({ cell }) => cell.row.original.platform.toUpperCase(),
|
||||
customWidth: '50px',
|
||||
},
|
||||
{
|
||||
id: 'modelIds',
|
||||
Header: t('controller.dashboard.device_types'),
|
||||
|
||||
@@ -6,8 +6,7 @@ export const DefaultConfigurationSchema = (t: (str: string) => string) =>
|
||||
.shape({
|
||||
name: Yup.string().required(t('form.required')),
|
||||
description: Yup.string(),
|
||||
modelIds: Yup.array().of(Yup.object()).required(t('form.required')).min(1, t('form.required')),
|
||||
platform: Yup.string().oneOf(['ap', 'switch']).required(t('form.required')),
|
||||
modelIds: Yup.array().of(Yup.string()).required(t('form.required')).min(1, t('form.required')),
|
||||
configuration: Yup.string()
|
||||
.required(t('form.required'))
|
||||
.test('configuration', t('form.invalid_json'), (v) => testJson(v ?? '')),
|
||||
@@ -16,6 +15,5 @@ export const DefaultConfigurationSchema = (t: (str: string) => string) =>
|
||||
name: '',
|
||||
description: '',
|
||||
modelIds: [],
|
||||
platform: 'ap',
|
||||
configuration: '',
|
||||
});
|
||||
|
||||
@@ -65,7 +65,11 @@ const DeviceSummary = ({ serialNumber }: Props) => {
|
||||
const getDeviceCompatible = () => {
|
||||
if (!getDevice.data?.compatible) return undefined;
|
||||
|
||||
if (getDevice.data.compatible.includes(' ')) return getDevice.data.compatible.replaceAll(' ', '_');
|
||||
if (!getDevice.data?.compatible.includes('-')) return getDevice.data?.compatible;
|
||||
|
||||
const split = getDevice.data?.compatible.split('-');
|
||||
|
||||
if (split[split.length - 1]?.length === 2) return split[0]?.trim();
|
||||
|
||||
return getDevice.data?.compatible;
|
||||
};
|
||||
@@ -125,7 +129,9 @@ const DeviceSummary = ({ serialNumber }: Props) => {
|
||||
<Heading size="sm">{t('controller.stats.load')}:</Heading>
|
||||
</GridItem>
|
||||
<GridItem colSpan={1}>
|
||||
{getStats.data?.unit?.load ? getStats.data?.unit.load.map((l) => `${l.toFixed(2)}`).join(' | ') : ''}
|
||||
{getStats.data?.unit?.load
|
||||
? getStats.data?.unit.load.map((l) => `${(l * 100).toFixed(2)}%`).join(' | ')
|
||||
: ''}
|
||||
</GridItem>
|
||||
<GridItem colSpan={1} alignContent="center" alignItems="center">
|
||||
<Heading size="sm">{t('controller.devices.localtime')}:</Heading>
|
||||
@@ -176,7 +182,7 @@ const DeviceSummary = ({ serialNumber }: Props) => {
|
||||
</GridItem>
|
||||
<GridItem colSpan={1}>
|
||||
{getStatus.data?.connectReason && getStatus.data?.connectReason.length > 0
|
||||
? uppercaseFirstLetter(getStatus.data?.connectReason)
|
||||
? uppercaseFirstLetter(getStatus.data.connectReason)
|
||||
: '-'}
|
||||
</GridItem>
|
||||
</Grid>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import { IconButton, Tooltip, useToast } from '@chakra-ui/react';
|
||||
import { Power } from '@phosphor-icons/react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { usePowerCycle } from 'hooks/Network/Devices';
|
||||
import { useNotification } from 'hooks/useNotification';
|
||||
import { DeviceLinkState } from 'hooks/Network/Statistics';
|
||||
|
||||
type Props = {
|
||||
state: DeviceLinkState & { name: string };
|
||||
deviceSerialNumber: string;
|
||||
};
|
||||
|
||||
const LinkStateTableActions = ({ state, deviceSerialNumber }: Props) => {
|
||||
const { t } = useTranslation();
|
||||
const powerCycle = usePowerCycle();
|
||||
const toast = useToast();
|
||||
const { successToast, apiErrorToast } = useNotification();
|
||||
|
||||
const onPowerCycle = () => {
|
||||
powerCycle.mutate(
|
||||
{ serial: deviceSerialNumber, when: 0, ports: [{ name: state.name, cycle: 10 * 1000 }] },
|
||||
{
|
||||
onSuccess: (data) => {
|
||||
if (data.errorCode === 0) {
|
||||
successToast({
|
||||
description: `Power cycle started for port ${state.name} for 10s`,
|
||||
});
|
||||
} else if (data.errorCode === 1) {
|
||||
toast({
|
||||
id: `powercycle-warning-${deviceSerialNumber}`,
|
||||
title: 'Warning',
|
||||
description: `${data?.errorText ?? 'Unknown Warning'}`,
|
||||
status: 'warning',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
} else {
|
||||
toast({
|
||||
id: `powercycle-error-${deviceSerialNumber}`,
|
||||
title: t('common.error'),
|
||||
description: `${data?.errorText ?? 'Unknown Error'} (Code ${data.errorCode})`,
|
||||
status: 'error',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
}
|
||||
},
|
||||
onError: (e) => apiErrorToast({ e }),
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Tooltip label="Power Cycle" placement="auto-start">
|
||||
<IconButton
|
||||
aria-label="Power Cycle"
|
||||
icon={<Power size={20} />}
|
||||
colorScheme="green"
|
||||
onClick={onPowerCycle}
|
||||
isLoading={powerCycle.isLoading}
|
||||
size="xs"
|
||||
/>
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
|
||||
export default LinkStateTableActions;
|
||||
@@ -1,197 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import { Alert, AlertDescription, AlertIcon, Center } from '@chakra-ui/react';
|
||||
import { DeviceLinkState } from 'hooks/Network/Statistics';
|
||||
import DataCell from 'components/TableCells/DataCell';
|
||||
import { DataGridColumn, useDataGrid } from 'components/DataTables/DataGrid/useDataGrid';
|
||||
import { DataGrid } from 'components/DataTables/DataGrid';
|
||||
import { uppercaseFirstLetter } from 'helpers/stringHelper';
|
||||
import LinkStateTableActions from './Actions';
|
||||
|
||||
type Row = DeviceLinkState & { name: string };
|
||||
const dataCell = (v: number) => <DataCell bytes={v} />;
|
||||
const actionCell = (row: Row, serialNumber: string) => (
|
||||
<LinkStateTableActions state={row} deviceSerialNumber={serialNumber} />
|
||||
);
|
||||
|
||||
type Props = {
|
||||
statistics?: Row[];
|
||||
refetch: () => void;
|
||||
isFetching: boolean;
|
||||
type: 'upstream' | 'downstream';
|
||||
serialNumber: string;
|
||||
};
|
||||
|
||||
const LinkStateTable = ({ statistics, refetch, isFetching, type, serialNumber }: Props) => {
|
||||
const tableController = useDataGrid({
|
||||
tableSettingsId: 'switch.link-state.table',
|
||||
defaultOrder: [
|
||||
'carrier',
|
||||
'name',
|
||||
'duplex',
|
||||
'speed',
|
||||
'rx_bytes',
|
||||
'rx_dropped',
|
||||
'rx_error',
|
||||
'rx_packets',
|
||||
'tx_bytes',
|
||||
'tx_dropped',
|
||||
'tx_error',
|
||||
'tx_packets',
|
||||
'actions',
|
||||
],
|
||||
defaultSortBy: [{ id: 'name', desc: false }],
|
||||
showAllRows: true,
|
||||
});
|
||||
|
||||
const columns: DataGridColumn<Row>[] = React.useMemo(
|
||||
(): DataGridColumn<Row>[] => [
|
||||
{
|
||||
id: 'carrier',
|
||||
header: '',
|
||||
accessorKey: '',
|
||||
sortingFn: 'alphanumericCaseSensitive',
|
||||
cell: ({ cell }) => (cell.row.original.carrier ? '🟢' : '🔴'),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'name',
|
||||
header: 'Name',
|
||||
accessorKey: 'name',
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'duplex',
|
||||
header: 'Duplex',
|
||||
accessorKey: 'duplex',
|
||||
cell: ({ cell }) => (cell.row.original.duplex ? uppercaseFirstLetter(cell.row.original.duplex) : '-'),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'speed',
|
||||
header: 'Speed',
|
||||
accessorKey: 'speed',
|
||||
cell: ({ cell }) => `${(cell.row.original.speed ?? 0) / 1000} Gbps`,
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_bytes',
|
||||
header: 'Rx',
|
||||
accessorKey: 'rx_bytes',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_bytes ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_dropped',
|
||||
header: 'Rx Dropped',
|
||||
accessorKey: 'rx_dropped',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_dropped ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_error',
|
||||
header: 'Rx Errors',
|
||||
accessorKey: 'rx_error',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_errors ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_packets',
|
||||
header: 'Rx Packets',
|
||||
accessorKey: 'counters.rx_packets',
|
||||
cell: ({ cell }) => (cell.row.original.counters?.rx_packets ?? 0).toLocaleString(),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_bytes',
|
||||
header: 'Tx',
|
||||
accessorKey: 'tx_bytes',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_bytes ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_dropped',
|
||||
header: 'Tx Dropped',
|
||||
accessorKey: 'tx_dropped',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_dropped ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_error',
|
||||
header: 'Tx Errors',
|
||||
accessorKey: 'tx_error',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_errors ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_packets',
|
||||
header: 'Tx Packets',
|
||||
accessorKey: 'counters.tx_packets',
|
||||
cell: ({ cell }) => (cell.row.original.counters?.tx_packets ?? 0).toLocaleString(),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'actions',
|
||||
header: '',
|
||||
accessorKey: '',
|
||||
cell: ({ cell }) => actionCell(cell.row.original, serialNumber),
|
||||
},
|
||||
],
|
||||
[],
|
||||
);
|
||||
|
||||
if (!statistics || statistics?.length === 0) {
|
||||
return (
|
||||
<Center>
|
||||
<Alert status="info">
|
||||
<AlertIcon />
|
||||
<AlertDescription>
|
||||
There are currently no {type} link-states provided in this devices statistics
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
</Center>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DataGrid<Row>
|
||||
controller={tableController}
|
||||
header={{
|
||||
title: '',
|
||||
objectListed: 'Statistics',
|
||||
}}
|
||||
columns={columns}
|
||||
isLoading={isFetching}
|
||||
data={statistics ?? []}
|
||||
options={{
|
||||
refetch,
|
||||
isHidingControls: true,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default LinkStateTable;
|
||||
@@ -1,172 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import { Alert, AlertDescription, AlertIcon, Center } from '@chakra-ui/react';
|
||||
import { DeviceInterfaceStatistics, DeviceStatistics } from 'hooks/Network/Statistics';
|
||||
import DataCell from 'components/TableCells/DataCell';
|
||||
import { DataGridColumn, useDataGrid } from 'components/DataTables/DataGrid/useDataGrid';
|
||||
import DurationCell from 'components/TableCells/DurationCell';
|
||||
import { DataGrid } from 'components/DataTables/DataGrid';
|
||||
|
||||
const dataCell = (v: number) => <DataCell bytes={v} />;
|
||||
|
||||
type Props = {
|
||||
statistics: DeviceStatistics;
|
||||
refetch: () => void;
|
||||
isFetching: boolean;
|
||||
};
|
||||
|
||||
const SwitchInterfaceTable = ({ statistics, refetch, isFetching }: Props) => {
|
||||
const tableController = useDataGrid({
|
||||
tableSettingsId: 'switch.interfaces.table',
|
||||
defaultOrder: [
|
||||
'name',
|
||||
'uptime',
|
||||
'clients',
|
||||
'rx_bytes',
|
||||
'rx_dropped',
|
||||
'rx_error',
|
||||
'rx_packets',
|
||||
'tx_bytes',
|
||||
'tx_dropped',
|
||||
'tx_error',
|
||||
],
|
||||
defaultSortBy: [{ id: 'name', desc: false }],
|
||||
showAllRows: true,
|
||||
});
|
||||
|
||||
const columns: DataGridColumn<DeviceInterfaceStatistics>[] = React.useMemo(
|
||||
(): DataGridColumn<DeviceInterfaceStatistics>[] => [
|
||||
{
|
||||
id: 'name',
|
||||
header: 'Name',
|
||||
accessorKey: 'name',
|
||||
sortingFn: 'alphanumericCaseSensitive',
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'uptime',
|
||||
header: 'Uptime',
|
||||
|
||||
accessorKey: 'uptime',
|
||||
cell: ({ cell }) => <DurationCell seconds={cell.row.original.uptime} />,
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'clients',
|
||||
header: 'Clients',
|
||||
|
||||
accessorKey: 'clients',
|
||||
cell: ({ cell }) => cell.row.original.clients?.length ?? 0,
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_bytes',
|
||||
header: 'Rx',
|
||||
accessorKey: 'rx_bytes',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_bytes ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_dropped',
|
||||
header: 'Rx Dropped',
|
||||
accessorKey: 'rx_dropped',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_dropped ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_error',
|
||||
header: 'Rx Errors',
|
||||
accessorKey: 'rx_error',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.rx_errors ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'rx_packets',
|
||||
header: 'Rx Packets',
|
||||
accessorKey: 'counters.rx_packets',
|
||||
cell: ({ cell }) => (cell.row.original.counters?.rx_packets ?? 0).toLocaleString(),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_bytes',
|
||||
header: 'Tx',
|
||||
accessorKey: 'tx_bytes',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_bytes ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_dropped',
|
||||
header: 'Tx Dropped',
|
||||
accessorKey: 'tx_dropped',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_dropped ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_error',
|
||||
header: 'Tx Errors',
|
||||
accessorKey: 'tx_error',
|
||||
cell: ({ cell }) => dataCell(cell.row.original.counters?.tx_errors ?? 0),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'tx_packets',
|
||||
header: 'Tx Packets',
|
||||
accessorKey: 'counters.tx_packets',
|
||||
cell: ({ cell }) => (cell.row.original.counters?.tx_packets ?? 0).toLocaleString(),
|
||||
meta: {
|
||||
customWidth: '35px',
|
||||
},
|
||||
},
|
||||
],
|
||||
[],
|
||||
);
|
||||
|
||||
if (!statistics.interfaces) {
|
||||
return (
|
||||
<Center>
|
||||
<Alert status="info">
|
||||
<AlertIcon />
|
||||
<AlertDescription>There are currently no interfaces provided in this devices statistics</AlertDescription>
|
||||
</Alert>
|
||||
</Center>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<DataGrid<DeviceInterfaceStatistics>
|
||||
controller={tableController}
|
||||
header={{
|
||||
title: '',
|
||||
objectListed: 'Statistics',
|
||||
}}
|
||||
columns={columns}
|
||||
isLoading={isFetching}
|
||||
data={statistics.interfaces ?? []}
|
||||
options={{
|
||||
refetch,
|
||||
isHidingControls: true,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
|
||||
export default SwitchInterfaceTable;
|
||||
@@ -1,98 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import { Spinner, Tab, TabList, TabPanel, TabPanels, Tabs } from '@chakra-ui/react';
|
||||
import LinkStateTable from './LinkStateTable';
|
||||
import SwitchInterfaceTable from './SwitchInterfaceTable';
|
||||
import { DeviceLinkState, useGetDeviceLastStats } from 'hooks/Network/Statistics';
|
||||
import { Card } from 'components/Containers/Card';
|
||||
import { CardBody } from 'components/Containers/Card/CardBody';
|
||||
|
||||
type Props = {
|
||||
serialNumber: string;
|
||||
};
|
||||
|
||||
const SwitchPortExamination = ({ serialNumber }: Props) => {
|
||||
const [tabIndex, setTabIndex] = React.useState(0);
|
||||
|
||||
const handleTabsChange = React.useCallback((index: number) => {
|
||||
setTabIndex(index);
|
||||
}, []);
|
||||
const getStats = useGetDeviceLastStats({ serialNumber });
|
||||
|
||||
const upLinkStates: (DeviceLinkState & { name: string })[] = React.useMemo(() => {
|
||||
if (!getStats.data || !getStats.data['link-state']?.upstream) return [];
|
||||
|
||||
return Object.entries(getStats.data['link-state']?.upstream).map(([name, value]) => ({
|
||||
...value,
|
||||
name,
|
||||
}));
|
||||
}, [getStats.data]);
|
||||
const downLinkStates: (DeviceLinkState & { name: string })[] = React.useMemo(() => {
|
||||
if (!getStats.data || !getStats.data['link-state']?.downstream) return [];
|
||||
|
||||
return Object.entries(getStats.data['link-state']?.downstream).map(([name, value]) => ({
|
||||
...value,
|
||||
name,
|
||||
}));
|
||||
}, [getStats.data]);
|
||||
|
||||
return (
|
||||
<Card p={0} mb={4}>
|
||||
<CardBody p={0} display="block">
|
||||
<Tabs index={tabIndex} onChange={handleTabsChange} variant="enclosed" w="100%">
|
||||
<TabList>
|
||||
<Tab fontSize="lg" fontWeight="bold">
|
||||
Interfaces
|
||||
</Tab>
|
||||
<Tab fontSize="lg" fontWeight="bold">
|
||||
Link-State (Up)
|
||||
</Tab>
|
||||
<Tab fontSize="lg" fontWeight="bold">
|
||||
Link-State (Down)
|
||||
</Tab>
|
||||
</TabList>
|
||||
<TabPanels>
|
||||
<TabPanel>
|
||||
{getStats.data ? (
|
||||
<SwitchInterfaceTable
|
||||
statistics={getStats.data}
|
||||
refetch={getStats.refetch}
|
||||
isFetching={getStats.isFetching}
|
||||
/>
|
||||
) : (
|
||||
<Spinner size="xl" />
|
||||
)}
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
{getStats.data ? (
|
||||
<LinkStateTable
|
||||
statistics={upLinkStates}
|
||||
refetch={getStats.refetch}
|
||||
isFetching={getStats.isFetching}
|
||||
type="upstream"
|
||||
serialNumber={serialNumber}
|
||||
/>
|
||||
) : (
|
||||
<Spinner size="xl" />
|
||||
)}
|
||||
</TabPanel>
|
||||
<TabPanel>
|
||||
{getStats.data ? (
|
||||
<LinkStateTable
|
||||
statistics={downLinkStates}
|
||||
refetch={getStats.refetch}
|
||||
isFetching={getStats.isFetching}
|
||||
type="downstream"
|
||||
serialNumber={serialNumber}
|
||||
/>
|
||||
) : (
|
||||
<Spinner size="xl" />
|
||||
)}
|
||||
</TabPanel>
|
||||
</TabPanels>
|
||||
</Tabs>
|
||||
</CardBody>
|
||||
</Card>
|
||||
);
|
||||
};
|
||||
|
||||
export default SwitchPortExamination;
|
||||
@@ -28,7 +28,6 @@ export type ParsedAssociation = {
|
||||
txNss: number | string;
|
||||
recorded: number;
|
||||
dynamicVlan?: number;
|
||||
fingerprint?: object;
|
||||
};
|
||||
|
||||
type Props = {
|
||||
@@ -78,14 +77,6 @@ const WifiAnalysisAssociationsTable = ({ data, ouis, isSingle }: Props) => {
|
||||
isMonospace: true,
|
||||
alwaysShow: true,
|
||||
},
|
||||
{
|
||||
id: 'ssid',
|
||||
Header: 'SSID',
|
||||
Footer: '',
|
||||
accessor: 'ssid',
|
||||
customWidth: '35px',
|
||||
alwaysShow: true,
|
||||
},
|
||||
{
|
||||
id: 'ips',
|
||||
Header: 'IPs',
|
||||
@@ -93,13 +84,6 @@ const WifiAnalysisAssociationsTable = ({ data, ouis, isSingle }: Props) => {
|
||||
Cell: (v) => ipCell(v.cell.row.original),
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'fingerprint',
|
||||
Header: 'Fingerprint',
|
||||
Footer: '',
|
||||
Cell: (v) => Object.values(v.cell.row.original.fingerprint ?? {}).join(', '),
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'vendor',
|
||||
Header: t('controller.wifi.vendor'),
|
||||
@@ -182,7 +166,7 @@ const WifiAnalysisAssociationsTable = ({ data, ouis, isSingle }: Props) => {
|
||||
customWidth: '35px',
|
||||
},
|
||||
],
|
||||
[t, ouis],
|
||||
[t],
|
||||
);
|
||||
|
||||
return (
|
||||
|
||||
@@ -17,18 +17,14 @@ export type ParsedRadio = {
|
||||
activeMs: string;
|
||||
busyMs: string;
|
||||
receiveMs: string;
|
||||
sendMs: string;
|
||||
phy: string;
|
||||
frequency: string;
|
||||
temperature: string;
|
||||
};
|
||||
|
||||
type Props = {
|
||||
data?: ParsedRadio[];
|
||||
isSingle?: boolean;
|
||||
};
|
||||
|
||||
const WifiAnalysisRadioTable = ({ data, isSingle }: Props) => {
|
||||
const WifiAnalysisRadioTable = ({ data }: Props) => {
|
||||
const { t } = useTranslation();
|
||||
const [hiddenColumns, setHiddenColumns] = React.useState<string[]>([]);
|
||||
|
||||
@@ -48,27 +44,19 @@ const WifiAnalysisRadioTable = ({ data, isSingle }: Props) => {
|
||||
},
|
||||
{
|
||||
id: 'channel',
|
||||
Header: 'Ch.',
|
||||
Header: 'Ch',
|
||||
Footer: '',
|
||||
accessor: 'channel',
|
||||
customWidth: '35px',
|
||||
},
|
||||
{
|
||||
id: 'channelWidth',
|
||||
Header: 'Ch. W',
|
||||
Header: t('controller.wifi.channel_width'),
|
||||
Footer: '',
|
||||
accessor: 'channelWidth',
|
||||
customWidth: '35px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'tx-power',
|
||||
Header: 'Tx Pow.',
|
||||
Footer: '',
|
||||
accessor: 'txPower',
|
||||
customWidth: '35px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'noise',
|
||||
Header: t('controller.wifi.noise'),
|
||||
@@ -79,49 +67,25 @@ const WifiAnalysisRadioTable = ({ data, isSingle }: Props) => {
|
||||
},
|
||||
{
|
||||
id: 'activeMs',
|
||||
Header: 'Active (ms)',
|
||||
Header: t('controller.wifi.active_ms'),
|
||||
Footer: '',
|
||||
accessor: 'activeMs',
|
||||
customWidth: '105px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'busyMs',
|
||||
Header: 'Busy (ms)',
|
||||
Footer: '',
|
||||
accessor: 'busyMs',
|
||||
customWidth: '105px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'receiveMs',
|
||||
Header: 'Receive (ms)',
|
||||
Footer: '',
|
||||
accessor: 'receiveMs',
|
||||
customWidth: '105px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'sendMs',
|
||||
Header: 'Send (ms)',
|
||||
Footer: '',
|
||||
accessor: 'sendMs',
|
||||
customWidth: '105px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'temperature',
|
||||
Header: 'Temp.',
|
||||
Footer: '',
|
||||
accessor: 'temperature',
|
||||
customWidth: '35px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'frequency',
|
||||
Header: 'Frequency',
|
||||
id: 'busyMs',
|
||||
Header: t('controller.wifi.busy_ms'),
|
||||
Footer: '',
|
||||
accessor: 'frequency',
|
||||
accessor: 'busyMs',
|
||||
customWidth: '35px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
{
|
||||
id: 'receiveMs',
|
||||
Header: t('controller.wifi.receive_ms'),
|
||||
Footer: '',
|
||||
accessor: 'receiveMs',
|
||||
customWidth: '35px',
|
||||
disableSortBy: true,
|
||||
},
|
||||
@@ -133,7 +97,7 @@ const WifiAnalysisRadioTable = ({ data, isSingle }: Props) => {
|
||||
<>
|
||||
<Flex>
|
||||
<Heading size="sm" mt={2} my="auto">
|
||||
{isSingle ? 'Radio' : `${t('configurations.radios')} (${data?.length})`}
|
||||
{t('configurations.radios')} ({data?.length})
|
||||
</Heading>
|
||||
<Spacer />
|
||||
<ColumnPicker
|
||||
|
||||
@@ -16,29 +16,11 @@ type Props = {
|
||||
serialNumber: string;
|
||||
};
|
||||
|
||||
const parseRadios = (_: (str: string) => string, data: { data: DeviceStatistics; recorded: number }) => {
|
||||
const parseRadios = (t: (str: string) => string, data: { data: DeviceStatistics; recorded: number }) => {
|
||||
const radios: ParsedRadio[] = [];
|
||||
if (data.data.radios) {
|
||||
for (let i = 0; i < data.data.radios.length; i += 1) {
|
||||
const radio = data.data.radios[i];
|
||||
let temperature = radio?.temperature;
|
||||
if (temperature) temperature = temperature > 1000 ? Math.round(temperature / 1000) : temperature;
|
||||
|
||||
const tempNoise = radio?.noise ?? radio?.survey?.[0]?.noise;
|
||||
const noise = tempNoise ? parseDbm(tempNoise) : '-';
|
||||
|
||||
const tempActiveMs = radio?.survey?.[0]?.time ?? radio?.active_ms;
|
||||
const activeMs = tempActiveMs?.toLocaleString() ?? '-';
|
||||
|
||||
const tempBusyMs = radio?.survey?.[0]?.busy ?? radio?.busy_ms;
|
||||
const busyMs = tempBusyMs?.toLocaleString() ?? '-';
|
||||
|
||||
const tempReceiveMs = radio?.survey?.[0]?.time_rx ?? radio?.receive_ms;
|
||||
const receiveMs = tempReceiveMs?.toLocaleString() ?? '-';
|
||||
|
||||
const tempSendMs = radio?.survey?.[0]?.time_tx;
|
||||
const sendMs = tempSendMs?.toLocaleString() ?? '-';
|
||||
|
||||
if (radio) {
|
||||
radios.push({
|
||||
recorded: data.recorded,
|
||||
@@ -47,15 +29,12 @@ const parseRadios = (_: (str: string) => string, data: { data: DeviceStatistics;
|
||||
deductedBand: radio.channel && radio.channel > 16 ? '5G' : '2G',
|
||||
channel: radio.channel,
|
||||
channelWidth: radio.channel_width,
|
||||
noise,
|
||||
noise: radio.noise ? parseDbm(radio.noise) : '-',
|
||||
txPower: radio.tx_power ?? '-',
|
||||
activeMs,
|
||||
busyMs,
|
||||
receiveMs,
|
||||
sendMs,
|
||||
activeMs: compactSecondsToDetailed(radio?.active_ms ? Math.floor(radio.active_ms / 1000) : 0, t),
|
||||
busyMs: compactSecondsToDetailed(radio?.busy_ms ? Math.floor(radio.busy_ms / 1000) : 0, t),
|
||||
receiveMs: compactSecondsToDetailed(radio?.receive_ms ? Math.floor(radio.receive_ms / 1000) : 0, t),
|
||||
phy: radio.phy,
|
||||
temperature: temperature ? temperature.toString() : '-',
|
||||
frequency: radio.frequency?.join(', ') ?? '-',
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -105,7 +84,6 @@ const parseAssociations = (data: { data: DeviceStatistics; recorded: number }, r
|
||||
txNss: association.tx_rate.nss ?? '-',
|
||||
recorded: data.recorded,
|
||||
dynamicVlan: association.dynamic_vlan,
|
||||
fingerprint: association.fingerprint,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@@ -42,13 +42,10 @@ import FactoryResetModal from 'components/Modals/FactoryResetModal';
|
||||
import { FirmwareUpgradeModal } from 'components/Modals/FirmwareUpgradeModal';
|
||||
import { RebootModal } from 'components/Modals/RebootModal';
|
||||
import { useScriptModal } from 'components/Modals/ScriptModal/useScriptModal';
|
||||
import ethernetConnected from './ethernetIconConnected.svg?react';
|
||||
import ethernetDisconnected from './ethernetIconDisconnected.svg?react';
|
||||
import { TelemetryModal } from 'components/Modals/TelemetryModal';
|
||||
import { TraceModal } from 'components/Modals/TraceModal';
|
||||
import { WifiScanModal } from 'components/Modals/WifiScanModal';
|
||||
import { useDeleteDevice, useGetDevice, useGetDeviceHealthChecks, useGetDeviceStatus } from 'hooks/Network/Devices';
|
||||
import SwitchPortExamination from './SwitchPortExamination';
|
||||
|
||||
type Props = {
|
||||
serialNumber: string;
|
||||
@@ -80,8 +77,19 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
|
||||
const isCompact = breakpoint === 'base' || breakpoint === 'sm' || breakpoint === 'md';
|
||||
const boxShadow = useColorModeValue('0px 7px 23px rgba(0, 0, 0, 0.05)', 'none');
|
||||
|
||||
const handleDeleteClick = () => {
|
||||
const handleDeleteClick = () =>
|
||||
deleteDevice(serialNumber, {
|
||||
onSuccess: () => {
|
||||
toast({
|
||||
id: `delete-device-success-${serialNumber}`,
|
||||
title: t('common.success'),
|
||||
status: 'success',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
navigate('/devices');
|
||||
},
|
||||
onError: (e) => {
|
||||
if (axios.isAxiosError(e)) {
|
||||
toast({
|
||||
@@ -96,43 +104,18 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
|
||||
}
|
||||
},
|
||||
});
|
||||
toast({
|
||||
id: `delete-device-success-${serialNumber}`,
|
||||
title: t('common.success'),
|
||||
status: 'success',
|
||||
duration: 5000,
|
||||
isClosable: true,
|
||||
position: 'top-right',
|
||||
});
|
||||
navigate('/');
|
||||
};
|
||||
|
||||
const connectedTag = React.useMemo(() => {
|
||||
if (!getStatus.data) return null;
|
||||
|
||||
if (getDevice.data?.blackListed) {
|
||||
return (
|
||||
<ResponsiveTag
|
||||
label="Blacklisted"
|
||||
tooltip="This device is blacklisted, it will not be able to connect to the network. Please visit the Blacklist page if you wish to remove it from the blacklist."
|
||||
colorScheme="red"
|
||||
icon={LockSimple}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
let icon = getStatus.data.connected ? WifiHigh : WifiSlash;
|
||||
if (getDevice.data?.deviceType === 'switch')
|
||||
icon = getStatus.data.connected ? ethernetConnected : ethernetDisconnected;
|
||||
|
||||
return (
|
||||
<ResponsiveTag
|
||||
label={getStatus?.data?.connected ? t('common.connected') : t('common.disconnected')}
|
||||
colorScheme={getStatus?.data?.connected ? 'green' : 'red'}
|
||||
icon={icon}
|
||||
icon={getStatus.data.connected ? WifiHigh : WifiSlash}
|
||||
/>
|
||||
);
|
||||
}, [getStatus.data, getDevice.data]);
|
||||
}, [getStatus.data]);
|
||||
|
||||
const healthTag = React.useMemo(() => {
|
||||
if (!getStatus.data || !getStatus.data.connected || !getHealth.data || getHealth.data?.values?.length === 0)
|
||||
@@ -324,8 +307,7 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
|
||||
<DeviceSummary serialNumber={serialNumber} />
|
||||
<DeviceDetails serialNumber={serialNumber} />
|
||||
<DeviceStatisticsCard serialNumber={serialNumber} />
|
||||
{getDevice.data?.deviceType === 'ap' ? <WifiAnalysisCard serialNumber={serialNumber} /> : null}
|
||||
{getDevice.data?.deviceType === 'switch' ? <SwitchPortExamination serialNumber={serialNumber} /> : null}
|
||||
<WifiAnalysisCard serialNumber={serialNumber} />
|
||||
<DeviceLogsCard serialNumber={serialNumber} />
|
||||
{getDevice.data && getDevice.data?.hasRADIUSSessions > 0 ? (
|
||||
<RadiusClientsCard serialNumber={serialNumber} />
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg viewBox="0 0 24 24" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg"><defs><style>.cls-1{fill:none;stroke:#48BB78;stroke-miterlimit:10;stroke-width:1.91px;}</style></defs><rect class="cls-1" x="1.5" y="1.5" width="21" height="21" rx="1.91"/><polygon class="cls-1" points="5.32 6.27 5.32 13.91 7.23 13.91 7.23 15.82 10.09 15.82 10.09 17.73 13.91 17.73 13.91 15.82 16.77 15.82 16.77 13.91 18.68 13.91 18.68 6.27 5.32 6.27"/><line class="cls-1" x1="8.18" y1="9.14" x2="8.18" y2="6.27"/><line class="cls-1" x1="12" y1="9.14" x2="12" y2="6.27"/><line class="cls-1" x1="15.82" y1="9.14" x2="15.82" y2="6.27"/></svg>
|
||||
|
Before Width: | Height: | Size: 673 B |
@@ -1,2 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg viewBox="0 0 24 24" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg"><defs><style>.cls-1{fill:none;stroke:#FC8181;stroke-miterlimit:10;stroke-width:1.91px;}</style></defs><rect class="cls-1" x="1.5" y="1.5" width="21" height="21" rx="1.91"/><polygon class="cls-1" points="5.32 6.27 5.32 13.91 7.23 13.91 7.23 15.82 10.09 15.82 10.09 17.73 13.91 17.73 13.91 15.82 16.77 15.82 16.77 13.91 18.68 13.91 18.68 6.27 5.32 6.27"/><line class="cls-1" x1="8.18" y1="9.14" x2="8.18" y2="6.27"/><line class="cls-1" x1="12" y1="9.14" x2="12" y2="6.27"/><line class="cls-1" x1="15.82" y1="9.14" x2="15.82" y2="6.27"/></svg>
|
||||
|
Before Width: | Height: | Size: 673 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 KiB After Width: | Height: | Size: 2.6 KiB |
@@ -1,16 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import {
|
||||
Box,
|
||||
Center,
|
||||
Image,
|
||||
Link,
|
||||
Select,
|
||||
Tag,
|
||||
TagLabel,
|
||||
TagRightIcon,
|
||||
Tooltip,
|
||||
useDisclosure,
|
||||
} from '@chakra-ui/react';
|
||||
import { Box, Center, Image, Link, Tag, TagLabel, TagRightIcon, Tooltip, useDisclosure } from '@chakra-ui/react';
|
||||
import {
|
||||
CheckCircle,
|
||||
Heart,
|
||||
@@ -19,7 +8,6 @@ import {
|
||||
ThermometerCold,
|
||||
ThermometerHot,
|
||||
WarningCircle,
|
||||
XCircle,
|
||||
} from '@phosphor-icons/react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
@@ -49,7 +37,7 @@ import { TraceModal } from 'components/Modals/TraceModal';
|
||||
import { WifiScanModal } from 'components/Modals/WifiScanModal';
|
||||
import DataCell from 'components/TableCells/DataCell';
|
||||
import NumberCell from 'components/TableCells/NumberCell';
|
||||
import { DevicePlatform, DeviceWithStatus, useGetDeviceCount, useGetDevices } from 'hooks/Network/Devices';
|
||||
import { DeviceWithStatus, useGetDeviceCount, useGetDevices } from 'hooks/Network/Devices';
|
||||
import { FirmwareAgeResponse, useGetFirmwareAges } from 'hooks/Network/Firmware';
|
||||
|
||||
const fourDigitNumber = (v?: number) => {
|
||||
@@ -75,7 +63,6 @@ const BADGE_COLORS: Record<string, string> = {
|
||||
NO_CERTIFICATE: 'red',
|
||||
MISMATCH_SERIAL: 'yellow',
|
||||
VERIFIED: 'green',
|
||||
BLACKLISTED: 'white',
|
||||
SIMULATED: 'purple',
|
||||
};
|
||||
|
||||
@@ -83,7 +70,6 @@ const DeviceListCard = () => {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const [serialNumber, setSerialNumber] = React.useState<string>('');
|
||||
const [platform, setPlatform] = React.useState<DevicePlatform>('ALL');
|
||||
const scanModalProps = useDisclosure();
|
||||
const resetModalProps = useDisclosure();
|
||||
const upgradeModalProps = useDisclosure();
|
||||
@@ -122,14 +108,13 @@ const DeviceListCard = () => {
|
||||
'actions',
|
||||
],
|
||||
});
|
||||
const getCount = useGetDeviceCount({ enabled: true, platform });
|
||||
const getCount = useGetDeviceCount({ enabled: true });
|
||||
const getDevices = useGetDevices({
|
||||
pageInfo: {
|
||||
limit: tableController.pageInfo.pageSize,
|
||||
index: tableController.pageInfo.pageIndex,
|
||||
},
|
||||
enabled: true,
|
||||
platform,
|
||||
});
|
||||
const getAges = useGetFirmwareAges({
|
||||
serialNumbers: getDevices.data?.devicesWithStatus.map((device) => device.serialNumber),
|
||||
@@ -174,32 +159,12 @@ const DeviceListCard = () => {
|
||||
h="35px"
|
||||
w="35px"
|
||||
borderRadius="50em"
|
||||
bgColor={
|
||||
BADGE_COLORS[
|
||||
device.simulated ? 'SIMULATED' : device.blackListed ? 'BLACKLISTED' : device.verifiedCertificate
|
||||
] ?? 'red'
|
||||
}
|
||||
bgColor={BADGE_COLORS[device.simulated ? 'SIMULATED' : device.verifiedCertificate] ?? 'red'}
|
||||
alignItems="center"
|
||||
display="inline-flex"
|
||||
justifyContent="center"
|
||||
position="relative"
|
||||
>
|
||||
{device.blackListed ? (
|
||||
<Tooltip label="This device is blacklisted. If this was done by mistake, please visit the Blacklist page to correct.">
|
||||
<XCircle
|
||||
size={44}
|
||||
color="#ff2600"
|
||||
weight="duotone"
|
||||
style={{
|
||||
position: 'absolute',
|
||||
// Center vertically and horizontally
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
}}
|
||||
/>
|
||||
</Tooltip>
|
||||
) : null}
|
||||
<Tooltip
|
||||
label={`${device.simulated ? 'SIMULATED' : device.verifiedCertificate} - ${
|
||||
device.connected ? t('common.connected') : t('common.disconnected')
|
||||
@@ -217,7 +182,6 @@ const DeviceListCard = () => {
|
||||
bottom={0}
|
||||
borderColor="gray.200"
|
||||
borderWidth={1}
|
||||
hidden={device.blackListed}
|
||||
/>
|
||||
{device.restrictedDevice && (
|
||||
<Box
|
||||
@@ -569,7 +533,12 @@ const DeviceListCard = () => {
|
||||
header: t('analytics.last_connected'),
|
||||
footer: '',
|
||||
accessorKey: 'lastRecordedContact',
|
||||
cell: (v) => dateCell(v.cell.row.original.lastRecordedContact),
|
||||
cell: (v) =>
|
||||
dateCell(
|
||||
v.cell.row.original.lastContact !== 0
|
||||
? v.cell.row.original.lastContact
|
||||
: v.cell.row.original.lastRecordedContact,
|
||||
),
|
||||
enableSorting: false,
|
||||
meta: {
|
||||
headerOptions: {
|
||||
@@ -727,21 +696,7 @@ const DeviceListCard = () => {
|
||||
header={{
|
||||
title: `${getCount.data?.count ?? 0} ${t('devices.title')}`,
|
||||
objectListed: t('devices.title'),
|
||||
leftContent: (
|
||||
<>
|
||||
<GlobalSearchBar />
|
||||
<Select
|
||||
value={platform}
|
||||
onChange={(e) => setPlatform(e.target.value as DevicePlatform)}
|
||||
w="max-content"
|
||||
ml={2}
|
||||
>
|
||||
<option value="ALL">All</option>
|
||||
<option value="ap">APs</option>
|
||||
<option value="switch">Switches</option>
|
||||
</Select>
|
||||
</>
|
||||
),
|
||||
leftContent: <GlobalSearchBar />,
|
||||
otherButtons: (
|
||||
<ExportDevicesTableButton currentPageSerialNumbers={data.map((device) => device.serialNumber)} />
|
||||
),
|
||||
|
||||
@@ -2,7 +2,6 @@ import { defineConfig } from 'vite';
|
||||
import tsconfigPaths from 'vite-tsconfig-paths';
|
||||
import react from '@vitejs/plugin-react';
|
||||
import { VitePWA } from 'vite-plugin-pwa';
|
||||
import svgr from 'vite-plugin-svgr';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
@@ -45,7 +44,6 @@ export default defineConfig({
|
||||
],
|
||||
},
|
||||
}),
|
||||
svgr(),
|
||||
],
|
||||
build: {
|
||||
outDir: './build',
|
||||
|
||||
Reference in New Issue
Block a user