Merge pull request #233 from Telecominfraproject/WIFI-14521-set-correct-tag-for-main

Set correct tag for helm version
2025-10-29 18:02:31 +00:00 · 2025-08-05 13:06:11 -04:00 · 2025-08-05 11:51:43 -04:00 · 2025-07-14 15:50:59 -04:00 · 2025-07-14 15:48:41 -04:00 · 2025-07-14 15:38:30 -04:00
79 changed files with 3257 additions and 1543 deletions
--- a/.env
+++ b/.env
@@ -1 +0,0 @@
-VITE_UCENTRALSEC_URL="https://ucentral.dpaas.arilia.com:16001"
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -20,7 +20,7 @@ defaults:

 jobs:
  docker:
-    runs-on: ubuntu-20.04
+    runs-on: ubuntu-latest
    env:
      DOCKER_REGISTRY_URL: tip-tip-wlan-cloud-ucentral.jfrog.io
      DOCKER_REGISTRY_USERNAME: ucentral
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -11,7 +11,7 @@ defaults:

 jobs:
  helm-package:
-    runs-on: ubuntu-20.04
+    runs-on: ubuntu-latest
    env:
      HELM_REPO_URL: https://tip.jfrog.io/artifactory/tip-wlan-cloud-ucentral-helm/
      HELM_REPO_USERNAME: ucentral
--- a/helm/templates/ingress.yaml
+++ b/helm/templates/ingress.yaml
@@ -17,7 +17,9 @@ metadata:
  {{- end }}

 spec:
-
+{{- if $ingressValue.className }}
+  ingressClassName: {{ $ingressValue.className }}
+{{- end }}
 {{- if $ingressValue.tls }}
  tls:
  {{- range $ingressValue.tls }}
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
  "name": "ucentral-client",
-  "version": "3.0.0(1)",
+  "version": "4.1.0",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "ucentral-client",
-      "version": "3.0.0(1)",
+      "version": "4.1.0",
      "license": "ISC",
      "dependencies": {
        "@chakra-ui/anatomy": "^2.1.1",
@@ -88,6 +88,7 @@
        "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"
      }
    },
@@ -3955,9 +3956,9 @@
      }
    },
    "node_modules/@rollup/pluginutils": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.0.2.tgz",
