feat(module search): add stats to module search results (#221)

Co-authored-by: Sébastien Chopin <[email protected]>

src/commands/module/_utils.ts

@@ -24,6 +24,30 @@ export const categories = [
  'UI',
 ]
 
+export interface NuxtApiModulesResponse {
+ version: string
+ generatedAt: string
+ stats: Stats
+ maintainers: MaintainerInfo[]
+ contributors: Contributor[]
+ modules: NuxtModule[]
+}
+
+export interface Contributor {
+ id: number
+ username: string
+ contributions: number
+ modules: string[]
+}
+
+export interface Stats {
+ downloads: number
+ stars: number
+ maintainers: number
+ contributors: number
+ modules: number
+}
+
 export interface ModuleCompatibility {
  nuxt: string
  requires: { bridge?: boolean | 'optional' }
@@ -62,6 +86,7 @@ export interface NuxtModule {
  contributors?: GithubContributor[]
  compatibility: ModuleCompatibility
  aliases?: string[]
+ stats: Stats
 
  // Fetched in realtime API for modules.nuxt.org
  downloads?: number
@@ -72,7 +97,7 @@ export interface NuxtModule {
 }
 
 export async function fetchModules(): Promise<NuxtModule[]> {
- const { modules } = await $fetch<{ modules: NuxtModule[] }>(
+ const { modules } = await $fetch<NuxtApiModulesResponse>(
  `https://api.nuxt.com/modules?version=all`,
  )
  return modules

src/commands/module/search.ts

@@ -4,7 +4,12 @@ import consola from 'consola'
 import { fetchModules, checkNuxtCompatibility, getNuxtVersion } from './_utils'
 import Fuse from 'fuse.js'
 import { upperFirst, kebabCase } from 'scule'
-import { bold, green, magenta, cyan, gray } from 'colorette'
+import { bold, green, magenta, cyan, gray, yellow } from 'colorette'
+
+const { format: formatNumber } = Intl.NumberFormat('en-GB', {
+ notation: 'compact',
+ maximumFractionDigits: 1,
+})
 
 export default defineCommand({
  meta: {
@@ -59,6 +64,8 @@ async function findModuleByKeywords(query: string, nuxtVersion: string) {
  description: gray(result.item.description),
  package: gray(result.item.npm),
  install: cyan(`npx nuxi module add ${result.item.name}`),
+ stars: yellow(formatNumber(result.item.stats.stars)),
+ monthlyDownloads: yellow(formatNumber(result.item.stats.downloads)),
  }
  if (result.item.github === result.item.website) {
  delete res.homepage