docs: new structure (#1282)

Co-authored-by: Sébastien Chopin <seb@nuxt.com>

docs/error.vue

@@ -1,5 +1,7 @@
 <template>
   <div>
+    <NuxtLoadingIndicator />
+
     <Header :links="links" />
 
     <UContainer>
@@ -11,7 +13,7 @@
     </UContainer>
 
     <ClientOnly>
-      <LazyUDocsSearch :files="files" :navigation="navigation" :links="links" />
+      <LazyUDocsSearch :files="files" :navigation="navigation" :links="links" :fuse="{ resultLimit: 1000 }" />
     </ClientOnly>
 
     <UNotifications />
@@ -31,6 +33,7 @@ defineProps<{
   error: NuxtError
 }>()
 
+const route = useRoute()
 const { branch } = useContentSource()
 
 const { data: nav } = await useAsyncData('navigation', () => fetchContentNavigation())
@@ -44,49 +47,34 @@ const navigation = computed(() => {
     const pro = nav.value.find(item => item._path === '/pro')
 
     return [
-      ...(pro ? [pro] : []),
-      ...dev
+      ...dev,
+      ...(pro ? [pro] : [])
     ]
   }
 
-  return nav.value?.filter(item => item._path !== '/dev') || []
+  return nav.value.filter(item => item._path !== '/dev')
 })
 
 const links = computed(() => {
   return [{
-    label: 'Documentation',
+    label: 'Docs',
     icon: 'i-heroicons-book-open',
-    to: `${branch.value?.name === 'dev' ? '/dev' : ''}/getting-started`
-  }, {
-    label: 'Playground',
-    icon: 'i-simple-icons-stackblitz',
-    to: '/playground'
-  }, {
-    label: 'Roadmap',
-    icon: 'i-heroicons-academic-cap',
-    to: '/roadmap'
-  }, !!navigation.value.find(item => item._path === '/pro') && {
+    to: branch.value?.name === 'dev' ? '/dev/getting-started' : '/getting-started',
+    active: branch.value?.name === 'dev' ? (route.path.startsWith('/dev/getting-started') || route.path.startsWith('/dev/components')) : (route.path.startsWith('/getting-started') || route.path.startsWith('/components'))
+  }, ...(navigation.value.find(item => item._path === '/pro') ? [{
     label: 'Pro',
     icon: 'i-heroicons-square-3-stack-3d',
     to: '/pro',
-    children: [{
-      label: 'Features',
-      to: '/pro',
-      exact: true,
-      icon: 'i-heroicons-beaker',
-      description: 'Discover all the features of Nuxt UI Pro.'
-    }, {
-      label: 'Guide',
-      to: '/pro/guide',
-      icon: 'i-heroicons-book-open',
-      description: 'Learn how to use Nuxt UI Pro in your app.'
-    }, {
-      label: 'Components',
-      to: '/pro/components',
-      icon: 'i-heroicons-cube-transparent',
-      description: 'Discover all the components available in Nuxt UI Pro.'
-    }]
+    active: route.path.startsWith('/pro/getting-started') || route.path.startsWith('/pro/components')
   }, {
+    label: 'Pricing',
+    icon: 'i-heroicons-credit-card',
+    to: '/pro/pricing'
+  }, {
+    label: 'Templates',
+    icon: 'i-heroicons-computer-desktop',
+    to: '/pro/templates'
+  }] : []), {
     label: 'Releases',
     icon: 'i-heroicons-rocket-launch',
     to: '/releases'