From 94359fcf47fd533d0e02b03adb6e78835fbc184f Mon Sep 17 00:00:00 2001
From: Lera24 <bedulinavalera21@gmail.com>
Date: Wed, 13 Nov 2024 15:08:36 +0200
Subject: [PATCH] feature: change local component on component
 wt-navigation-menu from @webitel/ui-sdk[WTEL-4710]

---
 package-lock.json                             | 401 +++++++++++++++++-
 package.json                                  |   5 +-
 .../_internals/start-category-lvl-1.vue       |  63 ---
 .../_internals/start-category-lvl-2.vue       |  71 ----
 .../start-page/components/the-start-page.vue  | 119 +-----
 .../start-page/css/_start-category.scss       |  30 --
 6 files changed, 418 insertions(+), 271 deletions(-)
 delete mode 100644 src/modules/start-page/components/_internals/start-category-lvl-1.vue
 delete mode 100644 src/modules/start-page/components/_internals/start-category-lvl-2.vue
 delete mode 100644 src/modules/start-page/css/_start-category.scss

diff --git a/package-lock.json b/package-lock.json
index eeea7b87c..1fb7d86eb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,7 @@
         "@vuelidate/validators": "^2.0.4",
         "@vueuse/core": "^11.0.3",
         "@webitel/flow-ui-sdk": "^0.1.14",
-        "@webitel/ui-sdk": "^24.10.72",
+        "@webitel/ui-sdk": "^24.10.74",
         "axios": "^1.7.7",
         "clipboard-copy": "^4.0.1",
         "cron-validator": "^1.3.1",
@@ -54,6 +54,9 @@
         "vitepress": "^1.4.3",
         "vitest": "^2.0.5",
         "vue-color": "^2.8.1"
+      },
+      "optionalDependencies": {
+        "@esbuild/linux-x64": "0.24.0"
       }
     },
     "node_modules/@algolia/autocomplete-core": {
@@ -918,6 +921,74 @@
         }
       }
     },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.21.5.tgz",
+      "integrity": "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.21.5.tgz",
+      "integrity": "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.21.5.tgz",
+      "integrity": "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@esbuild/darwin-arm64": {
       "version": "0.21.5",
       "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.21.5.tgz",
@@ -934,6 +1005,311 @@
         "node": ">=12"
       }
     },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.21.5.tgz",
+      "integrity": "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.21.5.tgz",
+      "integrity": "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.21.5.tgz",
+      "integrity": "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.21.5.tgz",
+      "integrity": "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.21.5.tgz",
+      "integrity": "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.21.5.tgz",
+      "integrity": "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.21.5.tgz",
+      "integrity": "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.21.5.tgz",
+      "integrity": "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.21.5.tgz",
+      "integrity": "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.21.5.tgz",
+      "integrity": "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.21.5.tgz",
+      "integrity": "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.24.0",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.24.0.tgz",
+      "integrity": "sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
+      "integrity": "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.21.5.tgz",
+      "integrity": "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.21.5.tgz",
+      "integrity": "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.21.5.tgz",
+      "integrity": "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.21.5.tgz",
+      "integrity": "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@floating-ui/core": {
       "version": "1.6.8",
       "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.8.tgz",
@@ -2563,9 +2939,9 @@
       }
     },
     "node_modules/@webitel/ui-sdk": {
-      "version": "24.10.72",
-      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-24.10.72.tgz",
-      "integrity": "sha512-e0BH29GlU9YTWowpA5EK7D1XchlE0ydhYj2b8JDv4w3vorPoUHSnqZ56rM9lfQfI35d7Y72Mh0izxy7AUB+pYg==",
+      "version": "24.10.74",
+      "resolved": "https://registry.npmjs.org/@webitel/ui-sdk/-/ui-sdk-24.10.74.tgz",
+      "integrity": "sha512-UYK+00UTWF62Td0unLvO+ngId5VmujTnj4B7m4U/uFRsMqSyY2o0b8LiEDV0cxPO+/bZv7Cw5Yy8ItqzEbGkpg==",
       "dependencies": {
         "@floating-ui/vue": "^1.0.1",
         "@morev/vue-transitions": "^3.0.2",
@@ -4822,6 +5198,23 @@
         "@esbuild/win32-x64": "0.21.5"
       }
     },
