diff --git a/frontend/src/components/Layout.jsx b/frontend/src/components/Layout.jsx
index e6f7f6b..f6f2399 100644
--- a/frontend/src/components/Layout.jsx
+++ b/frontend/src/components/Layout.jsx
@@ -369,76 +369,78 @@ const Layout = ({ children }) => {
 											{item.section}
 										</h3>
 										<div className="space-y-1">
-											{item.items.map((subItem) => (
-												<div key={subItem.name}>
-													{subItem.name === "Hosts" && canManageHosts() ? (
-														// Special handling for Hosts item with integrated + button (mobile)
-														<Link
-															to={subItem.href}
-															className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
-																isActive(subItem.href)
-																	? "bg-primary-100 text-primary-900"
-																	: "text-secondary-600 hover:bg-secondary-50 hover:text-secondary-900"
-															}`}
-															onClick={() => setSidebarOpen(false)}
-														>
-															<subItem.icon className="mr-3 h-5 w-5" />
-															<span className="flex items-center gap-2 flex-1">
-																{subItem.name}
-																{subItem.name === "Hosts" &&
-																	stats?.cards?.totalHosts !== undefined && (
-																		<span className="ml-2 inline-flex items-center justify-center px-1.5 py-0.5 text-xs rounded bg-secondary-100 text-secondary-700">
-																			{stats.cards.totalHosts}
-																		</span>
-																	)}
-															</span>
-															<button
-																type="button"
-																onClick={(e) => {
-																	e.preventDefault();
-																	setSidebarOpen(false);
-																	handleAddHost();
-																}}
-																className="ml-auto flex items-center justify-center w-5 h-5 rounded-full border-2 border-current opacity-60 hover:opacity-100 transition-all duration-200 self-center"
-																title="Add Host"
+											{item.items
+												.filter((subItem) => !subItem.comingSoon)
+												.map((subItem) => (
+													<div key={subItem.name}>
+														{subItem.name === "Hosts" && canManageHosts() ? (
+															// Special handling for Hosts item with integrated + button (mobile)
+															<Link
+																to={subItem.href}
+																className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
+																	isActive(subItem.href)
+																		? "bg-primary-100 text-primary-900"
+																		: "text-secondary-600 hover:bg-secondary-50 hover:text-secondary-900"
+																}`}
+																onClick={() => setSidebarOpen(false)}
 															>
-																<Plus className="h-3 w-3" />
-															</button>
-														</Link>
-													) : (
-														// Standard navigation item (mobile)
-														<Link
-															to={subItem.href}
-															className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
-																isActive(subItem.href)
-																	? "bg-primary-100 dark:bg-primary-600 text-primary-900 dark:text-white"
-																	: "text-secondary-600 dark:text-secondary-300 hover:bg-secondary-50 dark:hover:bg-secondary-700 hover:text-secondary-900 dark:hover:text-white"
-															} ${subItem.comingSoon ? "opacity-50 cursor-not-allowed" : ""}`}
-															onClick={
-																subItem.comingSoon
-																	? (e) => e.preventDefault()
-																	: () => setSidebarOpen(false)
-															}
-														>
-															<subItem.icon className="mr-3 h-5 w-5" />
-															<span className="flex items-center gap-2">
-																{subItem.name}
-																{subItem.name === "Hosts" &&
-																	stats?.cards?.totalHosts !== undefined && (
-																		<span className="ml-2 inline-flex items-center justify-center px-1.5 py-0.5 text-xs rounded bg-secondary-100 dark:bg-secondary-600 text-secondary-700 dark:text-secondary-200">
-																			{stats.cards.totalHosts}
+																<subItem.icon className="mr-3 h-5 w-5" />
+																<span className="flex items-center gap-2 flex-1">
+																	{subItem.name}
+																	{subItem.name === "Hosts" &&
+																		stats?.cards?.totalHosts !== undefined && (
+																			<span className="ml-2 inline-flex items-center justify-center px-1.5 py-0.5 text-xs rounded bg-secondary-100 text-secondary-700">
+																				{stats.cards.totalHosts}
+																			</span>
+																		)}
+																</span>
+																<button
+																	type="button"
+																	onClick={(e) => {
+																		e.preventDefault();
+																		setSidebarOpen(false);
+																		handleAddHost();
+																	}}
+																	className="ml-auto flex items-center justify-center w-5 h-5 rounded-full border-2 border-current opacity-60 hover:opacity-100 transition-all duration-200 self-center"
+																	title="Add Host"
+																>
+																	<Plus className="h-3 w-3" />
+																</button>
+															</Link>
+														) : (
+															// Standard navigation item (mobile)
+															<Link
+																to={subItem.href}
+																className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
+																	isActive(subItem.href)
+																		? "bg-primary-100 dark:bg-primary-600 text-primary-900 dark:text-white"
+																		: "text-secondary-600 dark:text-secondary-300 hover:bg-secondary-50 dark:hover:bg-secondary-700 hover:text-secondary-900 dark:hover:text-white"
+																} ${subItem.comingSoon ? "opacity-50 cursor-not-allowed" : ""}`}
+																onClick={
+																	subItem.comingSoon
+																		? (e) => e.preventDefault()
+																		: () => setSidebarOpen(false)
+																}
+															>
+																<subItem.icon className="mr-3 h-5 w-5" />
+																<span className="flex items-center gap-2">
+																	{subItem.name}
+																	{subItem.name === "Hosts" &&
+																		stats?.cards?.totalHosts !== undefined && (
+																			<span className="ml-2 inline-flex items-center justify-center px-1.5 py-0.5 text-xs rounded bg-secondary-100 dark:bg-secondary-600 text-secondary-700 dark:text-secondary-200">
+																				{stats.cards.totalHosts}
+																			</span>
+																		)}
+																	{subItem.comingSoon && (
+																		<span className="text-xs bg-secondary-100 dark:bg-secondary-600 text-secondary-600 dark:text-secondary-200 px-1.5 py-0.5 rounded">
+																			Soon
 																		</span>
 																	)}
-																{subItem.comingSoon && (
-																	<span className="text-xs bg-secondary-100 dark:bg-secondary-600 text-secondary-600 dark:text-secondary-200 px-1.5 py-0.5 rounded">
-																		Soon
-																	</span>
-																)}
-															</span>
-														</Link>
-													)}
-												</div>
-											))}
+																</span>
+															</Link>
+														)}
+													</div>
+												))}
 										</div>
 									</div>
 								);
