Merge remote-tracking branch 'upstream/main'

# Conflicts:
#	app.vue
#	composables/useNavigation.ts
#	content/2.modules.yml
#	content/5.video-courses.yml
#	pages/modules/[slug].vue
#	pages/modules/index.vue

app.vue

@@ -66,15 +66,15 @@ onMounted(() => {
     <NuxtLoadingIndicator />
 
     <AppBanner
-      id="nuxt-tips"
-      to="https://michaelnthiessen.com/nuxt-tips-collection?aff=J0Emk"
+      id="nuxt-cert-date"
+      to="https://certificates.dev/nuxt?utm_source=nuxt&utm_medium=website&utm_campaign=affiliate&friend=NUXT"
     >
       <div class="flex items-center gap-1">
         <UIcon
-          name="i-ph-magic-wand"
-          class="w-5 h-5 flex-shrink-0 pointer-events-none hidden lg:inline-block mr-1"
+          name="i-ph-circle-wavy-check-duotone"
+          class="w-5 h-5 flex-shrink-0 pointer-events-none hidden sm:inline-block"
         />
-        <span>Изучите Nuxt с коллекцией из 100+ советов!</span>
+        <span><span class="hidden lg:inline">Official</span> Nuxt mid-level certification launch date announced!</span>
         <UButton
           label="Узнать больше"
           color="white"

composables/useModules.ts

@@ -1,4 +1,4 @@
-import type { Module, Filter } from '../types'
+import type { Module, Filter, Stats } from '../types'
 
 const iconsMap = {
   Analytics: 'i-ph-chart-bar',
@@ -43,6 +43,11 @@ export const useModules = () => {
 
   const route = useRoute()
   const router = useRouter()
+  const stats = useState<Stats>('module-stats', () => ({
+    maintainers: 0,
+    contributors: 0,
+    modules: 0
+  }))
   const modules = useState<Module[]>('modules', () => [])
   const module = useState<Module>('module', () => ({} as Module))
 
@@ -52,9 +57,10 @@ export const useModules = () => {
       return
     }
 
-    const res = await $fetch<{ modules: Module[] }>('https://api.nuxt.com/modules')
+    const res = await $fetch<{ modules: Module[], stats: Stats }>('https://api.nuxt.com/modules')
     if (res?.modules) {
       modules.value = res.modules
+      stats.value = res.stats
     }
   }
 
@@ -179,13 +185,19 @@ export const useModules = () => {
     return route.query.q as string
   })
 
-  const isSponsor = (a: Module, b: Module) => {
+  const isSponsorOrOfficial = (a: Module, b: Module) => {
     if (a.sponsor && !b.sponsor) {
       return -1
     }
     else if (!a.sponsor && b.sponsor) {
       return 1
     }
+    else if (a.type === 'official' && b.type !== 'official') {
+      return -1
+    }
+    else if (a.type !== 'official' && b.type === 'official') {
+      return 1
+    }
     else {
       return 0
     }
@@ -234,8 +246,11 @@ export const useModules = () => {
       filteredModules = filteredModules.reverse()
     }
 
-    // sponsored modules in first place
-    return filteredModules.sort(isSponsor)
+    // sponsored & official modules in first place if no sort or order by
+    if (!route.query.sortBy && !route.query.orderBy) {
+      return filteredModules.sort(isSponsorOrOfficial)
+    }
+    return filteredModules
   })
 
   return {
@@ -246,6 +261,7 @@ export const useModules = () => {
     sorts,
     orders,
     // Computed
+    stats,
     modules,
     filteredModules,
     module,

composables/useNavigation.ts

@@ -93,17 +93,20 @@ const _useNavigation = () => {
         label: 'Nuxt UI Pro',
         to: 'https://ui.nuxt.com/pro?utm_source=nuxt-website&utm_medium=header',
         description: 'Премиальные компоненты Vue для Nuxt.',
-        icon: 'i-ph-layout'
+        icon: 'i-ph-layout',
+        target: '_blank'
       }, {
         label: 'Nuxt Studio',
         to: 'https://nuxt.studio/?utm_source=nuxt-website&utm_medium=header',
         description: 'CMS для Nuxt, основанная на Git',
-        icon: 'i-ph-pen'
+        icon: 'i-ph-pen',
+        target: '_blank'
       }, {
         label: 'NuxtHub',
         to: 'https://hub.nuxt.com/?utm_source=nuxt-website&utm_medium=header',
         description: 'Создавайте, развертывайте и управляйте приложениями Nuxt, которые масштабируются.',
-        icon: 'i-ph-rocket-launch'
+        icon: 'i-ph-rocket-launch',
+        target: '_blank'
       }]
     }, {
       label: 'Сервисы',
@@ -217,10 +220,13 @@ const _useNavigation = () => {
         .filter(module => ['name', 'npm', 'repo'].map(field => module[field]).filter(Boolean).some(value => value.search(searchTextRegExp(q)) !== -1))
         .map(module => ({
           id: `module-${module.name}`,
-          label: module.name,
+          label: module.npm,
           suffix: module.description,
           avatar: {
-            src: moduleImage(module.icon)
+            src: moduleImage(module.icon),
+            ui: {
+              rounded: 'rounded-md'
+            }
           },
           to: `/modules/${module.name}`
         }))

content/2.modules.yml

@@ -2,15 +2,14 @@ navigation.title: Модули
 title: Nuxt модули
 description: Откройте для себя наш список модулей, которые помогут вам усовершенствовать ваш проект Nuxt. Создан командой и сообществом Nuxt.
 navigation.icon: i-ph-puzzle-piece
+align: center
 links:
-  - label: 'Руководство для автора модуля'
-    icon: i-ph-book-open
+  - label: 'Создайте Nuxt модуль'
     to: '/docs/guide/going-further/modules'
     color: black
-    size: md
+    size: sm
   - label: 'Список модулей'
-    icon: 'i-ph-plus-circle'
     to: 'https://github.com/nuxt/modules#addupdate-a-module'
     target: '_blank'
     color: gray
-    size: md
+    size: sm

content/3.deploy.yml

@@ -2,9 +2,10 @@ navigation.title: Развертывание
 title: Развертывание приложения Nuxt
 description: Узнайте о различных способах развертывания проекта Nuxt на различных хостинг-провайдерах.
 navigation.icon: i-ph-rocket-launch
+align: center
 links:
   - label: 'Руководство по развертыванию'
     icon: i-ph-cloud
     to: '/docs/getting-started/deployment'
     color: black
-    size: md
+    size: sm

content/3.deploy/firebase.md

@@ -154,3 +154,20 @@ firebase deploy --only functions:server,hosting
 ::read-more{to="https://firebase.google.com/docs/hosting/manage-cache#using_cookies" target="\_blank"}
 Для получения дополнительной информации обратитесь к документации **Firebase**.
 ::
+
+## Working with Environment Variables
+
+To set environment variables for your Firebase functions, you need to copy the `.env` file to the `.output/server` directory.
+You can do this by adding a `postbuild` script to your `package.json`, that will automatically run after the build command:
+
+```json [package.json]
+{
+  "scripts": {
+    "postbuild": "cp .env .output/server/.env"
+  }
+}
+```
+
+::read-more{to="https://firebase.google.com/docs/functions/config-env?gen=2nd#env-variables" target="\_blank"}
+For more information, refer to the **Firebase documentation**.
+::

content/3.deploy/github-pages.md

@@ -39,9 +39,9 @@ jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - run: corepack enable
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
         with:
           node-version: "20"
       # Выберите свой собственный менеджер пакетов и сценарий сборки

content/4.templates.yml

@@ -3,19 +3,20 @@ title: Шаблоны Nuxt
 navigation.title: Шаблоны
 description: 'Изучите шаблоны сообществ, чтобы начать работу за несколько секунд.'
 navigation.icon: i-ph-browsers
+align: center
 links:
   - label: 'Список шаблонов'
     to: 'https://github.com/nuxt/nuxt.com/tree/main#add-a-nuxt-template'
     icon: 'i-ph-plus-circle'
     target: '_blank'
     color: gray
-    size: md
-  - label: 'Nuxt Starters'
-    to: 'https://nuxt.new'
-    icon: 'i-simple-icons-nuxtdotjs'
+    size: sm
+  - label: 'Full-stack templates'
+    to: 'https://hub.nuxt.com/templates'
     target: '_blank'
+    variant: ghost
     color: gray
-    size: md
+    size: sm
 templates:
   - name: 'Movies'
     slug: 'movies'

content/5.video-courses.yml

@@ -3,6 +3,7 @@ title: Видеокурсы Nuxt
 navigation.title: Видеокурсы
 description: 'Смотрите видеокурсы от сообщества, чтобы изучить Vue 3 и Nuxt 3.'
 navigation.icon: i-ph-graduation-cap
+align: center
 courses:
   - name: 'Основы работы с Nuxt 3'
     slug: 'vc-nuxt-3-fundamentals'
@@ -68,7 +69,7 @@ courses:
     description: 'Глубокое погружение в Vue 3 с Эваном Ю.'
     url: 'https://www.vuemastery.com/courses/vue3-deep-dive-with-evan-you/vue3-overview?fpr=nuxt'
     badge: Премиум
-  - name: 'Nuxt 3 - краш-курс'
+  - name: 'Nuxt 3 - Краш-курс'
     slug: 'nuxt-3-crash-course-prismic'
     description: 'Раскройте возможности Prismic в качестве Headless конструктора сайтов вместе с Nuxt.'
     url: 'https://www.youtube.com/watch?v=8GmfcbuYOWE'

content/6.showcase.yml

@@ -2,21 +2,22 @@ title: Витрина
 head.title: Nuxt витрина
 description: Откройте для себя нашу подборку сайтов, созданных с помощью Nuxt. Эта коллекция создана на основе VueTelescope.
 navigation.icon: i-ph-projector-screen
+align: center
 links:
   - label: 'Chrome'
-    size: 'md'
+    size: 'sm'
     color: 'gray'
     to: 'https://chrome.google.com/webstore/detail/vue-telescope/neaebjphlfplgdhedjdhcnpjkndddbpd'
     icon: 'i-logos-chrome'
     target: '_blank'
   - label: 'Firefox'
-    size: 'md'
+    size: 'sm'
     color: 'gray'
     to: 'https://addons.mozilla.org/en/firefox/addon/vue-telescope/'
     icon: 'i-logos-firefox'
     target: '_blank'
   - label: 'Edge'
-    size: 'md'
+    size: 'sm'
     color: 'gray'
     to: 'https://microsoftedge.microsoft.com/addons/detail/vue-telescope/icgcillpgelpleniodgkmohgdmeogodl'
     icon: 'i-logos-microsoft-edge'

content/8.enterprise/1.support.yml

@@ -9,7 +9,7 @@ hero:
   - label: Поговорите с экспертом
     color: black
     to: 'https://calendly.com/ferdinand-nuxt/nuxtlabs-ferdinand'
-    size: lg
+    size: sm
     target: '_blank'
 logos:
   - light: '/assets/enterprise/support/light/malt.svg'

content/8.enterprise/2.agencies.yml

@@ -4,9 +4,10 @@ description: Ищете надежного партнера с сильной э
 head.title: Партнерские агентства Nuxt
 head.description: Обратитесь к нашему каталогу партнерских агентств и найдите агентство рядом с вами, обладающее необходимым набором навыков.
 navigation.icon: i-ph-handshake
+align: center
 links:
   - label: 'Отправить мое агентство'
     to: 'https://docs.google.com/forms/d/e/1FAIpQLSf85qskit5QqmGJcruGkGF0U7240Bh9MeN0pHB18UiOMWC8dA/viewform'
     color: black
-    size: 'lg'
+    size: 'sm'
     target: '_blank'

content/8.enterprise/3.sponsors.yml

@@ -3,9 +3,10 @@ description: Nuxt - это фреймворк с открытым исходны
 navigation.title: Спонсоры
 head.description: Nuxt - это фреймворк с открытым исходным кодом, бесплатно доступный для использования благодаря нашим щедрым спонсорам.
 navigation.icon: i-ph-hand-heart
+align: center
 links:
   - label: 'Стать спонсором'
     to: 'https://github.com/sponsors/nuxt'
     color: 'black'
-    size: 'lg'
+    size: 'sm'
     target: '_blank'

pages/enterprise/support.vue

@@ -61,14 +61,23 @@ onBeforeUnmount(() => {
       </UPageHero>
     </UContainer>
 
-    <ULandingSection>
+    <ULandingSection class="py-8 sm:py-8">
       <EnterpriseSupportLogoCarousel :logos="page.logos" />
     </ULandingSection>
 
-    <ULandingSection v-bind="page.service" align="left">
-      <UPageGrid :ui="{ wrapper: 'xl:grid-cols-2' }">
-        <UPageCard v-for="service in page.service.services" :key="service.title" v-bind="service" :ui="{ background: 'card-bg', icon: { base: 'size-8' } }" />
-      </UPageGrid>
+    <ULandingSection
+      v-bind="page.service"
+      align="center"
+      :ui="{
+        container: 'gap-12 sm:gap-y-12',
+        base: 'text-left items-start'
+      }"
+    >
+      <template #links>
+        <UPageGrid :ui="{ wrapper: 'xl:grid-cols-4' }">
+          <UPageCard v-for="service in page.service.services" :key="service.title" v-bind="service" :ui="{ background: 'card-bg', icon: { base: 'size-8' } }" />
+        </UPageGrid>
+      </template>
     </ULandingSection>
 
     <ULandingSection v-bind="page.expertise">

pages/modules/[slug].vue

@@ -41,15 +41,27 @@ const links = computed(() => [{
   target: '_blank'
 }].filter(Boolean))
 
-const contributors = computed(() => module.value.contributors.map(contributor => ({
-  label: contributor.username,
-  to: `https://github.com/${contributor.username}`,
-  avatar: {
-    src: `https://ipx.nuxt.com/f_auto,s_20x20/gh_avatar/${contributor.username}`,
-    srcset: `https://ipx.nuxt.com/f_auto,s_40x40/gh_avatar/${contributor.username} 2x`,
-    alt: contributor.username
+const contributors = computed(() => {
+  const allContributors = module.value.contributors.map(contributor => ({
+    label: contributor.username,
+    to: `https://github.com/${contributor.username}`,
+    avatar: {
+      src: `https://ipx.nuxt.com/f_auto,s_20x20/gh_avatar/${contributor.username}`,
+      srcset: `https://ipx.nuxt.com/f_auto,s_40x40/gh_avatar/${contributor.username} 2x`,
+      alt: contributor.username
+    }
+  }))
+  if (allContributors.length > 10) {
+    return [...allContributors.slice(0, 10), {
+      label: 'View all contributors',
+      to: `https://github.com/${module.value.repo}/graphs/contributors`,
+      external: true,
+      target: '_blank'
+    }]
   }
-})))
+
+  return allContributors
+})
 
 const title = module.value.name.charAt(0).toUpperCase() + module.value.name.slice(1)
 const description = module.value.description || 'Модуль Nuxt'
@@ -85,7 +97,7 @@ defineOgImageComponent('Docs', {
     </div>
     <UPageHeader :description="module.description" :ui="{ headline: 'mb-8' }">
       <template #headline>
-        <UBreadcrumb :links="[{ label: 'Модули', to: '/modules', icon: 'i-ph-puzzle-piece' }, { to: { name: 'modules', query: { category: module.category } }, label: module.category }, { label: module.npm }]" />
+        <UBreadcrumb :links="[{ label: 'Модули', to: '/modules' }, { to: { name: 'modules', query: { category: module.category } }, label: module.category }, { label: module.npm }]" />
       </template>
       <template #title>
         <div class="flex items-center gap-4">
@@ -99,7 +111,7 @@ defineOgImageComponent('Docs', {
           />
 
           <div>
-            {{ module.name }}
+            {{ module.npm }}
 
             <UTooltip v-if="module.type === 'official'" text="Official module" class="tracking-normal">
               <UIcon name="i-ph-medal" class="h-6 w-6 text-primary" />
@@ -153,11 +165,9 @@ defineOgImageComponent('Docs', {
       </UPageBody>
 
       <template #right>
-        <UContentToc :links="module.readme.toc?.links">
+        <UContentToc>
           <template #bottom>
-            <div class="hidden lg:block space-y-6" :class="{ '!mt-6': module.readme?.toc?.links?.length }">
-              <UDivider v-if="module.readme?.toc?.links?.length" type="dashed" />
-
+            <div class="hidden lg:block space-y-6">
               <UPageLinks title="Links" :links="links" />
 
               <UDivider type="dashed" />