Prepare release 3.2.0

aleksis/core/frontend/components/app/SideNav.vue

@@ -18,16 +18,24 @@
       <v-list-item v-if="checkPermission('core.search_rule')" class="search">
         <sidenav-search />
       </v-list-item>
-      <v-list-item-group :value="$route.name" v-if="sideNavMenu">
+      <v-list-item-group
+        :value="$route.matched"
+        :value-comparator="comparator"
+        v-if="sideNavMenu"
+        color="primary"
+      >
         <div v-for="menuItem in sideNavMenu" :key="menuItem.name">
           <v-list-group
             v-if="menuItem.subMenu.length > 0"
             href="#!"
-            :prepend-icon="menuItem.icon"
+            :prepend-icon="
+              $route.matched.some((route) => route.name === menuItem.name) &&
+              menuItem.iconActive
+                ? menuItem.iconActive
+                : menuItem.icon
+            "
             :value="
-              $route.matched.slice(-2).shift()
-                ? $route.matched.slice(-2).shift().name === menuItem.name
-                : false
+              $route.matched.some((route) => route.name === menuItem.name)
             "
           >
             <template #activator>
@@ -41,14 +49,23 @@
             </template>
             <v-list-item
               v-for="subMenuItem in menuItem.subMenu"
-              exact
+              :exact="subMenuItem.exact"
               :to="{ name: subMenuItem.name }"
               :target="subMenuItem.newTab ? '_blank' : '_self'"
               :key="subMenuItem.name"
-              :value="subMenuItem.name"
+              class="ps-4"
             >
               <v-list-item-icon>
-                <v-icon v-if="subMenuItem.icon">{{ subMenuItem.icon }} </v-icon>
+                <v-icon
+                  v-if="
+                    subMenuItem.iconActive && $route.name === subMenuItem.name
+                  "
+                >
+                  {{ subMenuItem.iconActive }}
+                </v-icon>
+                <v-icon v-else-if="subMenuItem.icon">
+                  {{ subMenuItem.icon }}
+                </v-icon>
               </v-list-item-icon>
               <v-list-item-title
                 >{{
@@ -61,13 +78,20 @@
           </v-list-group>
           <v-list-item
             v-else
-            exact
+            :exact="menuItem.exact"
             :to="{ name: menuItem.name }"
             :target="menuItem.newTab ? '_blank' : '_self'"
-            :value="menuItem.name"
           >
             <v-list-item-icon>
-              <v-icon v-if="menuItem.icon">{{ menuItem.icon }}</v-icon>
+              <v-icon
+                v-if="
+                  menuItem.iconActive &&
+                  $route.matched.some((route) => route.name === menuItem.name)
+                "
+              >
+                {{ menuItem.iconActive }}
+              </v-icon>
+              <v-icon v-else-if="menuItem.icon">{{ menuItem.icon }}</v-icon>
             </v-list-item-icon>
             <v-list-item-title>{{
               !menuItem.rawTitleString
@@ -118,6 +142,11 @@ export default {
   mounted() {
     this.addPermissions(["core.search_rule"]);
   },
+  methods: {
+    comparator(array, value) {
+      return Array.isArray(array) && array.includes(value);
+    },
+  },
 };
 </script>