✨ feat: add connections page, rename dashboard page to overview

src/hooks/use-hash-route.ts

@@ -0,0 +1,59 @@
+import { useState, useEffect, useCallback } from 'react'
+import type { NavTab } from '@/components/layout/app-sidebar'
+
+const VALID_TABS: NavTab[] = [
+  'overview',
+  'connections',
+  'routes',
+  'topology',
+  'interfaces',
+  'settings',
+]
+
+function getTabFromHash(hash: string): NavTab {
+  const cleanHash = hash.replace(/^#\/?/, '').trim().toLowerCase()
+  if (!cleanHash || cleanHash === '') {
+    return 'overview'
+  }
+  // 向后兼容旧的 dashboard hash
+  if (cleanHash === 'dashboard') {
+    return 'overview'
+  }
+  const matchingTab = VALID_TABS.find((tab) => tab === cleanHash)
+  return matchingTab || 'overview'
+}
+
+export function useHashRoute() {
+  const [currentTab, setCurrentTabState] = useState<NavTab>(() =>
+    getTabFromHash(window.location.hash)
+  )
+
+  useEffect(() => {
+    const handleHashChange = () => {
+      const newTab = getTabFromHash(window.location.hash)
+      setCurrentTabState(newTab)
+    }
+
+    // If current hash is empty, initialize with #/overview
+    if (!window.location.hash || window.location.hash === '#' || window.location.hash === '#/') {
+      window.location.hash = '#/overview'
+    } else if (window.location.hash === '#/dashboard') {
+      window.location.hash = '#/overview'
+    }
+
+    window.addEventListener('hashchange', handleHashChange)
+    return () => {
+      window.removeEventListener('hashchange', handleHashChange)
+    }
+  }, [])
+
+  const navigate = useCallback((tab: NavTab) => {
+    window.location.hash = `#/${tab}`
+    setCurrentTabState(tab)
+  }, [])
+
+  return {
+    currentTab,
+    navigate,
+  }
+}