fix: update navigation links to use clean URLs and close mobile menu on click

- Removed hash-based routing (/#/) in favor of clean URL paths across all navigation links
- Added onClick handlers to close mobile menu when navigation items are clicked
This commit is contained in:
2025-11-07 17:49:20 +01:00
parent 2b5f20f1e9
commit 1f267b057d
2 changed files with 19 additions and 15 deletions

View File

@@ -9,10 +9,10 @@ import { Dialog } from '@headlessui/react'
import { Bars3Icon, XMarkIcon } from '@heroicons/react/24/outline'
const cloudNavItems = [
{ name: 'Cloud', href: '/#/cloud' },
{ name: 'Compute', href: '/#/compute' },
{ name: 'Storage', href: '/#/storage' },
{ name: 'GPU', href: '/#/gpu' },
{ name: 'Cloud', href: '/cloud' },
{ name: 'Compute', href: '/compute' },
{ name: 'Storage', href: '/storage' },
{ name: 'GPU', href: '/gpu' },
]
export function Header() {
@@ -47,13 +47,13 @@ export function Header() {
items={cloudNavItems}
/>
<Link
to="/#/network"
to="/network"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"
>
Network
</Link>
<Link
to="/#/agents"
to="/agents"
className="text-base/7 tracking-tight text-gray-700 hover:text-cyan-500 transition-colors"
>
Agents
@@ -71,7 +71,7 @@ export function Header() {
>
Deploy Now
</Button>
<Button to="/#/download" variant="solid" color="cyan">
<Button to="/download" variant="solid" color="cyan">
Get Mycelium Connector
</Button>
</div>
@@ -117,19 +117,22 @@ export function Header() {
key={item.name}
to={item.href}
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
{item.name}
</Link>
))}
<Link
to="/#/network"
to="/network"
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
Network
</Link>
<Link
to="/#/agents"
to="/agents"
className="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"
onClick={() => setMobileMenuOpen(false)}
>
Agents
</Link>
@@ -142,10 +145,11 @@ export function Header() {
target="_blank"
rel="noopener noreferrer"
className="w-full"
onClick={() => setMobileMenuOpen(false)}
>
Start Deployment
</Button>
<Button to="/#/download" variant="solid" color="cyan" className="mt-4 w-full">
<Button to="/download" variant="solid" color="cyan" className="mt-4 w-full" onClick={() => setMobileMenuOpen(false)}>
Get Mycelium Connector
</Button>
</div>