+    "node_modules/esbuild/node_modules/@esbuild/linux-x64": {
+      "version": "0.21.5",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.21.5.tgz",
+      "integrity": "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/escalade": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
diff --git a/package.json b/package.json
index aac438c58..7a8074428 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "@vuelidate/validators": "^2.0.4",
     "@vueuse/core": "^11.0.3",
     "@webitel/flow-ui-sdk": "^0.1.14",
-    "@webitel/ui-sdk": "^24.10.72",
+    "@webitel/ui-sdk": "^24.10.74",
     "axios": "^1.7.7",
     "clipboard-copy": "^4.0.1",
     "cron-validator": "^1.3.1",
@@ -63,5 +63,8 @@
     "vitepress": "^1.4.3",
     "vitest": "^2.0.5",
     "vue-color": "^2.8.1"
+  },
+  "optionalDependencies": {
+    "@esbuild/linux-x64": "0.24.0"
   }
 }
diff --git a/src/modules/start-page/components/_internals/start-category-lvl-1.vue b/src/modules/start-page/components/_internals/start-category-lvl-1.vue
deleted file mode 100644
index 52ea56d5b..000000000
--- a/src/modules/start-page/components/_internals/start-category-lvl-1.vue
+++ /dev/null
@@ -1,63 +0,0 @@
-<template>
-  <ul class="start-nav__category start-nav__category--lvl-1">
-    <li
-      v-for="(category, key) of categories"
-      :key="key"
-      class="start-nav__category-option__wrapper"
-    >
-      <button
-        :class="{ 'start-nav__category-option--selected': selected.value === category.value }"
-        class="start-nav__category-option start-nav__category-option--lvl-1"
-        @click="select(category)"
-      >
-        <wt-icon
-          :color="selected.value === category.value ? 'on-primary' : 'default'"
-          :icon="category.value"
-          icon-prefix="adm"
-        />
-        {{ category.name }}
-      </button>
-      <div v-show="selected.value === category.value">
-        <slot />
-      </div>
-    </li>
-  </ul>
-</template>
-
-<script>
-export default {
-  name: 'StartCategoryLvl1',
-  props: {
-    categories: {
-      type: Array,
-      default: () => [],
-    },
-    selected: {
-      type: Object,
-      default: () => ({}),
-    },
-  },
-  methods: {
-    select(category) {
-      this.$emit('select', category);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-@import '../../css/start-category';
-
-.start-nav__category-option--lvl-1 {
-  background: var(--lvl-1-bg);
-
-  &:hover {
-    background: var(--lvl-1-bg--hover);
-  }
-
-  &.start-nav__category-option--selected {
-    color: var(--lvl-1-text--selected);
-    background: var(--lvl-1-bg--selected);
-  }
-}
-</style>
diff --git a/src/modules/start-page/components/_internals/start-category-lvl-2.vue b/src/modules/start-page/components/_internals/start-category-lvl-2.vue
deleted file mode 100644
index 802ad1a47..000000000
--- a/src/modules/start-page/components/_internals/start-category-lvl-2.vue
+++ /dev/null
@@ -1,71 +0,0 @@
-<template>
-  <ul class="start-nav__category start-nav__category--lvl-2">
-    <li
-      v-for="(category, key) of categories"
-      :key="key"
-      class="
-            start-nav__category-option__wrapper
-            start-nav__category-option
-            start-nav__category-option--lvl-2
-          "
-    >
-      <span class="start-nav__category-indicator" />
-      <router-link
-        :to="category.route"
-        class="start-nav__link"
-      >
-        {{ category.name }}
-      </router-link>
-    </li>
-  </ul>
-</template>
-
-<script>
-export default {
-  name: 'StartCategoryLvl2',
-  props: {
-    categories: {
-      type: Array,
-      default: () => [],
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-@import '../../css/start-category';
-
-.start-nav__category--lvl-2 {
-  @extend %wt-scrollbar;
-  overflow-y: scroll;
-}
-
-.start-nav__category-option--lvl-2 {
-  .start-nav__category-indicator {
-    position: relative;
-    display: block;
-    width: 24px;
-    height: 24px;
-
-    &:after {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      width: 4px;
-      height: 4px;
-      content: '';
-      transform: translate(-50%, -50%);
-      border-radius: 50%;
-      background: var(--text-main-color);
-    }
-  }
-}
-
-.start-nav__link {
-  color: var(--text-main-color);
-}
-
-.start-nav__link:hover, .start-nav__link:active {
-  text-decoration: underline;
-}
-</style>
diff --git a/src/modules/start-page/components/the-start-page.vue b/src/modules/start-page/components/the-start-page.vue
index 202120efa..20a0769b9 100644
--- a/src/modules/start-page/components/the-start-page.vue
+++ b/src/modules/start-page/components/the-start-page.vue
@@ -1,116 +1,31 @@
 <template>
-  <section class="start-nav">
-    <article class="start-nav__wrapper">
-      <category-lvl-1
-        :categories="categories"
-        :selected="selected"
-        @select="select"
-      >
-        <category-lvl-2
-          :categories="subcategories"
-          class="d-none d-block-xs"
-        />
-      </category-lvl-1>
-      <category-lvl-2
-        :categories="subcategories"
-        class="d-none-xs"
-      />
-    </article>
-  </section>
+  <wt-navigation-menu
+    :nav="nav"
+    :icons="icons" />
 </template>
 
 <script>
 import navMixin from '../../../app/mixins/navMixin';
-import CategoryLvl1 from './_internals/start-category-lvl-1.vue';
-import CategoryLvl2 from './_internals/start-category-lvl-2.vue';
+import directoryIcon from '../../../app/assets/icons/sprite/adm-directory.svg';
+import integrationsIcon from '../../../app/assets/icons/sprite/adm-integrations.svg';
+import lookupsIcon from '../../../app/assets/icons/sprite/adm-lookups.svg';
+import routingIcon from '../../../app/assets/icons/sprite/adm-routing.svg';
+import systemIcon from '../../../app/assets/icons/sprite/adm-system.svg';
+import permissionsIcon from '../../../app/assets/icons/sprite/adm-permissions.svg';
+import contactCenterIcon from '../../../app/assets/icons/sprite/adm-contact-center.svg';
+
+const ICONS = [directoryIcon, integrationsIcon, lookupsIcon, routingIcon, systemIcon, permissionsIcon, contactCenterIcon];
 
 export default {
   name: 'TheStartPage',
-  components: { CategoryLvl1, CategoryLvl2 },
   mixins: [navMixin],
-  data: () => ({
-    selected: {},
-  }),
-
-  computed: {
-    categories() {
-      return this.nav;
-    },
-    subcategories() {
-      if (!this.selected.subNav) return [];
-      return this.selected.subNav.map((subNav) => {
-        const route = `${this.selected.route}/${subNav.route}`;
-        return {
-          ...subNav,
-          route,
-        };
-      });
-    },
+  data() {
+    return {
+      icons: ICONS,
+    };
   },
-
-  mounted() {
-    this.initSelected();
-  },
-
-  methods: {
-    initSelected() {
-      this.select(this.categories[0]);
-    },
-    select(category) {
-      this.selected = category;
-    },
-  },
-};
+}
 </script>
 
 <style lang="scss" scoped>
-.start-nav {
-  --button-min-height: 60px;
-  --wrapper-width: 60%;
-  --wrapper-height: calc(
-    var(--spacing-sm) * 2
-    + var(--button-min-height) * 7
-    + var(--spacing-2xs) * 6
-  );
-
-  --lvl-1-bg: var(--dp-18-surface-color);
-  --lvl-1-bg--hover: var(--dp-20-surface-color);
-  --lvl-1-bg--selected: var(--primary-color);
-  --lvl-1-text--selected: var(--primary-on-color);
-
-  @media (#{$media} and #{$media-width-sm}) {
-    --wrapper-width: 80%;
-  }
-
-  @media (#{$media} and #{$media-width-xs}) {
-    --wrapper-width: 100%;
-    --wrapper-height: 100%;
-  }
-}
-
-.start-nav {
-  display: flex;
-  align-items: center;
-  flex-grow: 1;
-  justify-content: center;
-}
-
-.start-nav__wrapper {
-  @extend %wt-scrollbar;
-
-  display: grid;
-  box-sizing: border-box;
-  width: var(--wrapper-width);
-  height: var(--wrapper-height);
-  margin: auto;
-  padding: var(--spacing-sm);
-  border-radius: var(--border-radius);
-  background: var(--dp-20-surface-color);
-  grid-template-columns: repeat(2, 1fr);
-  grid-gap: var(--spacing-sm);
-
-  @media (#{$media} and #{$media-width-xs}) {
-    grid-template-columns: 1fr;
-  }
-}
 </style>
diff --git a/src/modules/start-page/css/_start-category.scss b/src/modules/start-page/css/_start-category.scss
deleted file mode 100644
index a7036b37e..000000000
--- a/src/modules/start-page/css/_start-category.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-
-.start-nav__category {
-  box-sizing: border-box;
-  height: 100%;
-  border-radius: var(--border-radius);
-}
-
-.start-nav__category-option__wrapper {
-  &:not(:last-child) {
-    margin-bottom: var(--spacing-2xs);
-  }
-}
-
-.start-nav__category-option {
-  @extend %typo-body-1;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  width: 100%;
-  min-height: var(--button-min-height);
-  padding: 18px 20px;
-  transition: var(--transition);
-  text-align: left;
-  color: var(--text-main-color);
-  border-radius: var(--border-radius);
-
-  .wt-icon {
-    margin-right: var(--spacing-xs);
-  }
-}