refactor: amélioration de la Sidebar.vue avec suppression de MenuItem.vue et mise à jour de MenuGroup.vue pour une gestion simplifiée des éléments de menu

assets/vue/app/shared/components/layout/sidebar/MenuGroup.vue

@@ -14,9 +14,12 @@
                 }">
                 <div class="flex items-center flex-grow">
                     <component :is="icon" class="w-5 h-5 mr-3" />
-                    <span>{{ text }}</span>
+                    <span class="px-2">{{ text }}</span>
                 </div>
-                <component :is="expanded ? ChevronUpIcon : ChevronDownIcon" class="w-4 h-4" />
+                <component
+                    v-if="subItems.length > 0"
+                    :is="expanded ? ChevronUpIcon : ChevronDownIcon"
+                    class="w-4 h-4" />
             </RouterLink>
         </div>
 
@@ -32,7 +35,7 @@
 </template>
 
 <script setup>
-    import { ref, watch } from 'vue';
+    import { ref, watch, computed } from 'vue';
     import { useRoute } from 'vue-router';
     import { ChevronDownIcon, ChevronUpIcon } from '@heroicons/vue/24/outline';
     import SubMenuItem from './SubMenuItem.vue';
@@ -58,10 +61,6 @@
         subItems: {
             type: Array,
             default: () => []
-        },
-        isActive: {
-            type: Boolean,
-            required: true
         }
     });
 
@@ -69,6 +68,19 @@
     const expanded = ref(false);
     const route = useRoute();
 
+    
+    const isActive = computed(() => {
+        if (!props.to) {
+            return props.subItems?.some(subItem => route.path === subItem.to) || false;
+        }
+
+        if (props.to === '/') {
+            return route.path === props.to || props.subItems.map(item => item.to).includes(route.path);
+        }
+
+        return route.path.startsWith(props.to);
+    });
+
     const isRouteMatching = path => {
         return props.subItems.some(item => path.startsWith(item.to)) || path === props.to;
     };