From b3a6b861cd4a7e3c48f49aa392c91ad2e872c43b Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Wed, 2 Apr 2025 12:25:36 +0200
Subject: [PATCH] docs(app): improve links

---
 docs/app/app.vue                       |  2 +
 docs/app/composables/useLinks.ts       | 12 ++++-
 docs/app/composables/useSearchLinks.ts | 61 ++++++++++++++++++++++++++
 docs/app/error.vue                     |  2 +
 docs/app/pages/[...slug].vue           |  2 +-
 5 files changed, 77 insertions(+), 2 deletions(-)
 create mode 100644 docs/app/composables/useSearchLinks.ts

diff --git a/docs/app/app.vue b/docs/app/app.vue
index 92d4a12e..1b032819 100644
--- a/docs/app/app.vue
+++ b/docs/app/app.vue
@@ -12,6 +12,7 @@ const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSe
 })
 
 const links = useLinks()
+const searchLinks = useSearchLinks()
 const color = computed(() => colorMode.value === 'dark' ? (colors as any)[appConfig.ui.colors.neutral][900] : 'white')
 const radius = computed(() => `:root { --ui-radius: ${appConfig.theme.radius}rem; }`)
 const blackAsPrimary = computed(() => appConfig.theme.blackAsPrimary ? `:root { --ui-primary: black; } .dark { --ui-primary: white; }` : ':root {}')
@@ -64,6 +65,7 @@ provide('navigation', mappedNavigation)
 
       <ClientOnly>
         <LazyUContentSearch
+          :links="searchLinks"
           :files="files"
           :groups="[{
             id: 'framework',
diff --git a/docs/app/composables/useLinks.ts b/docs/app/composables/useLinks.ts
index fe5fcbb4..10db6815 100644
--- a/docs/app/composables/useLinks.ts
+++ b/docs/app/composables/useLinks.ts
@@ -88,6 +88,11 @@ export function useLinks() {
       description: 'Track our development progress in real-time.',
       icon: 'i-lucide-map',
       to: '/roadmap'
+    }, {
+      label: 'Contribution',
+      description: 'Learn how to contribute to Nuxt UI.',
+      icon: 'i-lucide-git-pull-request-arrow',
+      to: '/getting-started/contribution'
     }, {
       label: 'Devtools Integration',
       description: 'Integrate Nuxt UI with Nuxt Devtools with Compodium.',
@@ -106,11 +111,16 @@ export function useLinks() {
       icon: 'i-simple-icons-figma',
       to: 'https://github.com/Justineo/tempad-dev-plugin-nuxt-ui',
       target: '_blank'
+    }, {
+      label: 'Team',
+      description: 'Meet the team behind Nuxt UI.',
+      icon: 'i-lucide-users',
+      to: '/team'
     }]
   }, {
     label: 'Releases',
     icon: 'i-lucide-rocket',
     to: 'https://github.com/nuxt/ui/releases',
     target: '_blank'
-  }].filter(Boolean))
+  }])
 }
diff --git a/docs/app/composables/useSearchLinks.ts b/docs/app/composables/useSearchLinks.ts
new file mode 100644
index 00000000..0f38b3bb
--- /dev/null
+++ b/docs/app/composables/useSearchLinks.ts
@@ -0,0 +1,61 @@
+export function useSearchLinks() {
+  return [{
+    label: 'Docs',
+    icon: 'i-lucide-square-play',
+    to: '/getting-started'
+  }, {
+    label: 'Components',
+    icon: 'i-lucide-square-code',
+    to: '/components'
+  }, {
+    icon: 'i-lucide-sparkles',
+    label: 'Pro > Features',
+    description: 'A collection of premium Vue components.',
+    to: '/pro'
+  }, {
+    icon: 'i-lucide-credit-card',
+    label: 'Pro > Pricing',
+    description: 'Free in development, buy when ready to launch.',
+    to: '/pro/pricing'
+  }, {
+    icon: 'i-lucide-panels-top-left',
+    label: 'Pro > Templates',
+    description: 'Official templates made with Nuxt UI Pro.',
+    to: '/pro/templates'
+  }, {
+    icon: 'i-lucide-circle-check',
+    label: 'Pro > Activate',
+    description: 'Enable Nuxt UI Pro in your production projects.',
+    to: '/pro/activate'
+  }, {
+    label: 'Figma',
+    icon: 'i-simple-icons-figma',
+    to: '/figma'
+  }, {
+    label: 'Community > Contribution',
+    description: 'A comprehensive guide on contributing to Nuxt UI, including project structure, development workflow, and best practices.',
+    icon: 'i-lucide-git-pull-request-arrow',
+    to: '/getting-started/contribution'
+  }, {
+    label: 'Community > Roadmap',
+    description: 'Track our development progress in real-time.',
+    icon: 'i-lucide-map',
+    to: '/roadmap'
+  }, {
+    label: 'Community > Devtools',
+    description: 'Integrate Nuxt UI with Nuxt Devtools with Compodium.',
+    icon: 'i-lucide-code',
+    to: 'https://github.com/romhml/compodium',
+    target: '_blank'
+  }, {
+    label: 'Community > Team',
+    description: 'Meet the team behind Nuxt UI.',
+    icon: 'i-lucide-users',
+    to: '/team'
+  }, {
+    label: 'Releases',
+    icon: 'i-lucide-rocket',
+    to: 'https://github.com/nuxt/ui/releases',
+    target: '_blank'
+  }]
+}
diff --git a/docs/app/error.vue b/docs/app/error.vue
index d329df72..d001718a 100644
--- a/docs/app/error.vue
+++ b/docs/app/error.vue
@@ -15,6 +15,7 @@ const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSe
 })
 
 const links = useLinks()
+const searchLinks = useSearchLinks()
 const color = computed(() => colorMode.value === 'dark' ? (colors as any)[appConfig.ui.colors.neutral][900] : 'white')
 const radius = computed(() => `:root { --ui-radius: ${appConfig.theme.radius}rem; }`)
 const blackAsPrimary = computed(() => appConfig.theme.blackAsPrimary ? `:root { --ui-primary: black; } .dark { --ui-primary: white; }` : ':root {}')
@@ -66,6 +67,7 @@ provide('navigation', mappedNavigation)
 
     <ClientOnly>
       <LazyUContentSearch
+        :links="searchLinks"
         :files="files"
         :groups="[{
           id: 'framework',
diff --git a/docs/app/pages/[...slug].vue b/docs/app/pages/[...slug].vue
index c974caa8..991e8e53 100644
--- a/docs/app/pages/[...slug].vue
+++ b/docs/app/pages/[...slug].vue
@@ -112,7 +112,7 @@ const communityLinks = computed(() => [{
   to: 'https://nuxt.lemonsqueezy.com/affiliates',
   target: '_blank'
 }, {
-  icon: 'i-lucide-life-buoy',
+  icon: 'i-lucide-git-pull-request-arrow',
   label: 'Contribution',
   to: '/getting-started/contribution'
 }, {