-      "integrity": "sha512-pTd9rIsP92h+B6wWwFbW8RkZv4hiR/xKsqre4SIuAOaOEQRxi0lqLke9k2/7WegC85GgUs9pjmOjCUi3In4vwA==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.1.0.tgz",
+      "integrity": "sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==",
      "dev": true,
      "dependencies": {
        "@types/estree": "^1.0.0",
@@ -3968,7 +3969,7 @@
        "node": ">=14.0.0"
      },
      "peerDependencies": {
-        "rollup": "^1.20.0||^2.0.0||^3.0.0"
+        "rollup": "^1.20.0||^2.0.0||^3.0.0||^4.0.0"
      },
      "peerDependenciesMeta": {
        "rollup": {
@@ -3997,6 +3998,245 @@
        "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",
@@ -4969,6 +5209,18 @@
        "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",
@@ -5399,6 +5651,16 @@
        "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"
@@ -5409,8 +5671,9 @@
      "license": "MIT"
    },
    "node_modules/ejs": {
-      "version": "3.1.8",
-      "license": "Apache-2.0",
+      "version": "3.1.10",
+      "resolved": "https://registry.npmjs.org/ejs/-/ejs-3.1.10.tgz",
+      "integrity": "sha512-UeJmFfOrAQS8OJWPZ4qtgHyWExa088/MtK5UEyoJGFH67cDEXkZSviOiKRCZ4Xij0zxI3JECgYs3oKx+AizQBA==",
      "dependencies": {
        "jake": "^10.8.5"
      },
@@ -5431,6 +5694,18 @@
      "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",
@@ -6408,14 +6683,15 @@
      }
    },
    "node_modules/follow-redirects": {
-      "version": "1.15.2",
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
      "funding": [
        {
          "type": "individual",
          "url": "https://github.com/sponsors/RubenVerborgh"
        }
      ],
-      "license": "MIT",
      "engines": {
        "node": ">=4.0"
      },
@@ -7945,6 +8221,15 @@
        "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,
@@ -8084,6 +8369,16 @@
      "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",
@@ -9368,6 +9663,16 @@
        "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",
@@ -9695,6 +10000,12 @@
        "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",
@@ -10132,9 +10443,9 @@
      }
    },
    "node_modules/vite": {
-      "version": "4.4.9",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.9.tgz",
-      "integrity": "sha512-2mbUn2LlUmNASWwSCNSJ/EG2HuSRTnVNaydp6vMCm5VIqJsjMfbIWtbH2kDuwUVW5mMUKKZvGPX/rqeqVvv1XA==",
+      "version": "4.5.3",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
+      "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
      "dependencies": {
        "esbuild": "^0.18.10",
        "postcss": "^8.4.27",
@@ -10208,6 +10519,20 @@
        "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",
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "ucentral-client",
-  "version": "3.0.0(1)",
+  "version": "4.1.0",
  "description": "",
  "private": true,
  "main": "index.tsx",
@@ -94,6 +94,7 @@
    "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": {
--- a/public/devices/asterfusion_CX204Y-24GT-M-SWP4.png
+++ b/public/devices/asterfusion_CX204Y-24GT-M-SWP4.png
--- a/public/devices/asterfusion_CX204Y-48GT-M-SWP4.png
+++ b/public/devices/asterfusion_CX204Y-48GT-M-SWP4.png
--- a/public/devices/cig_wf186h.png
+++ b/public/devices/cig_wf186h.png
--- a/public/devices/cig_wf186w.png
+++ b/public/devices/cig_wf186w.png
--- a/public/devices/cig_wf188n-ca-ath12.png
+++ b/public/devices/cig_wf188n-ca-ath12.png
--- a/public/devices/cig_wf188n-ca.png
+++ b/public/devices/cig_wf188n-ca.png
--- a/public/devices/cig_wf188n-us.png
+++ b/public/devices/cig_wf188n-us.png
--- a/public/devices/cig_wf196-ca-ath12.png
+++ b/public/devices/cig_wf196-ca-ath12.png
--- a/public/devices/cig_wf196-ca.png
+++ b/public/devices/cig_wf196-ca.png
--- a/public/devices/cig_wf196-us.png
+++ b/public/devices/cig_wf196-us.png
--- a/public/devices/cig_wf610d.png
+++ b/public/devices/cig_wf610d.png
--- a/public/devices/cig_wf660a.png
+++ b/public/devices/cig_wf660a.png
--- a/public/devices/cybertan_eww631-a1.png
+++ b/public/devices/cybertan_eww631-a1.png
--- a/public/devices/cybertan_eww631-b1.png
+++ b/public/devices/cybertan_eww631-b1.png
--- a/public/devices/cybertan_skf224-c1.png
+++ b/public/devices/cybertan_skf224-c1.png
--- a/public/devices/cybertan_skf424-c1.png
+++ b/public/devices/cybertan_skf424-c1.png
--- a/public/devices/edgecore_eap101-ath12.png
+++ b/public/devices/edgecore_eap101-ath12.png
--- a/public/devices/edgecore_eap102-ath12.png
+++ b/public/devices/edgecore_eap102-ath12.png
--- a/public/devices/edgecore_eap104.png
+++ b/public/devices/edgecore_eap104.png
--- a/public/devices/edgecore_eap104_ath12.png
+++ b/public/devices/edgecore_eap104_ath12.png
--- a/public/devices/edgecore_eap111.png
+++ b/public/devices/edgecore_eap111.png
--- a/public/devices/edgecore_ecs2100-10p.png
+++ b/public/devices/edgecore_ecs2100-10p.png
--- a/public/devices/edgecore_ecs2100-10t.png
+++ b/public/devices/edgecore_ecs2100-10t.png
--- a/public/devices/edgecore_ecs2100-28p.png
+++ b/public/devices/edgecore_ecs2100-28p.png
--- a/public/devices/edgecore_ecs2100-28pp.png
+++ b/public/devices/edgecore_ecs2100-28pp.png
--- a/public/devices/edgecore_ecs2100-28t.png
+++ b/public/devices/edgecore_ecs2100-28t.png
--- a/public/devices/edgecore_ecs2100-52t.png
+++ b/public/devices/edgecore_ecs2100-52t.png
--- a/public/devices/edgecore_ecs4125-10p.png
+++ b/public/devices/edgecore_ecs4125-10p.png
--- a/public/devices/edgecore_ecs4125.png
+++ b/public/devices/edgecore_ecs4125.png
--- a/public/devices/edgecore_ecs4150-28t.png
+++ b/public/devices/edgecore_ecs4150-28t.png
--- a/public/devices/edgecore_ecs4150-58p.png
+++ b/public/devices/edgecore_ecs4150-58p.png
--- a/public/devices/edgecore_oap101-6e.png
+++ b/public/devices/edgecore_oap101-6e.png
--- a/public/devices/edgecore_oap101.png
+++ b/public/devices/edgecore_oap101.png
--- a/public/devices/edgecore_oap101e-6e.png
+++ b/public/devices/edgecore_oap101e-6e.png
--- a/public/devices/edgecore_oap101e.png
+++ b/public/devices/edgecore_oap101e.png
--- a/public/devices/edgecore_oap102.png
+++ b/public/devices/edgecore_oap102.png
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
--- a/src/components/Buttons/DeviceActionDropdown/index.tsx
+++ b/src/components/Buttons/DeviceActionDropdown/index.tsx
@@ -32,6 +32,7 @@ interface Props {
  onOpenTelemetryModal: (serialNumber: string) => void;
  onOpenScriptModal: (device: GatewayDevice) => void;
  onOpenRebootModal: (serialNumber: string) => void;
+  onOpenReEnrollModal?: (serialNumber: string) => void;
  size?: 'sm' | 'md' | 'lg';
  isCompact?: boolean;
 }
@@ -49,11 +50,13 @@ const DeviceActionDropdown = ({
  onOpenConfigureModal,
  onOpenScriptModal,
  onOpenRebootModal,
+  onOpenReEnrollModal,
  size,
  isCompact,
 }: 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({
@@ -205,7 +208,7 @@ const DeviceActionDropdown = ({
          isDisabled={isDisabled}
          onClick={handleOpenScan}
          colorScheme="teal"
-          hidden={isCompact}
+          hidden={isCompact || deviceType !== 'ap'}
        />
      </Tooltip>
      <Menu>
@@ -221,7 +224,7 @@ const DeviceActionDropdown = ({
        <Portal>
          <MenuList maxH="315px" overflowY="auto">
            <MenuItem onClick={handleBlinkClick}>{t('commands.blink')}</MenuItem>
-            <MenuItem onClick={handleOpenConfigure} hidden={!isCompact}>
+            <MenuItem onClick={handleOpenConfigure} hidden={!isCompact || deviceType !== 'ap'}>
              {t('controller.configure.title')}
            </MenuItem>
            <MenuItem onClick={handleConnectClick} hidden={!isCompact}>
@@ -233,13 +236,18 @@ const DeviceActionDropdown = ({
            <MenuItem onClick={handleRebootClick} hidden={!isCompact}>
              {t('commands.reboot')}
            </MenuItem>
+            {onOpenReEnrollModal && (
+              <MenuItem onClick={() => onOpenReEnrollModal(device.serialNumber)}>
+                {t('controller.devices.re_enroll')}
+              </MenuItem>
+            )}
            <MenuItem onClick={handleOpenTelemetry}>{t('controller.telemetry.title')}</MenuItem>
            <MenuItem onClick={handleOpenScript}>{t('script.one')}</MenuItem>
            <MenuItem onClick={handleOpenTrace}>{t('controller.devices.trace')}</MenuItem>
            <MenuItem onClick={handleUpdateToLatest} hidden>
              {t('premium.toolbox.upgrade_to_latest')}
            </MenuItem>
-            <MenuItem onClick={handleOpenScan} hidden={!isCompact}>
+            <MenuItem onClick={handleOpenScan} hidden={!isCompact || deviceType !== 'ap'}>
              {t('commands.wifiscan')}
            </MenuItem>
          </MenuList>
--- a/src/components/Containers/ResponsiveTag/index.tsx
+++ b/src/components/Containers/ResponsiveTag/index.tsx
@@ -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} />
+        <TagLeftIcon boxSize="18px" as={icon} mt={-0.5} />
        <TagLabel>{label}</TagLabel>
      </Tag>
    </Tooltip>
--- a/src/components/DataTables/DataGrid/useDataGrid.ts
+++ b/src/components/DataTables/DataGrid/useDataGrid.ts
@@ -2,7 +2,8 @@ import * as React from 'react';
 import { ColumnDef, PaginationState, SortingColumnDef, SortingState, VisibilityState } from '@tanstack/react-table';
 import { useAuth } from 'contexts/AuthProvider';

-const getDefaultSettings = (settings?: string) => {
+const getDefaultSettings = ({ settings, showAllRows }: { settings?: string; showAllRows?: boolean }) => {
+  if (showAllRows) return { pageSize: 1000, pageIndex: 0 };
  let limit = 10;
  let index = 0;

@@ -54,9 +55,10 @@ export type UseDataGridProps = {
  tableSettingsId: string;
  defaultOrder: string[];
  defaultSortBy?: SortingState;
+  showAllRows?: boolean;
 };

-export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder }: UseDataGridProps) => {
+export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder, showAllRows }: UseDataGridProps) => {
  const orderSetting = `${tableSettingsId}.order`;
  const hiddenColumnSetting = `${tableSettingsId}.hiddenColumns`;
  const pageSetting = `${tableSettingsId}.page`;
@@ -66,8 +68,9 @@ export const useDataGrid = ({ tableSettingsId, defaultSortBy, defaultOrder }: Us
  const [columnOrder, setColumnOrder] = React.useState<string[]>(
    getSavedColumnOrder(defaultOrder ?? [], tableSettingsId),
  );
-  const [pageInfo, setPageInfo] = React.useState<PaginationState>(getDefaultSettings(tableSettingsId));
-
+  const [pageInfo, setPageInfo] = React.useState<PaginationState>(
+    getDefaultSettings({ settings: tableSettingsId, showAllRows }),
+  );
  const setNewColumnOrder = React.useCallback(
    (newOrder: string[]) => {
      setColumnOrder(newOrder);
--- a/src/components/Form/MultiSelectField/FastMultiSelectInput.jsx
+++ b/src/components/Form/MultiSelectField/FastMultiSelectInput.jsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { FormControl, FormErrorMessage, FormLabel } from '@chakra-ui/react';
-import { Select } from 'chakra-react-select';
+import { CreatableSelect, Select } from 'chakra-react-select';
 import PropTypes from 'prop-types';
 import isEqual from 'react-fast-compare';
 import { useTranslation } from 'react-i18next';
@@ -25,6 +25,7 @@ const propTypes = {
  isHidden: PropTypes.bool,
  isPortal: PropTypes.bool.isRequired,
  definitionKey: PropTypes.string,
+  isCreatable: PropTypes.bool,
 };

 const defaultProps = {
@@ -36,6 +37,7 @@ const defaultProps = {
  isDisabled: false,
  isHidden: false,
  definitionKey: null,
+  isCreatable: false,
 };

 const FastMultiSelectInput = ({
@@ -50,6 +52,7 @@ const FastMultiSelectInput = ({
  isRequired,
  isDisabled,
  isHidden,
+  isCreatable,
  isPortal,
  definitionKey,
 }) => {
@@ -61,35 +64,62 @@ const FastMultiSelectInput = ({
        {label}
        <ConfigurationFieldExplanation definitionKey={definitionKey} />
      </FormLabel>
-      <Select
-        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={canSelectAll ? [{ value: '*', label: t('common.all') }, ...options] : options}
-        value={
-          value?.map((val) => {
-            if (val === '*') return { value: val, label: t('common.all') };
-            return options.find((opt) => opt.value === val);
-          }) ?? []
-        }
-        onChange={onChange}
-        onBlur={onBlur}
-        isDisabled={isDisabled}
-      />
+      {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 }) => ({
+              ...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={canSelectAll ? [{ value: '*', label: t('common.all') }, ...options] : options}
+          value={
+            value?.map((val) => {
+              if (val === '*') return { value: val, label: t('common.all') };
+              return options.find((opt) => opt.value === val);
+            }) ?? []
+          }
+          onChange={onChange}
+          onBlur={onBlur}
+          isDisabled={isDisabled}
+        />
+      )}
      <FormErrorMessage>{error}</FormErrorMessage>
    </FormControl>
  );
--- a/src/components/Form/MultiSelectField/index.jsx
+++ b/src/components/Form/MultiSelectField/index.jsx
@@ -20,6 +20,7 @@ const propTypes = {
  canSelectAll: PropTypes.bool,
  isPortal: PropTypes.bool,
  definitionKey: PropTypes.string,
+  isCreatable: PropTypes.bool,
 };

 const defaultProps = {
@@ -31,6 +32,7 @@ const defaultProps = {
  canSelectAll: false,
  isPortal: false,
  definitionKey: null,
+  isCreatable: false,
 };

 const MultiSelectField = ({
@@ -43,25 +45,39 @@ const MultiSelectField = ({
  emptyIsUndefined,
  canSelectAll,
  hasVirtualAll,
+  isCreatable,
  isPortal,
  definitionKey,
 }) => {
  const [{ value }, { touched, error }, { setValue, setTouched }] = useField(name);

-  const onChange = useCallback((option) => {
-    const allIndex = option.findIndex((opt) => opt.value === '*');
-    if (option.length === 0 && emptyIsUndefined) {
-      setValue(undefined);
-    } else if (allIndex === 0 && option.length > 1) {
-      const newValues = option.slice(1);
-      setValue(newValues.map((val) => val.value));
-    } else if (allIndex >= 0) {
-      if (!hasVirtualAll) setValue(['*']);
-      else setValue(options.map(({ value: v }) => v));
-    } else if (option.length > 0) setValue(option.map((val) => val.value));
-    else setValue([]);
-    setTouched(true);
-  }, []);
+  const onChange = useCallback(
+    (option) => {
+      if (isCreatable) {
+        if (typeof option === 'string') {
+          setValue([...value, option]);
+        } else {
+          setValue(option);
+        }
+
+        // setValue([...value, option]);
+      } else {
+        const allIndex = option.findIndex((opt) => opt.value === '*');
+        if (option.length === 0 && emptyIsUndefined) {
+          setValue(undefined);
+        } else if (allIndex === 0 && option.length > 1) {
+          const newValues = option.slice(1);
+          setValue(newValues.map((val) => val.value));
+        } else if (allIndex >= 0) {
+          if (!hasVirtualAll) setValue(['*']);
+          else setValue(options.map(({ value: v }) => v));
+        } else if (option.length > 0) setValue(option.map((val) => val.value));
+        else setValue([]);
+        setTouched(true);
+      }
+    },
+    [value],
+  );

  const onFieldBlur = useCallback(() => {
    setTouched(true);
@@ -82,6 +98,7 @@ const MultiSelectField = ({
      isHidden={isHidden}
      isPortal={isPortal}
      definitionKey={definitionKey}
+      isCreatable={isCreatable}
    />
  );
 };
--- a/src/components/Modals/CableDiagnosticsModal/index.tsx
+++ b/src/components/Modals/CableDiagnosticsModal/index.tsx
@@ -0,0 +1,257 @@
+import React from 'react';
+import {
+  Modal,
+  Text,
+  ModalOverlay,
+  ModalContent,
+  ModalBody,
+  Center,
+  Spinner,
+  Checkbox,
+  Stack,
+  Table,
+  Thead,
+  Tbody,
+  Tr,
+  Th,
+  Td,
+} from '@chakra-ui/react';
+import { PlugsConnected } from '@phosphor-icons/react';
+import { useTranslation } from 'react-i18next';
+import { CloseButton } from 'components/Buttons/CloseButton';
+import { ResponsiveButton } from 'components/Buttons/ResponsiveButton';
+import { ModalHeader } from 'components/Containers/Modal/ModalHeader';
+import { useCableDiagnostics } from 'hooks/Network/Devices';
+import { ModalProps } from 'models/Modal';
+import Button from 'theme/components/button';
+import { DataGridColumn, useDataGrid } from 'components/DataTables/DataGrid/useDataGrid';
+import { DataGrid } from 'components/DataTables/DataGrid';
+
+export type CableDiagnosticsModalProps = {
+  modalProps: ModalProps;
+  serialNumber: string;
+  port: string;
+};
+
+type DiagnosticsRow = {
+  port: string;
+  linkStatus: string;
+  pairA: string;
+  pairB: string;
+  pairC: string;
+  pairD: string;
+  type: string;
+};
+
+type OpticalRow = {
+  port: string;
+  vendorName: string;
+  formFactor: string;
+  partNumber: string;
+  serialNumber: string;
+  temperature: string;
+  txPower: string;
+  rxPower: string;
+  revision: string;
+};
+
+export const CableDiagnosticsModal = ({
+  modalProps: { isOpen, onClose },
+  serialNumber,
+  port,
+}: CableDiagnosticsModalProps) => {
+  const { t } = useTranslation();
+  const [selectedPorts, setSelectedPorts] = React.useState<string[]>([]);
+  const [diagnosticsResult, setDiagnosticsResult] = React.useState<any>(null);
+  const { mutateAsync: diagnose, isLoading } = useCableDiagnostics({ serialNumber });
+
+  const handlePortToggle = (port: string) => {
+    setSelectedPorts((prev) => (prev.includes(port) ? prev.filter((p) => p !== port) : [...prev, port]));
+  };
+
+  const handleDiagnose = async () => {
+    if (port) {
+      try {
+        const result = await diagnose([port]);
+        setDiagnosticsResult(result);
+      } catch (error) {
+        console.error('Error diagnosing cable:', error);
+      }
+    }
+  };
+
+  const tableController = useDataGrid({
+    tableSettingsId: 'cable.diagnostics.table',
+    defaultOrder: ['port', 'linkStatus', 'pairA', 'pairB', 'pairC', 'pairD', 'type'],
+    showAllRows: true,
+  });
+
+  const columns: DataGridColumn<DiagnosticsRow | OpticalRow>[] = React.useMemo(() => {
+    const data = diagnosticsResult?.results?.status?.text?.[port];
+    const isOpticalData = data && 'form-factor' in data;
+
+    return isOpticalData
+      ? [
+          {
+            id: 'vendorName',
+            header: 'Vendor Name',
+            accessorKey: 'vendorName',
+          },
+          {
+            id: 'formFactor',
+            header: 'Form Factor',
+            accessorKey: 'formFactor',
+          },
+          {
+            id: 'partNumber',
+            header: 'Part Number',
+            accessorKey: 'partNumber',
+          },
+          {
+            id: 'serialNumber',
+            header: 'Serial Number',
+            accessorKey: 'serialNumber',
+          },
+          {
+            id: 'temperature',
+            header: 'Temperature',
+            accessorKey: 'temperature',
+          },
+          {
+            id: 'txPower',
+            header: 'TX Power',
+            accessorKey: 'txPower',
+          },
+          {
+            id: 'rxPower',
+            header: 'RX Power',
+            accessorKey: 'rxPower',
+          },
+          {
+            id: 'revision',
+            header: 'Revision',
+            accessorKey: 'revision',
+          },
+        ]
+      : [
+          {
+            id: 'port',
+            header: 'Port',
+            accessorKey: 'port',
+          },
+          {
+            id: 'linkStatus',
+            header: 'Link Status',
+            accessorKey: 'linkStatus',
+          },
+          {
+            id: 'pairA',
+            header: 'Pair A',
+            accessorKey: 'pairA',
+          },
+          {
+            id: 'pairB',
+            header: 'Pair B',
+            accessorKey: 'pairB',
+          },
+          {
+            id: 'pairC',
+            header: 'Pair C',
+            accessorKey: 'pairC',
+          },
+          {
+            id: 'pairD',
+            header: 'Pair D',
+            accessorKey: 'pairD',
+          },
+          {
+            id: 'type',
+            header: 'Type',
+            accessorKey: 'type',
+          },
+        ];
+  }, [diagnosticsResult]);
+
+  const formatDiagnosticsData = (result: any): (DiagnosticsRow | OpticalRow)[] => {
+    if (!result?.results?.status?.text?.[port]) return [];
+
+    const data = result.results.status.text[port];
+
+    if (data['form-factor']) {
+      return [
+        {
+          port,
+          vendorName: data['vendor-name'] || 'N/A',
+          formFactor: data['form-factor'] || 'N/A',
+          partNumber: data['part-number'] || 'N/A',
+          serialNumber: data['serial-number'] || 'N/A',
+          temperature: data.temperature ? `${data.temperature.toFixed(2)}` : 'N/A',
+          txPower: data['tx-optical-power'] ? `${data['tx-optical-power']}` : 'N/A',
+          rxPower: data['rx-optical-power'] ? `${data['rx-optical-power']}` : 'N/A',
+          revision: data.revision || 'N/A',
+        },
+      ];
+    }
+
+    return [
+      {
+        port,
+        linkStatus: data['link-status'],
+        pairA: `${data['pair-A'].meters} (${data['pair-A'].status})`,
+        pairB: `${data['pair-B'].meters} (${data['pair-B'].status})`,
+        pairC: `${data['pair-C'].meters} (${data['pair-C'].status})`,
+        pairD: `${data['pair-D'].meters} (${data['pair-D'].status})`,
+        type: data.type,
+      },
+    ];
+  };
+
+  return (
+    <Modal onClose={onClose} isOpen={isOpen} size="xl">
+      <ModalOverlay />
+      <ModalContent maxW="50vw">
+        <ModalHeader title={t('commands.cable_diagnostics')} right={<CloseButton onClick={onClose} />} />
+        <ModalBody pb={6}>
+          {isLoading ? (
+            <Center my={4} flexDirection="column" gap={4}>
+              <Spinner size="lg" />
+              <Text>Please wait...</Text>
+              <Text fontSize="sm" color="gray.500">
+                Please do not close this window. This may take a few seconds.
+              </Text>
+            </Center>
+          ) : (
+            <Center flexDirection="column" gap={4}>
+              <ResponsiveButton
+                color="blue"
+                icon={<PlugsConnected size={20} />}
+                label={`${
+                  diagnosticsResult && formatDiagnosticsData(diagnosticsResult).length > 0 ? 'Retake' : 'Start'
+                } Test for Port ${port}`}
+                onClick={handleDiagnose}
+                isLoading={isLoading}
+                isDisabled={!port}
+                isCompact={false}
+              />
+              {diagnosticsResult && formatDiagnosticsData(diagnosticsResult).length > 0 && (
+                <DataGrid<DiagnosticsRow | OpticalRow>
+                  controller={tableController}
+                  header={{
+                    title: '',
+                    objectListed: 'Cable Diagnostics',
+                  }}
+                  columns={columns}
+                  isLoading={isLoading}
+                  data={formatDiagnosticsData(diagnosticsResult)}
+                  options={{
+                    isHidingControls: true,
+                  }}
+                />
+              )}
+            </Center>
+          )}
+        </ModalBody>
+      </ModalContent>
+    </Modal>
+  );
+};
--- a/src/components/Modals/ConfigureModal/index.tsx
+++ b/src/components/Modals/ConfigureModal/index.tsx
@@ -59,16 +59,43 @@ const _ConfigureModal = ({ serialNumber, modalProps }: ConfigureModalProps) => {
    try {
      const config = JSON.parse(newConfig);
      configure.mutate(config, {
-        onSuccess: () => {
-          toast({
-            id: `configure-success-${serialNumber}`,
-            title: t('common.success'),
-            description: t('controller.configure.success'),
-            status: 'success',
-            duration: 5000,
-            isClosable: true,
-            position: 'top-right',
-          });
+        onSuccess: (data) => {
+          if (data.errorCode === 0) {
+            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'),
+              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();
        },
      });
--- a/src/components/Modals/ReEnrollModal/index.tsx
+++ b/src/components/Modals/ReEnrollModal/index.tsx
@@ -0,0 +1,50 @@
+import React from 'react';
+import { Center, Spinner, Alert, Button } from '@chakra-ui/react';
+import { useTranslation } from 'react-i18next';
+import { Modal } from '../Modal';
+import { useReEnroll } from 'hooks/Network/ReEnroll';
+import { ModalProps } from 'models/Modal';
+
+interface Props {
+  modalProps: ModalProps;
+  serialNumber: string;
+}
+
+const ReEnrollModal = ({ modalProps: { isOpen, onClose }, serialNumber }: Props) => {
+  const { t } = useTranslation();
+  const { mutate: reEnroll, isLoading } = useReEnroll({ serialNumber });
+
+  const submit = () => {
+    reEnroll(
+      { serialNumber, when: 0 },
+      {
+        onSuccess: () => {
+          onClose();
+        },
+      }
+    );
+  };
+
+  return (
+    <Modal isOpen={isOpen} onClose={onClose} title={t('controller.devices.re_enroll')}>
+      {isLoading ? (
+        <Center>
+          <Spinner size="lg" />
+        </Center>
+      ) : (
+        <>
+          <Alert colorScheme="blue" mb={6}>
+            {t('controller.devices.re_enroll_warning', { serialNumber })}
+          </Alert>
+          <Center mb={6}>
+            <Button size="lg" colorScheme="blue" onClick={submit} fontWeight="bold">
+              {t('controller.devices.confirm_re_enroll', { serialNumber })}
+            </Button>
+          </Center>
+        </>
+      )}
+    </Modal>
+  );
+};
+
+export default ReEnrollModal;
--- a/src/components/Modals/TelemetryModal/index.tsx
+++ b/src/components/Modals/TelemetryModal/index.tsx
@@ -25,6 +25,7 @@ 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;
@@ -146,8 +147,7 @@ const _TelemetryModal = ({ serialNumber, modalProps }: TelemetryModalProps) => {
              {t('controller.telemetry.interval')}: {form.interval} {lowercaseFirstLetter(t('common.seconds'))}
            </p>
            <p>
-              {t('controller.telemetry.duration')}: {form.interval}{' '}
-              {lowercaseFirstLetter(t('controller.telemetry.minutes'))}
+              {t('controller.telemetry.duration')}: {secondsDuration(form.lifetime, t)}
            </p>
            <p>
              {t('controller.telemetry.types')}: {form.types.join(', ')}
--- a/src/custom.d.ts
+++ b/src/custom.d.ts
@@ -8,3 +8,4 @@ declare module '*.png' {
  const value: string;
  export = value;
 }
+/// <reference types="vite-plugin-svgr/client" />
--- a/src/hooks/Network/Commands.ts
+++ b/src/hooks/Network/Commands.ts
@@ -174,12 +174,37 @@ export const useGetEventQueue = () => {
 };

 const configureDevice = (serialNumber: string) => async (configuration: Record<string, unknown>) =>
-  axiosGw.post<unknown>(`device/${serialNumber}/configure`, {
-    when: 0,
-    UUID: 1,
-    serialNumber,
-    configuration,
-  });
+  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();
--- a/src/hooks/Network/DefaultConfigurations.ts
+++ b/src/hooks/Network/DefaultConfigurations.ts
@@ -3,10 +3,12 @@ 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[];
--- a/src/hooks/Network/Devices.ts
+++ b/src/hooks/Network/Devices.ts
@@ -9,15 +9,21 @@ 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';

-const getDeviceCount = () =>
-  axiosGw.get('devices?countOnly=true').then((response) => response.data) as Promise<{ count: number }>;
+export const DEVICE_PLATFORMS = ['all', 'ap', 'switch'] as const;
+export type DevicePlatform = (typeof DEVICE_PLATFORMS)[number];

-export const useGetDeviceCount = ({ enabled }: { enabled: boolean }) => {
+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 }) => {
  const { t } = useTranslation();
  const toast = useToast();

-  return useQuery(['devices', 'count'], getDeviceCount, {
+  return useQuery(['devices', 'count', { platform }], () => getDeviceCount(platform), {
    enabled,
    onError: (e: AxiosError) => {
      if (!toast.isActive('inventory-fetching-error'))
@@ -42,13 +48,14 @@ 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' | 'IOT' | 'MESH';
+  deviceType: 'ap' | 'switch';
  entity: string;
  firmware: string;
  fwUpdatePolicy: string;
@@ -95,25 +102,27 @@ export const getSingleDeviceWithStatus = (serialNumber: string) =>
    })
    .catch(() => undefined);

-const getDevices = (limit: number, offset: number) =>
+const getDevices = (limit: number, offset: number, platform: DevicePlatform) =>
  axiosGw
-    .get(`devices?deviceWithStatus=true&limit=${limit}&offset=${offset}`)
+    .get(`devices?deviceWithStatus=true&limit=${limit}&offset=${offset}&platform=${platform}`)
    .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 }],
-    () => getDevices(pageInfo?.limit || 0, offset),
+    ['devices', 'all', { limit: pageInfo?.limit, offset, platform }],
+    () => getDevices(pageInfo?.limit || 0, offset, platform),
    {
      keepPreviousData: true,
      enabled: enabled && pageInfo !== undefined,
@@ -123,22 +132,28 @@ export const useGetDevices = ({
  );
 };

-const getAllDevices = async () => {
+const getAllDevices = async (platform: DevicePlatform) => {
  let offset = 0;
  let devices: DeviceWithStatus[] = [];
  let devicesResponse: { devicesWithStatus: DeviceWithStatus[] };
  do {
    // eslint-disable-next-line no-await-in-loop
-    devicesResponse = await getDevices(500, offset);
+    devicesResponse = await getDevices(500, offset, platform);
    devices = devices.concat(devicesResponse.devicesWithStatus);
    offset += 500;
  } while (devicesResponse.devicesWithStatus.length === 500);
  return devices;
 };

-export const useGetAllDevicesWithStatus = ({ onError }: { onError?: (e: AxiosError) => void }) => {
+export const useGetAllDevicesWithStatus = ({
+  onError,
+  platform = 'all',
+}: {
+  onError?: (e: AxiosError) => void;
+  platform?: DevicePlatform;
+}) => {
  const { isReady } = useEndpointStatus('owgw');
-  return useQuery(['devices', 'all', 'full'], getAllDevices, {
+  return useQuery(['devices', 'all', 'full', { platform }], () => getAllDevices(platform), {
    enabled: isReady && false,
    onError,
  });
@@ -151,6 +166,7 @@ export type DeviceStatus = {
  connected: boolean;
  connectReason?: string;
  certificateExpiryDate: number;
+  certificateIssuerName?: string;
  connectionCompletionTime: number;
  firmware: string;
  ipAddress: string;
@@ -362,6 +378,40 @@ export const useWifiScanDevice = ({ serialNumber }: { serialNumber: string }) =>
  );
 };

+export const useCableDiagnostics = ({ serialNumber }: { serialNumber: string }) => {
+  const toast = useToast();
+  const { t } = useTranslation();
+
+  return useMutation(
+    (ports: string[]): Promise<unknown> =>
+      axiosGw
+        .post(`device/${serialNumber}/cable-diagnostics`, {
+          serial: serialNumber,
+          ports,
+          when: 0,
+        })
+        .then(({ data }) => data),
+    {
+      onSuccess: (data) => {
+        console.log('Success data: ', data);
+      },
+      onError: (e: AxiosError) => {
+        toast({
+          id: uuid(),
+          title: t('common.error'),
+          description: t('commands.cablediagnostics_error', {
+            e: e?.response?.data?.ErrorDescription,
+          }),
+          status: 'error',
+          duration: 5000,
+          isClosable: true,
+          position: 'top-right',
+        });
+      },
+    },
+  );
+};
+
 export const useGetDeviceRtty = ({ serialNumber, extraId }: { serialNumber: string; extraId: string | number }) => {
  const { t } = useTranslation();
  const toast = useToast();
@@ -431,3 +481,45 @@ 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']);
+      },
+    },
+  );
+};
--- a/src/hooks/Network/Firmware.ts
+++ b/src/hooks/Network/Firmware.ts
@@ -70,25 +70,66 @@ 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}` : ''}`, {
-        serialNumber,
-        when: 0,
-        keepRedirector,
-        uri,
-        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: () => {
-        toast({
-          id: `device-upgrade-success-${uuid()}`,
-          title: t('common.success'),
-          description: t('commands.firmware_upgrade_success'),
-          status: 'success',
-          duration: 5000,
-          isClosable: true,
-          position: 'top-right',
-        });
-        onClose();
+      onSuccess: ({ data }) => {
+        if (data.errorCode === 0) {
+          toast({
+            id: `device-upgrade-success-${uuid()}`,
+            title: t('common.success'),
+            description: t('commands.firmware_upgrade_success'),
+            status: 'success',
+            duration: 5000,
+            isClosable: true,
+            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({
--- a/src/hooks/Network/ReEnroll.ts
+++ b/src/hooks/Network/ReEnroll.ts
@@ -0,0 +1,78 @@
+import { useToast } from '@chakra-ui/react';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+import { axiosGw } from 'constants/axiosInstances';
+
+export type ReEnrollRequest = {
+  serialNumber: string;
+  when?: number;
+};
+
+export type ReEnrollResponse = {
+  UUID: string;
+  command: 're-enroll' | 'reenroll';
+  completed: number;
+  custom: number;
+  details: {
+    serial: string;
+    when: number;
+  };
+  errorCode: number;
+  errorText: string;
+  executed: number;
+  executionTime: number;
+  results: {
+    serial: string;
+    status: {
+      error: number;
+      resultCode: number;
+      resultText: string;
+      text: string;
+    };
+  };
+  serialNumber: string;
+  status: string;
+  submitted: number;
+  submittedBy: string;
+  when: number;
+};
+
+const reEnrollDevice = async ({ serialNumber, when = 0 }: ReEnrollRequest) =>
+  axiosGw.post<ReEnrollResponse>(`device/${serialNumber}/reenroll`, {
+    serial: serialNumber,
+    when,
+  });
+
+export const useReEnroll = ({ serialNumber }: { serialNumber: string }) => {
+  const queryClient = useQueryClient();
+  const { t } = useTranslation();
+  const toast = useToast();
+
+  return useMutation(reEnrollDevice, {
+    onSuccess: () => {
+      queryClient.invalidateQueries(['commands', serialNumber]);
+      queryClient.invalidateQueries(['device', serialNumber]);
+      queryClient.invalidateQueries(['device-status', serialNumber]);
+      toast({
+        id: `re-enroll-success-${serialNumber}`,
+        title: t('common.success'),
+        description: t('controller.devices.re_enroll_initiated', { serialNumber }),
+        status: 'success',
+        duration: 5000,
+        isClosable: true,
+        position: 'top-right',
+      });
+    },
+    onError: (error: any) => {
+      toast({
+        id: `re-enroll-error-${serialNumber}`,
+        title: t('common.error'),
+        description: error?.response?.data?.ErrorDescription || t('common.error'),
+        status: 'error',
+        duration: 5000,
+        isClosable: true,
+        position: 'top-right',
+      });
+    },
+  });
+};
--- a/src/hooks/Network/Statistics.ts
+++ b/src/hooks/Network/Statistics.ts
@@ -2,7 +2,24 @@ import { useQuery } from '@tanstack/react-query';
 import { axiosGw } from 'constants/axiosInstances';
 import { AxiosError } from 'models/Axios';

-type DeviceInterfaceStatistics = {
+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 = {
  clients: {
    ipv4_addresses?: string[];
    ipv6_addresses?: string[];
@@ -42,6 +59,7 @@ type DeviceInterfaceStatistics = {
      dynamic_vlan?: number;
      inactive: number;
      ipaddr_v4: string;
+      fingerprint?: object;
      rssi: number;
      rx_bytes: number;
      rx_duration: number;
@@ -112,11 +130,21 @@ 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;
@@ -138,18 +166,10 @@ export type DeviceStatistics = {
  };
  'link-state'?: {
    downstream: {
-      eth1?: {
-        carrier?: number;
-        duplex?: string;
-        speed?: number;
-      };
+      [key: string]: DeviceLinkState;
    };
    upstream: {
-      eth0?: {
-        carrier?: number;
-        duplex?: string;
-        speed?: number;
-      };
+      [key: string]: DeviceLinkState;
    };
  };
  'lldp-peers'?: {
@@ -190,6 +210,7 @@ export const useGetDeviceLastStats = ({
  useQuery(['device', serialNumber, 'last-statistics'], () => getLastStats(serialNumber), {
    enabled: serialNumber !== undefined && serialNumber !== '',
    staleTime: 1000 * 60,
+    refetchInterval: 1000 * 60,
    onError,
  });

--- a/src/layout/Devices.tsx
+++ b/src/layout/Devices.tsx
@@ -1,16 +1,6 @@
 import * as React from 'react';
-import {
-  Box,
-  CircularProgress,
-  CircularProgressLabel,
-  Flex,
-  Heading,
-  Icon,
-  Text,
-  Tooltip,
-  VStack,
-} from '@chakra-ui/react';
-import { ArrowSquareDown, ArrowSquareUp, Clock } from '@phosphor-icons/react';
+import { Flex, Heading, Icon, Text, Tooltip, VStack } from '@chakra-ui/react';
+import { ArrowSquareDown, ArrowSquareUp } from '@phosphor-icons/react';
 import { useTranslation } from 'react-i18next';
 import { Card } from 'components/Containers/Card';
 import { compactSecondsToDetailed, minimalSecondsToDetailed } from 'helpers/dateFormatting';
@@ -20,74 +10,26 @@ 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}>
--- a/src/models/Device.ts
+++ b/src/models/Device.ts
@@ -3,6 +3,7 @@ import { Note } from './Note';

 export interface GatewayDevice {
  UUID: number;
+  blackListed?: boolean;
  certificateExpiryDate: number;
  compatible: string;
  configuration: unknown;
--- a/src/pages/DefaultConfigurations/List/CreateModal.tsx
+++ b/src/pages/DefaultConfigurations/List/CreateModal.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Box, SimpleGrid, useBoolean, useDisclosure, useToast } from '@chakra-ui/react';
+import { Box, Flex, useBoolean, useDisclosure, useToast } from '@chakra-ui/react';
 import { Formik, FormikProps } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { v4 as uuid } from 'uuid';
@@ -16,6 +16,7 @@ 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();
@@ -68,42 +69,63 @@ const CreateDefaultConfigurationModal = () => {
            key={formKey}
            validationSchema={DefaultConfigurationSchema(t)}
            onSubmit={(data, { setSubmitting, resetForm }) => {
-              createConfig.mutateAsync(data, {
-                onSuccess: () => {
-                  toast({
-                    id: `config-create-success`,
-                    title: t('common.success'),
-                    description: t('controller.configurations.create_success'),
-                    status: 'success',
-                    duration: 5000,
-                    isClosable: true,
-                    position: 'top-right',
-                  });
-                  setSubmitting(false);
-                  resetForm();
-                  modalProps.onClose();
+              createConfig.mutateAsync(
+                { ...data, modelIds: data.modelIds.map((v) => v.value) },
+                {
+                  onSuccess: () => {
+                    toast({
+                      id: `config-create-success`,
+                      title: t('common.success'),
+                      description: t('controller.configurations.create_success'),
+                      status: 'success',
+                      duration: 5000,
+                      isClosable: true,
+                      position: 'top-right',
+                    });
+                    setSubmitting(false);
+                    resetForm();
+                    modalProps.onClose();
+                  },
+                  onError: (error) => {
+                    const e = error as AxiosError;
+                    toast({
+                      id: `config-create-error`,
+                      title: t('common.error'),
+                      description: e?.response?.data?.ErrorDescription,
+                      status: 'error',
+                      duration: 5000,
+                      isClosable: true,
+                      position: 'top-right',
+                    });
+                    setSubmitting(false);
+                  },
                },
-                onError: (error) => {
-                  const e = error as AxiosError;
-                  toast({
-                    id: `config-create-error`,
-                    title: t('common.error'),
-                    description: e?.response?.data?.ErrorDescription,
-                    status: 'error',
-                    duration: 5000,
-                    isClosable: true,
-                    position: 'top-right',
-                  });
-                  setSubmitting(false);
-                },
-              });
+              );
            }}
          >
            <Box>
-              <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>
+              <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} />
              <MultiSelectField
                name="modelIds"
                label={t('controller.dashboard.device_types')}
@@ -114,9 +136,10 @@ const CreateDefaultConfigurationModal = () => {
                    value: devType,
                  })) ?? []
                }
+                isCreatable
                isRequired
              />
-              <StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} />
+              <StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} mt={4} />
            </Box>
          </Formik>
        </Box>
--- a/src/pages/DefaultConfigurations/List/EditModal.tsx
+++ b/src/pages/DefaultConfigurations/List/EditModal.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Box, SimpleGrid, useBoolean, UseDisclosureReturn, useToast } from '@chakra-ui/react';
+import { Box, Flex, useBoolean, UseDisclosureReturn, useToast } from '@chakra-ui/react';
 import { Formik, FormikProps } from 'formik';
 import { useTranslation } from 'react-i18next';
 import { v4 as uuid } from 'uuid';
@@ -15,6 +15,7 @@ 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;
@@ -69,47 +70,69 @@ 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, {
-                  onSuccess: () => {
-                    toast({
-                      id: `config-edit-success`,
-                      title: t('common.success'),
-                      description: t('controller.configurations.update_success'),
-                      status: 'success',
-                      duration: 5000,
-                      isClosable: true,
-                      position: 'top-right',
-                    });
-                    setSubmitting(false);
-                    resetForm();
-                    modalProps.onClose();
+                updateConfig.mutateAsync(
+                  { ...data, modelIds: data.modelIds.map((v) => v.value) },
+                  {
+                    onSuccess: () => {
+                      toast({
+                        id: `config-edit-success`,
+                        title: t('common.success'),
+                        description: t('controller.configurations.update_success'),
+                        status: 'success',
+                        duration: 5000,
+                        isClosable: true,
+                        position: 'top-right',
+                      });
+                      setSubmitting(false);
+                      resetForm();
+                      modalProps.onClose();
+                    },
+                    onError: (error) => {
+                      const e = error as AxiosError;
+                      toast({
+                        id: `config-edit-error`,
+                        title: t('common.error'),
+                        description: e?.response?.data?.ErrorDescription,
+                        status: 'error',
+                        duration: 5000,
+                        isClosable: true,
+                        position: 'top-right',
+                      });
+                      setSubmitting(false);
+                    },
                  },
-                  onError: (error) => {
-                    const e = error as AxiosError;
-                    toast({
-                      id: `config-edit-error`,
-                      title: t('common.error'),
-                      description: e?.response?.data?.ErrorDescription,
-                      status: 'error',
-                      duration: 5000,
-                      isClosable: true,
-                      position: 'top-right',
-                    });
-                    setSubmitting(false);
-                  },
-                });
+                );
              }}
            >
              <Box>
-                <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>
+                <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} />
                <MultiSelectField
                  name="modelIds"
                  label={t('controller.dashboard.device_types')}
@@ -120,9 +143,16 @@ const EditDefaultConfiguration = ({ modalProps, config }: Props) => {
                      value: devType,
                    })) ?? []
                  }
+                  isCreatable
                  isRequired
                />
-                <StringField name="configuration" label={t('configurations.one')} isArea isDisabled={isDisabled} />
+                <StringField
+                  name="configuration"
+                  label={t('configurations.one')}
+                  isArea
+                  isDisabled={isDisabled}
+                  mt={4}
+                />
              </Box>
            </Formik>
          )}
--- a/src/pages/DefaultConfigurations/List/index.tsx
+++ b/src/pages/DefaultConfigurations/List/index.tsx
@@ -58,6 +58,14 @@ 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'),
--- a/src/pages/DefaultConfigurations/utils.ts
+++ b/src/pages/DefaultConfigurations/utils.ts
@@ -6,7 +6,8 @@ export const DefaultConfigurationSchema = (t: (str: string) => string) =>
    .shape({
      name: Yup.string().required(t('form.required')),
      description: Yup.string(),
-      modelIds: Yup.array().of(Yup.string()).required(t('form.required')).min(1, t('form.required')),
+      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')),
      configuration: Yup.string()
        .required(t('form.required'))
        .test('configuration', t('form.invalid_json'), (v) => testJson(v ?? '')),
@@ -15,5 +16,6 @@ export const DefaultConfigurationSchema = (t: (str: string) => string) =>
      name: '',
      description: '',
      modelIds: [],
+      platform: 'ap',
      configuration: '',
    });
--- a/src/pages/Device/Summary.tsx
+++ b/src/pages/Device/Summary.tsx
@@ -65,11 +65,7 @@ const DeviceSummary = ({ serialNumber }: Props) => {
  const getDeviceCompatible = () => {
    if (!getDevice.data?.compatible) return undefined;

-    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();
+    if (getDevice.data.compatible.includes(' ')) return getDevice.data.compatible.replaceAll(' ', '_');

    return getDevice.data?.compatible;
  };
@@ -129,9 +125,7 @@ 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 * 100).toFixed(2)}%`).join(' | ')
-                : ''}
+              {getStats.data?.unit?.load ? getStats.data?.unit.load.map((l) => `${l.toFixed(2)}`).join(' | ') : ''}
            </GridItem>
            <GridItem colSpan={1} alignContent="center" alignItems="center">
              <Heading size="sm">{t('controller.devices.localtime')}:</Heading>
@@ -177,12 +171,18 @@ const DeviceSummary = ({ serialNumber }: Props) => {
                '-'
              )}
            </GridItem>
+            <GridItem colSpan={1} alignContent="center" alignItems="center">
+              <Heading size="sm">{t('devices.certificate_issuer')}:</Heading>
+            </GridItem>
+            <GridItem colSpan={1}>
+              {getStatus.data?.certificateIssuerName ? getStatus.data.certificateIssuerName.split('CN=')[1] : '-'}
+            </GridItem>
            <GridItem colSpan={1} alignContent="center" alignItems="center">
              <Heading size="sm">Connect Reason:</Heading>
            </GridItem>
            <GridItem colSpan={1}>
              {getStatus.data?.connectReason && getStatus.data?.connectReason.length > 0
-                ? uppercaseFirstLetter(getStatus.data.connectReason)
+                ? uppercaseFirstLetter(getStatus.data?.connectReason)
                : '-'}
            </GridItem>
          </Grid>
--- a/src/pages/Device/SwitchPortExamination/Actions.tsx
+++ b/src/pages/Device/SwitchPortExamination/Actions.tsx
@@ -0,0 +1,83 @@
+import * as React from 'react';
+import { IconButton, Tooltip, useToast } from '@chakra-ui/react';
+import { Power, PlugsConnected } 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';
+import { CableDiagnosticsModalProps } from 'components/Modals/CableDiagnosticsModal';
+
+type Props = {
+  state: DeviceLinkState & { name: string };
+  deviceSerialNumber: string;
+  onOpenCableDiagnostics: (port: string) => void;
+};
+
+const LinkStateTableActions = ({ state, deviceSerialNumber, onOpenCableDiagnostics }: 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>
+      <Tooltip label="Cable Diagnostics" placement="auto-start">
+        <IconButton
+          aria-label="Cable Diagnostics"
+          icon={<PlugsConnected size={20} />}
+          colorScheme="blue"
+          onClick={() => onOpenCableDiagnostics(state.name)}
+          size="xs"
+        />
+      </Tooltip>
+    </>
+  );
+};
+
+export default LinkStateTableActions;
--- a/src/pages/Device/SwitchPortExamination/LinkStateTable.tsx
+++ b/src/pages/Device/SwitchPortExamination/LinkStateTable.tsx
@@ -0,0 +1,208 @@
+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, onOpenCableDiagnostics: (port: string) => void) => (
+  <LinkStateTableActions
+    state={row}
+    deviceSerialNumber={serialNumber}
+    onOpenCableDiagnostics={onOpenCableDiagnostics}
+  />
+);
+
+type Props = {
+  statistics?: Row[];
+  refetch: () => void;
+  isFetching: boolean;
+  type: 'upstream' | 'downstream';
+  serialNumber: string;
+  onOpenCableDiagnostics: (port: string) => void;
+};
+
+const LinkStateTable = ({ statistics, refetch, isFetching, type, serialNumber, onOpenCableDiagnostics }: 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 }) => (
+          <LinkStateTableActions
+            state={cell.row.original}
+            deviceSerialNumber={serialNumber}
+            onOpenCableDiagnostics={onOpenCableDiagnostics}
+          />
+        ),
+      },
+    ],
+    [onOpenCableDiagnostics],
+  );
+
+  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;
--- a/src/pages/Device/SwitchPortExamination/SwitchInterfaceTable.tsx
+++ b/src/pages/Device/SwitchPortExamination/SwitchInterfaceTable.tsx
@@ -0,0 +1,172 @@
+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;
--- a/src/pages/Device/SwitchPortExamination/index.tsx
+++ b/src/pages/Device/SwitchPortExamination/index.tsx
@@ -0,0 +1,112 @@
+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';
+import { CableDiagnosticsModal } from 'components/Modals/CableDiagnosticsModal';
+import { useDisclosure } from '@chakra-ui/react';
+
+type Props = {
+  serialNumber: string;
+};
+
+const SwitchPortExamination = ({ serialNumber }: Props) => {
+  const [tabIndex, setTabIndex] = React.useState(0);
+  const [selectedPort, setSelectedPort] = React.useState<string>('');
+  const cableDiagnosticsModalProps = useDisclosure();
+
+  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]);
+
+  const handleOpenCableDiagnostics = React.useCallback((port: string) => {
+    setSelectedPort(port);
+    cableDiagnosticsModalProps.onOpen();
+  }, []);
+
+  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}
+                    onOpenCableDiagnostics={handleOpenCableDiagnostics}
+                  />
+                ) : (
+                  <Spinner size="xl" />
+                )}
+              </TabPanel>
+              <TabPanel>
+                {getStats.data ? (
+                  <LinkStateTable
+                    statistics={downLinkStates}
+                    refetch={getStats.refetch}
+                    isFetching={getStats.isFetching}
+                    type="downstream"
+                    serialNumber={serialNumber}
+                    onOpenCableDiagnostics={handleOpenCableDiagnostics}
+                  />
+                ) : (
+                  <Spinner size="xl" />
+                )}
+              </TabPanel>
+            </TabPanels>
+          </Tabs>
+        </CardBody>
+      </Card>
+      <CableDiagnosticsModal modalProps={cableDiagnosticsModalProps} serialNumber={serialNumber} port={selectedPort} />
+    </>
+  );
+};
+
+export default SwitchPortExamination;
--- a/src/pages/Device/WifiAnalysis/AssocationsTable.tsx
+++ b/src/pages/Device/WifiAnalysis/AssocationsTable.tsx
@@ -28,6 +28,7 @@ export type ParsedAssociation = {
  txNss: number | string;
  recorded: number;
  dynamicVlan?: number;
+  fingerprint?: object;
 };

 type Props = {
@@ -77,6 +78,14 @@ 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',
@@ -84,6 +93,13 @@ 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'),
@@ -166,7 +182,7 @@ const WifiAnalysisAssociationsTable = ({ data, ouis, isSingle }: Props) => {
        customWidth: '35px',
      },
    ],
-    [t],
+    [t, ouis],
  );

  return (
--- a/src/pages/Device/WifiAnalysis/RadiosTable.tsx
+++ b/src/pages/Device/WifiAnalysis/RadiosTable.tsx
@@ -17,14 +17,18 @@ 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 }: Props) => {
+const WifiAnalysisRadioTable = ({ data, isSingle }: Props) => {
  const { t } = useTranslation();
  const [hiddenColumns, setHiddenColumns] = React.useState<string[]>([]);

@@ -44,19 +48,27 @@ const WifiAnalysisRadioTable = ({ data }: Props) => {
      },
      {
        id: 'channel',
-        Header: 'Ch',
+        Header: 'Ch.',
        Footer: '',
        accessor: 'channel',
        customWidth: '35px',
      },
      {
        id: 'channelWidth',
-        Header: t('controller.wifi.channel_width'),
+        Header: 'Ch. W',
        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'),
@@ -67,25 +79,49 @@ const WifiAnalysisRadioTable = ({ data }: Props) => {
      },
      {
        id: 'activeMs',
-        Header: t('controller.wifi.active_ms'),
+        Header: 'Active (ms)',
        Footer: '',
        accessor: 'activeMs',
-        customWidth: '35px',
+        customWidth: '105px',
        disableSortBy: true,
      },
      {
        id: 'busyMs',
-        Header: t('controller.wifi.busy_ms'),
+        Header: 'Busy (ms)',
        Footer: '',
        accessor: 'busyMs',
-        customWidth: '35px',
+        customWidth: '105px',
        disableSortBy: true,
      },
      {
        id: 'receiveMs',
-        Header: t('controller.wifi.receive_ms'),
+        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',
+        Footer: '',
+        accessor: 'frequency',
        customWidth: '35px',
        disableSortBy: true,
      },
@@ -97,7 +133,7 @@ const WifiAnalysisRadioTable = ({ data }: Props) => {
    <>
      <Flex>
        <Heading size="sm" mt={2} my="auto">
-          {t('configurations.radios')} ({data?.length})
+          {isSingle ? 'Radio' : `${t('configurations.radios')} (${data?.length})`}
        </Heading>
        <Spacer />
        <ColumnPicker
--- a/src/pages/Device/WifiAnalysis/index.tsx
+++ b/src/pages/Device/WifiAnalysis/index.tsx
@@ -16,11 +16,29 @@ type Props = {
  serialNumber: string;
 };

-const parseRadios = (t: (str: string) => string, data: { data: DeviceStatistics; recorded: number }) => {
+const parseRadios = (_: (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,
@@ -29,12 +47,15 @@ const parseRadios = (t: (str: string) => string, data: { data: DeviceStatistics;
          deductedBand: radio.channel && radio.channel > 16 ? '5G' : '2G',
          channel: radio.channel,
          channelWidth: radio.channel_width,
-          noise: radio.noise ? parseDbm(radio.noise) : '-',
+          noise,
          txPower: radio.tx_power ?? '-',
-          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),
+          activeMs,
+          busyMs,
+          receiveMs,
+          sendMs,
          phy: radio.phy,
+          temperature: temperature ? temperature.toString() : '-',
+          frequency: radio.frequency?.join(', ') ?? '-',
        });
      }
    }
@@ -84,6 +105,7 @@ const parseAssociations = (data: { data: DeviceStatistics; recorded: number }, r
          txNss: association.tx_rate.nss ?? '-',
          recorded: data.recorded,
          dynamicVlan: association.dynamic_vlan,
+          fingerprint: association.fingerprint,
        });
      }
    }
--- a/src/pages/Device/Wrapper.tsx
+++ b/src/pages/Device/Wrapper.tsx
@@ -41,11 +41,15 @@ import { EventQueueModal } from 'components/Modals/EventQueueModal';
 import FactoryResetModal from 'components/Modals/FactoryResetModal';
 import { FirmwareUpgradeModal } from 'components/Modals/FirmwareUpgradeModal';
 import { RebootModal } from 'components/Modals/RebootModal';
+import ReEnrollModal from 'components/Modals/ReEnrollModal';
 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;
@@ -65,6 +69,7 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
  const getHealth = useGetDeviceHealthChecks({ serialNumber, limit: 1 });
  const { isOpen: isDeleteOpen, onOpen: onDeleteOpen, onClose: onDeleteClose } = useDisclosure();
  const scanModalProps = useDisclosure();
+  const cableDiagnosticsModalProps = useDisclosure();
  const resetModalProps = useDisclosure();
  const eventQueueProps = useDisclosure();
  const configureModalProps = useDisclosure();
@@ -72,24 +77,14 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
  const telemetryModalProps = useDisclosure();
  const traceModalProps = useDisclosure();
  const rebootModalProps = useDisclosure();
+  const reEnrollModalProps = useDisclosure();
  const scriptModal = useScriptModal();
  // Sticky-top styles
  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({
@@ -104,18 +99,43 @@ 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={getStatus.data.connected ? WifiHigh : WifiSlash}
+        icon={icon}
      />
    );
-  }, [getStatus.data]);
+  }, [getStatus.data, getDevice.data]);

  const healthTag = React.useMemo(() => {
    if (!getStatus.data || !getStatus.data.connected || !getHealth.data || getHealth.data?.values?.length === 0)
@@ -198,6 +218,7 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
                  onOpenTelemetryModal={telemetryModalProps.onOpen}
                  onOpenScriptModal={scriptModal.openModal}
                  onOpenRebootModal={rebootModalProps.onOpen}
+                  onOpenReEnrollModal={reEnrollModalProps.onOpen}
                  size="md"
                  isCompact
                />
@@ -250,6 +271,7 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
                    onOpenTelemetryModal={telemetryModalProps.onOpen}
                    onOpenRebootModal={rebootModalProps.onOpen}
                    onOpenScriptModal={scriptModal.openModal}
+                    onOpenReEnrollModal={reEnrollModalProps.onOpen}
                    size="md"
                  />
                )}
@@ -293,6 +315,7 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
      <ConfigureModal serialNumber={serialNumber} modalProps={configureModalProps} />
      <TelemetryModal serialNumber={serialNumber} modalProps={telemetryModalProps} />
      <RebootModal serialNumber={serialNumber} modalProps={rebootModalProps} />
+      <ReEnrollModal serialNumber={serialNumber} modalProps={reEnrollModalProps} />
      {scriptModal.modal}
      <Box mt={isCompact ? '0px' : '68px'}>
        <Masonry
@@ -307,7 +330,8 @@ const DevicePageWrapper = ({ serialNumber }: Props) => {
          <DeviceSummary serialNumber={serialNumber} />
          <DeviceDetails serialNumber={serialNumber} />
          <DeviceStatisticsCard serialNumber={serialNumber} />
-          <WifiAnalysisCard serialNumber={serialNumber} />
+          {getDevice.data?.deviceType === 'ap' ? <WifiAnalysisCard serialNumber={serialNumber} /> : null}
+          {getDevice.data?.deviceType === 'switch' ? <SwitchPortExamination serialNumber={serialNumber} /> : null}
          <DeviceLogsCard serialNumber={serialNumber} />
          {getDevice.data && getDevice.data?.hasRADIUSSessions > 0 ? (
            <RadiusClientsCard serialNumber={serialNumber} />
--- a/src/pages/Device/ethernetIconConnected.svg
+++ b/src/pages/Device/ethernetIconConnected.svg
@@ -0,0 +1,2 @@
+<?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>
--- a/src/pages/Device/ethernetIconDisconnected.svg
+++ b/src/pages/Device/ethernetIconDisconnected.svg
@@ -0,0 +1,2 @@
+<?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>
--- a/src/pages/Devices/ListCard/icons/SWITCH.png
+++ b/src/pages/Devices/ListCard/icons/SWITCH.png
--- a/src/pages/Devices/ListCard/index.tsx
+++ b/src/pages/Devices/ListCard/index.tsx
@@ -1,5 +1,16 @@
 import * as React from 'react';
-import { Box, Center, Image, Link, Tag, TagLabel, TagRightIcon, Tooltip, useDisclosure } from '@chakra-ui/react';
+import {
+  Box,
+  Center,
+  Image,
+  Link,
+  Select,
+  Tag,
+  TagLabel,
+  TagRightIcon,
+  Tooltip,
+  useDisclosure,
+} from '@chakra-ui/react';
 import {
  CheckCircle,
  Heart,
@@ -8,6 +19,7 @@ import {
  ThermometerCold,
  ThermometerHot,
  WarningCircle,
+  XCircle,
 } from '@phosphor-icons/react';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
@@ -37,7 +49,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 { DeviceWithStatus, useGetDeviceCount, useGetDevices } from 'hooks/Network/Devices';
+import { DevicePlatform, DeviceWithStatus, useGetDeviceCount, useGetDevices } from 'hooks/Network/Devices';
 import { FirmwareAgeResponse, useGetFirmwareAges } from 'hooks/Network/Firmware';

 const fourDigitNumber = (v?: number) => {
@@ -63,6 +75,7 @@ const BADGE_COLORS: Record<string, string> = {
  NO_CERTIFICATE: 'red',
  MISMATCH_SERIAL: 'yellow',
  VERIFIED: 'green',
+  BLACKLISTED: 'white',
  SIMULATED: 'purple',
 };

@@ -70,6 +83,7 @@ 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();
@@ -108,13 +122,14 @@ const DeviceListCard = () => {
      'actions',
    ],
  });
-  const getCount = useGetDeviceCount({ enabled: true });
+  const getCount = useGetDeviceCount({ enabled: true, platform });
  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),
@@ -159,12 +174,32 @@ const DeviceListCard = () => {
        h="35px"
        w="35px"
        borderRadius="50em"
-        bgColor={BADGE_COLORS[device.simulated ? 'SIMULATED' : device.verifiedCertificate] ?? 'red'}
+        bgColor={
+          BADGE_COLORS[
+            device.simulated ? 'SIMULATED' : device.blackListed ? 'BLACKLISTED' : 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')
@@ -182,6 +217,7 @@ const DeviceListCard = () => {
          bottom={0}
          borderColor="gray.200"
          borderWidth={1}
+          hidden={device.blackListed}
        />
        {device.restrictedDevice && (
          <Box
@@ -533,12 +569,7 @@ const DeviceListCard = () => {
        header: t('analytics.last_connected'),
        footer: '',
        accessorKey: 'lastRecordedContact',
-        cell: (v) =>
-          dateCell(
-            v.cell.row.original.lastContact !== 0
-              ? v.cell.row.original.lastContact
-              : v.cell.row.original.lastRecordedContact,
-          ),
+        cell: (v) => dateCell(v.cell.row.original.lastRecordedContact),
        enableSorting: false,
        meta: {
          headerOptions: {
@@ -696,7 +727,21 @@ const DeviceListCard = () => {
        header={{
          title: `${getCount.data?.count ?? 0} ${t('devices.title')}`,
          objectListed: t('devices.title'),
-          leftContent: <GlobalSearchBar />,
+          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>
+            </>
+          ),
          otherButtons: (
            <ExportDevicesTableButton currentPageSerialNumbers={data.map((device) => device.serialNumber)} />
          ),
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -2,6 +2,7 @@ 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: [
@@ -44,6 +45,7 @@ export default defineConfig({
        ],
      },
    }),
+    svgr(),
  ],
  build: {
    outDir: './build',
Author	SHA1	Message	Date
Sebastian Rubina	c4aff418ed	Merge pull request #233 from Telecominfraproject/WIFI-14521-set-correct-tag-for-main Set correct tag for helm version	2025-08-05 13:06:11 -04:00
Carsten Schafer	dd5c894b03	Set correct tag for helm version Signed-off-by: Carsten Schafer <Carsten.Schafer@kinarasystems.com>	2025-08-05 11:51:43 -04:00
Sebastian Rubina	c3256b93c7	Merge pull request #232 from Telecominfraproject/re-enroll-modal Add device re-enrollment with confirmation modal	2025-07-14 15:50:59 -04:00
Sebastian Rubina	932f1f4a12	Change wording of translation.json. Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-14 15:48:41 -04:00
Sebastian Rubina	db3cbb0b35	Add device re-enrollment with confirmation modal - Add ReEnrollModal component for user confirmation before re-enrollment - Update DeviceActionDropdown to open modal instead of direct action - Add modal state management in Device Wrapper component - Add translation keys for re-enrollment UI with certificate renewal messaging - Remove direct useReEnroll hook usage in favor of modal pattern Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-14 15:38:30 -04:00
Sebastian Rubina	c895274ebf	Merge pull request #231 from Telecominfraproject/re-enroll-devices Add device re-enrollment functionality	2025-07-14 13:31:58 -04:00
Sebastian Rubina	a3647bca08	Add device re-enrollment functionality - Add re-enrollment API hook with mutation handling - Add re-enroll option to device action dropdown menu - Add translation keys for re-enrollment UI messages Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-14 13:16:26 -04:00
Carsten Schafer	5fbf421d77	Merge pull request #230 from Telecominfraproject/display-certificate-issuer Display certificate issuer	2025-07-02 13:49:24 -04:00
Carsten Schafer	e09b3ee5f4	Merge branch 'main' into display-certificate-issuer	2025-07-02 11:45:47 -04:00
Sebastian Rubina	855960559d	Update package.json version	2025-07-02 11:33:03 -04:00
Sebastian Rubina	4cecfc6fc4	Display Certificate Issuer - Add label on translation.json - Add new key on DeviceStatus - Add column label and data on Summary.txt Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-02 09:49:49 -04:00
Sebastian Rubina	e62d1e4a98	Display Certificate Issuer - Add label on translation.json - Add new key on DeviceStatus - Add column label and data on Summary.txt Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-02 09:49:49 -04:00
Ivan Chvets	6dddba0848	fix: Version update - release 4.0.0 Signed-off-by: Ivan Chvets <ivan.chvets@kinarasystems.com> Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2025-07-02 09:49:49 -04:00
i-chvets	30fffdfe52	Merge pull request #228 from Telecominfraproject/version_update WIFI-14521: fix: Version update - release 4.0.0	2025-04-24 16:39:17 -04:00
Ivan Chvets	c8d6540ca6	fix: Version update - release 4.0.0 Signed-off-by: Ivan Chvets <ivan.chvets@kinarasystems.com>	2025-04-24 16:36:43 -04:00
i-chvets	2b2f08c231	Merge pull request #229 from Telecominfraproject/WIFI-14521-ci-changes WIFI-14521: Update to ubuntu-latest for GH runner	2025-04-24 16:18:46 -04:00
Carsten Schafer	0cfed90a7b	WIFI-14521: Update to ubuntu-latest for GH runner Signed-off-by: Carsten Schafer <Carsten.Schafer@kinarasystems.com>	2025-04-24 15:54:46 -04:00
Carsten Schafer	01008dc1aa	Merge pull request #226 from Telecominfraproject/version_update fix: release 3.2.1 version update	2024-12-10 15:36:59 -05:00
Ivan Chvets	26b90cfdba	fix: release 3.2.1 version update https://telecominfraproject.atlassian.net/browse/WIFI-14165 Signed-off-by: Ivan Chvets <ivan.chvets@kinarasystems.com>	2024-12-10 15:34:09 -05:00
i-chvets	b218051104	Merge pull request #224 from Telecominfraproject/OLS-516-feat-cable-diagnostics-ui Ols 516 feat cable diagnostics UI	2024-12-05 09:12:28 -05:00
Sebastian Rubina	a2fa93938f	feat: cable diagnostics ui https://telecominfraproject.atlassian.net/browse/OLS-516 Signed-off-by: Sebastian Rubina <sebastian.rubina@kinarasystems.com> Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2024-12-04 16:41:06 -05:00
TIP Automation User	c220d11dd0	Chg: update image tag in helm values to v3.2.0 Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2024-12-04 16:41:01 -05:00
TIP Automation User	40d533ecc5	Chg: update image tag in helm values to v3.2.0-RC1 Signed-off-by: Sebastian Rubina <sebastian.rubina@icloud.com>	2024-12-04 16:40:40 -05:00
jaspreetsachdev	d1a1c96e74	Merge pull request #223 from Telecominfraproject/version_update WIFI-14165: release 3.2 version update	2024-09-30 21:02:13 -04:00
Ivan Chvets	1a18985c0d	fix: release 3.2 version update https://telecominfraproject.atlassian.net/browse/WIFI-14165 Signed-off-by: Ivan Chvets <ivan.chvets@kinarasystems.com>	2024-09-30 20:56:34 -04:00
Charles Bourque	8eede7b559	Merge pull request #222 from stephb9959/main [OLS-106] Add new asterfusion images	2024-06-06 12:01:57 -04:00
Charles	caab40b08e	[OLS-106] Add new asterfusion images Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-06-06 12:00:29 -04:00
Charles Bourque	18fa320b19	Merge pull request #221 from stephb9959/main [OLS-106] Add new asterfusion images	2024-06-06 11:56:32 -04:00
Charles	6f9f6638d6	[OLS-106] Add new asterfusion images Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-06-06 11:55:56 -04:00
Charles Bourque	5688e2f7bc	Merge pull request #220 from stephb9959/main [OLS-51] Added RTTY for OLS switches	2024-06-04 09:14:01 -04:00
Charles	4738097178	[OLS-51] Added RTTY for OLS switches Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-06-04 09:13:05 -04:00
Charles Bourque	591ecc3664	Merge pull request #219 from stephb9959/main [OLS-42] Telemetry duration display fix	2024-06-04 09:06:45 -04:00
Charles	b9089a39ac	[OLS-42] Telemetry duration display fix Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-06-04 09:06:16 -04:00
Charles Bourque	b7bdf89d37	Merge pull request #218 from stephb9959/main [WIFI-13803] Added fingerprint column to wifi analysis	2024-06-04 08:56:08 -04:00
Charles	849ea9f7b2	[WIFI-13803] Added fingerprint column to wifi analysis Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-06-04 08:55:35 -04:00
Charles Bourque	bd737ef563	Merge pull request #216 from stephb9959/main [WIFI-13515] Supporting deviceTypes in lowercase	2024-03-15 17:53:25 +01:00
Charles	e250bd38f8	[WIFI-13515] Supporting deviceTypes in lowercase Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-03-15 17:51:59 +01:00
Charles Bourque	7083da702a	Merge pull request #215 from stephb9959/main [WIFI-13515] Supporting deviceTypes in lowercase	2024-03-15 17:23:33 +01:00
Charles	3d01c20339	[WIFI-13515] Supporting deviceTypes in lowercase Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-03-15 17:22:28 +01:00
Charles Bourque	3b74649206	Merge pull request #214 from stephb9959/main [WIFI-13455] New Edgecore switch images	2024-03-04 11:21:29 +01:00
Charles	a10f0c992e	[WIFI-13455] New Edgecore switch images Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-03-04 11:17:46 +01:00
Charles Bourque	32974620c4	Merge pull request #213 from stephb9959/main [WIFI-13446] Port tables not showing all ports	2024-02-27 16:43:02 +01:00
Charles	0781e3ad8e	[WIFI-13446] Port tables not showing all ports Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-02-27 16:42:32 +01:00
Carsten Schafer	0ce107eea0	Merge pull request #212 from Telecominfraproject/WIFI-13357-Be-able-to-set-ingressClassName-for-all-the-component-helm-charts-as-the-annotation-is-no-longer-supported Set ingress class name if requested	2024-02-11 09:41:58 -05:00
Carsten Schafer	73e3efd92f	Set ingress class name if requested Signed-off-by: Carsten Schafer <Carsten.Schafer@kinarasystems.com>	2024-02-09 15:29:11 -05:00
Charles Bourque	69bff8d8fe	Merge pull request #211 from stephb9959/main [WIFI-13380] Cybertan model images	2024-02-06 15:53:56 +01:00
Charles	22b223f82f	[WIFI-13380] Cybertan model images Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-02-06 15:53:04 +01:00
Charles Bourque	7b0d43c8b8	Merge pull request #210 from stephb9959/main [WIFI-13380] Cybertan model images	2024-02-06 09:50:27 +01:00
Charles	7c64fb7a11	[WIFI-13380] Cybertan model images Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-02-06 09:49:55 +01:00
Charles Bourque	61f8b69f02	Merge pull request #209 from stephb9959/main [WIFI-13317] New CIG and Edgecore pictures	2024-01-17 09:39:56 +01:00
Charles	c32fedeb4c	[WIFI-13317] New CIG and Edgecore pictures Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-17 09:39:25 +01:00
Charles Bourque	4ba3bed742	Merge pull request #208 from stephb9959/main [WIFI-13315] Wi-Fi analysis fixes	2024-01-16 19:17:52 +01:00
Charles	810318b584	[WIFI-13315] Wi-Fi analysis fixes Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-16 19:17:03 +01:00
Charles Bourque	863fda3ef3	Merge pull request #207 from stephb9959/main [WIFI-13281] Add support for OLS	2024-01-11 12:58:05 -05:00
Charles	deb7715ea1	[WIFI-13282] Add support for OLS Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-11 12:57:27 -05:00
Charles	adaebb17e7	[WIFI-13282] Add support for OLS Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-11 12:56:20 -05:00
Charles Bourque	e3f6ab43ff	Merge pull request #206 from stephb9959/main [WIFI-13256] Now displaying warnings if a device is blacklisted	2024-01-04 14:12:15 -05:00
Charles	cf977b7612	[WIFI-13256] Now displaying warnings if a device is blacklisted Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-04 14:11:02 -05:00
Charles Bourque	fedb60fc8f	Merge pull request #205 from stephb9959/main [WIFI-13257] Fixed configure notification when command is pending	2024-01-02 12:55:50 -05:00
Charles	f8ddf88b8c	[WIFI-13257] Fixed configure notification when command is pending Signed-off-by: Charles <charles.bourque96@gmail.com>	2024-01-02 12:55:19 -05:00
Charles Bourque	301581da63	Merge pull request #204 from stephb9959/main [WIFI-11925] Fixed firmware upgrade result handling	2023-12-18 12:52:25 -05:00
Charles	88cb945760	[WIFI-11925] Fixed firmware upgrade result handling Signed-off-by: Charles <charles.bourque96@gmail.com>	2023-12-18 12:51:57 -05:00
Charles Bourque	c61d0052a9	Merge pull request #203 from stephb9959/main [WIFI-13170] Advanced system page	2023-12-04 17:34:07 +00:00
Charles	147c3a1153	[WIFI-13170] Advanced system page Signed-off-by: Charles <charles.bourque96@gmail.com>	2023-12-04 17:32:46 +00:00
				`@@ -1 +0,0 @@`
				`VITE_UCENTRALSEC_URL="https://ucentral.dpaas.arilia.com:16001"`