diff --git a/src/routes/VerticalLayout/Index.svelte b/src/routes/VerticalLayout/Index.svelte
index d646b390..73c7ef66 100644
--- a/src/routes/VerticalLayout/Index.svelte
+++ b/src/routes/VerticalLayout/Index.svelte
@@ -5,6 +5,10 @@
 	import { browser } from '$app/environment';
 	import Footer from './Footer.svelte';
 	import { onMount } from 'svelte';
+	import { getPluginMenu } from '$lib/services/plugin-service';
+
+	/** @type {import('$types').PluginMenuDefModel[]} */
+	let menu;
 
 	const toggleRightBar = () => {
 		if (browser) {
@@ -20,7 +24,8 @@
 		toggleRightBar();
 	};
 
-	onMount(() => {
+	onMount(async () => {
+		menu = await getPluginMenu();
 		if (browser) {
 			document.body.setAttribute('data-layout', 'vertical');
 		}
@@ -29,8 +34,9 @@
 
 <div id="layout-wrapper">
 	<Header {toggleRightBar} />
-	<Sidebar />
-
+	{#if menu}
+	<Sidebar menu={menu}/>
+	{/if}
 	<div class="main-content">
 		<div class="page-content">
 			<div class="container-fluid">
diff --git a/src/routes/VerticalLayout/Sidebar.svelte b/src/routes/VerticalLayout/Sidebar.svelte
index d154cfe4..ff0c0945 100644
--- a/src/routes/VerticalLayout/Sidebar.svelte
+++ b/src/routes/VerticalLayout/Sidebar.svelte
@@ -6,13 +6,9 @@
 	import { page } from '$app/stores';
 	import { browser } from '$app/environment';
 	import { _ } from 'svelte-i18n'
-	import { getPluginMenu } from '$lib/services/plugin-service';
 
 	/** @type {import('$types').PluginMenuDefModel[]} */
-	let menu = [];
-	onMount(async () => {
-        menu = await getPluginMenu();
-    });
+	export let menu
 
 	// after routing complete call afterUpdate function
 	afterUpdate(() => {
@@ -57,7 +53,7 @@
 		}
 	};
 
-	onMount(() => {
+	onMount(async () => {
 		const menuElement = document.querySelector('#vertical-menu');
 		OverlayScrollbars(menuElement, options);
 		activeMenu();