Merge pull request #46370 from nextcloud/refactor/app-menu

refactor: split app menu into smaller components

2 files changed, 6 insertions, 24 deletions

diff --git a/apps/theming/src/components/UserAppMenuSection.vue b/apps/theming/src/components/UserAppMenuSection.vue
index b3d9d9f7694..56abd357274 100644
--- a/apps/theming/src/components/UserAppMenuSection.vue
+++ b/apps/theming/src/components/UserAppMenuSection.vue
@@ -33,6 +33,7 @@
 
 <script lang="ts">
 import type { IApp } from './AppOrderSelector.vue'
+import type { INavigationEntry } from '../../../../core/src/types/navigation.d.ts'
 
 import { showError } from '@nextcloud/dialogs'
 import { loadState } from '@nextcloud/initial-state'
@@ -47,26 +48,6 @@ import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcNoteCard from '@nextcloud/vue/dist/Components/NcNoteCard.js'
 import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
 
-/** See NavigationManager */
-interface INavigationEntry {
-	/** Navigation id */
-	id: string
-	/** Order where this entry should be shown */
-	order: number
-	/** Target of the navigation entry */
-	href: string
-	/** The icon used for the naviation entry */
-	icon: string
-	/** Type of the navigation entry ('link' vs 'settings') */
-	type: 'link' | 'settings'
-	/** Localized name of the navigation entry */
-	name: string
-	/** Whether this is the default app */
-	default?: boolean
-	/** App that registered this navigation entry (not necessarly the same as the id) */
-	app?: string
-}
-
 /** The app order user setting */
 type IAppOrder = Record<string, { order: number, app?: string }>
 
@@ -98,7 +79,7 @@ export default defineComponent({
 		/**
 		 * Array of all available apps, it is set by a core controller for the app menu, so it is always available
 		 */
-		 const initialAppOrder = Object.values(loadState<Record<string, INavigationEntry>>('core', 'apps'))
+		 const initialAppOrder = loadState<INavigationEntry[]>('core', 'apps')
 			.filter(({ type }) => type === 'link')
 			.map((app) => ({ ...app, label: app.name, default: app.default && app.app === enforcedDefaultApp }))
 
diff --git a/apps/theming/src/components/admin/AppMenuSection.vue b/apps/theming/src/components/admin/AppMenuSection.vue
index 2bcb6903bdc..fb8fdc67f98 100644
--- a/apps/theming/src/components/admin/AppMenuSection.vue
+++ b/apps/theming/src/components/admin/AppMenuSection.vue
@@ -30,6 +30,8 @@
 </template>
 
 <script lang="ts">
+import type { INavigationEntry } from '../../../../../core/src/types/navigation'
+
 import { showError } from '@nextcloud/dialogs'
 import { loadState } from '@nextcloud/initial-state'
 import { translate as t } from '@nextcloud/l10n'
@@ -75,9 +77,8 @@ export default defineComponent({
 		/**
 		 * All enabled apps which can be navigated
 		 */
-		const allApps = Object.values(
-			loadState<Record<string, { id: string, name?: string, icon: string }>>('core', 'apps'),
-		).map(({ id, name, icon }) => ({ label: name, id, icon }))
+		const allApps = loadState<INavigationEntry[]>('core', 'apps')
+			.map(({ id, name, icon }) => ({ label: name, id, icon }))
 
 		/**
 		 * Currently selected app, wrapps the setter