menu updates

Author: connorabbas

resources/js/components/primevue/menu/Breadcrumb.vue

@@ -2,11 +2,11 @@
 import { ref, useTemplateRef } from 'vue';
 import Breadcrumb, { type BreadcrumbPassThroughOptions, type BreadcrumbProps } from 'primevue/breadcrumb';
 import { ChevronRight } from 'lucide-vue-next';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedBreadcrumbProps extends Omit<BreadcrumbProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = defineProps<ExtendedBreadcrumbProps>();
 

resources/js/components/primevue/menu/ContextMenu.vue

@@ -2,11 +2,11 @@
 import { useTemplateRef } from 'vue';
 import ContextMenu, { type ContextMenuProps } from 'primevue/contextmenu';
 import { ChevronRight } from 'lucide-vue-next';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedContextMenuProps extends Omit<ContextMenuProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = defineProps<ExtendedContextMenuProps>();
 

resources/js/components/primevue/menu/Menu.vue

@@ -1,11 +1,11 @@
 <script setup lang="ts">
 import { useTemplateRef } from 'vue';
 import Menu, { type MenuProps } from 'primevue/menu';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedMenuProps extends Omit<MenuProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = defineProps<ExtendedMenuProps>();
 

resources/js/components/primevue/menu/Menubar.vue

@@ -2,11 +2,11 @@
 import { useTemplateRef } from 'vue';
 import Menubar, { type MenubarProps } from 'primevue/menubar';
 import { ChevronDown, ChevronRight } from 'lucide-vue-next';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedMenubarProps extends Omit<MenubarProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = withDefaults(
     defineProps<ExtendedMenubarProps>(),

resources/js/components/primevue/menu/PanelMenu.vue

@@ -2,11 +2,11 @@
 import { useTemplateRef } from 'vue';
 import PanelMenu, { type PanelMenuPassThroughOptions, type PanelMenuProps } from 'primevue/panelmenu';
 import { ChevronDown, ChevronRight } from 'lucide-vue-next';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedPanelMenuProps extends Omit<PanelMenuProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = defineProps<ExtendedPanelMenuProps>();
 

resources/js/components/primevue/menu/TabMenu.vue

@@ -5,11 +5,11 @@ import { route } from 'ziggy-js';
 import Tabs from 'primevue/tabs';
 import TabList, { type TabListProps } from 'primevue/tablist';
 import Tab from 'primevue/tab';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedTabListProps extends Omit<TabListProps, 'items'> {
-    items: ExtendedMenuItem[];
+    items: MenuItem[];
 }
 const componentProps = defineProps<ExtendedTabListProps>();
 

resources/js/components/primevue/menu/TieredMenu.vue

@@ -2,11 +2,11 @@
 import { useTemplateRef } from 'vue';
 import TieredMenu, { type TieredMenuProps } from 'primevue/tieredmenu';
 import { ChevronRight } from 'lucide-vue-next';
-import type { ExtendedMenuItem } from '@/types';
+import type { MenuItem } from '@/types';
 import { ptViewMerge } from '@/utils';
 
 interface ExtendedTieredMenuProps extends Omit<TieredMenuProps, 'model'> {
-    model: ExtendedMenuItem[];
+    model: MenuItem[];
 }
 const componentProps = defineProps<ExtendedTieredMenuProps>();
 

resources/js/composables/useAppLayout.ts

@@ -2,7 +2,7 @@ import { ref, computed, onMounted, onUnmounted, watchEffect } from 'vue';
 import { usePage, useForm } from '@inertiajs/vue3';
 import { route } from 'ziggy-js';
 import { LayoutGrid, House, Info, Github, Code, Settings, LogOut, BookOpen } from 'lucide-vue-next';
-import { ExtendedMenuItem } from '@/types';
+import { MenuItem } from '@/types';
 
 export function useAppLayout() {
     const page = usePage();
@@ -15,7 +15,7 @@ export function useAppLayout() {
     });
 
     // Menu items
-    const menuItems = computed<ExtendedMenuItem[]>(() => [
+    const menuItems = computed<MenuItem[]>(() => [
         {
             label: 'Home',
             lucideIcon: House,
@@ -56,7 +56,7 @@ export function useAppLayout() {
     const logout = () => {
         logoutForm.post(route('logout'));
     };
-    const userMenuItems: ExtendedMenuItem[] = [
+    const userMenuItems: MenuItem[] = [
         {
             label: 'Settings',
             route: route('profile.edit'),

resources/js/types/index.d.ts

@@ -1,6 +1,6 @@
 import type { DataTableFilterMetaData } from 'primevue';
 import type { Page, PageProps, Errors } from '@inertiajs/core';
-import type { MenuItem } from 'primevue/menuitem';
+import type { MenuItem as PrimeVueMenuItem } from 'primevue/menuitem';
 import type { LucideIcon } from 'lucide-vue-next';
 
 export interface User {
@@ -18,9 +18,10 @@ export type PrimeVueDataFilters = {
     [key: string]: DataTableFilterMetaData;
 };
 
-export interface ExtendedMenuItem extends MenuItem {
+export interface MenuItem extends PrimeVueMenuItem {
     route?: string;
     lucideIcon?: LucideIcon;
+    active?: boolean;
 }
 
 export interface InertiaRouterFetchCallbacks {