@@ -453,26 +455,28 @@ const Layout = ({ children }) => {
 								return (
 									<div key={item.section}>
 										<div className="space-y-1">
-											{item.items.map((subItem) => (
-												<Link
-													key={subItem.name}
-													to={subItem.href}
-													className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
-														isActive(subItem.href)
-															? "bg-primary-100 dark:bg-primary-600 text-primary-900 dark:text-white"
-															: "text-secondary-600 dark:text-secondary-300 hover:bg-secondary-50 dark:hover:bg-secondary-700 hover:text-secondary-900 dark:hover:text-white"
-													}`}
-													onClick={() => setSidebarOpen(false)}
-												>
-													<subItem.icon className="mr-3 h-5 w-5" />
-													<span className="flex items-center gap-2">
-														{subItem.name}
-														{subItem.showUpgradeIcon && (
-															<UpgradeNotificationIcon className="h-3 w-3" />
-														)}
-													</span>
-												</Link>
-											))}
+											{item.items
+												.filter((subItem) => !subItem.comingSoon)
+												.map((subItem) => (
+													<Link
+														key={subItem.name}
+														to={subItem.href}
+														className={`group flex items-center px-2 py-2 text-sm font-medium rounded-md ${
+															isActive(subItem.href)
+																? "bg-primary-100 dark:bg-primary-600 text-primary-900 dark:text-white"
+																: "text-secondary-600 dark:text-secondary-300 hover:bg-secondary-50 dark:hover:bg-secondary-700 hover:text-secondary-900 dark:hover:text-white"
+														}`}
+														onClick={() => setSidebarOpen(false)}
+													>
+														<subItem.icon className="mr-3 h-5 w-5" />
+														<span className="flex items-center gap-2">
+															{subItem.name}
+															{subItem.showUpgradeIcon && (
+																<UpgradeNotificationIcon className="h-3 w-3" />
+															)}
+														</span>
+													</Link>
+												))}
 										</div>
 									</div>
 								);