Merge branch 'main' into fix-compare-deps

Author: gameroman

app/pages/search.vue

@@ -581,12 +581,21 @@ function handleResultsKeydown(e: KeyboardEvent) {
 onKeyDown(['ArrowDown', 'ArrowUp', 'Enter'], handleResultsKeydown)
 
 useSeoMeta({
-  title: () => (query.value ? `Search: ${query.value} - npmx` : 'Search Packages - npmx'),
+  title: () =>
+    `${query.value ? $t('search.title_search', { search: query.value }) : $t('search.title_packages')} - npmx`,
+  description: () =>
+    query.value
+      ? $t('search.meta_description', { search: query.value })
+      : $t('search.meta_description_packages'),
 })
 
 defineOgImageComponent('Default', {
-  title: 'npmx',
-  description: () => (query.value ? `Search results for "${query.value}"` : 'Search npm packages'),
+  title: () =>
+    `${query.value ? $t('search.title_search', { search: query.value }) : $t('search.title_packages')} - npmx`,
+  description: () =>
+    query.value
+      ? $t('search.meta_description', { search: query.value })
+      : $t('search.meta_description_packages'),
   primaryColor: '#60a5fa',
 })
 </script>

app/plugins/fix.client.ts

@@ -0,0 +1,7 @@
+export default defineNuxtPlugin({
+  enforce: 'pre',
+  setup(nuxtApp) {
+    // TODO: investigate why this is needed
+    nuxtApp.payload.data ||= {}
+  },
+})

i18n/locales/en.json

@@ -28,6 +28,10 @@
     "updating": "(updating...)",
     "no_results": "No packages found for \"{query}\"",
     "title": "search",
+    "title_search": "search: {search}",
+    "title_packages": "search packages",
+    "meta_description": "Search results for '{search}'",
+    "meta_description_packages": "Search npm packages",
     "not_taken": "{name} is not taken",
     "claim_prompt": "Claim this package name on npm",
     "claim_button": "Claim \"{name}\"",

i18n/locales/es.json

@@ -28,6 +28,10 @@
     "updating": "(actualizando...)",
     "no_results": "No se encontraron paquetes para \"{query}\"",
     "title": "búsqueda",
+    "title_search": "búsqueda: {search}",
+    "title_packages": "búsqueda de paquetes",
+    "meta_description": "Resultado de la búsqueda para '{search}'",
+    "meta_description_packages": "Búsqueda de paquetes npm",
     "not_taken": "{name} no está ocupado",
     "claim_prompt": "Reclamar este nombre de paquete en npm",
     "claim_button": "Reclamar \"{name}\"",

lunaria/files/en-GB.json

@@ -28,6 +28,10 @@
     "updating": "(updating...)",
     "no_results": "No packages found for \"{query}\"",
     "title": "search",
+    "title_search": "search: {search}",
+    "title_packages": "search packages",
+    "meta_description": "Search results for '{search}'",
+    "meta_description_packages": "Search npm packages",
     "not_taken": "{name} is not taken",
     "claim_prompt": "Claim this package name on npm",
     "claim_button": "Claim \"{name}\"",

lunaria/files/en-US.json

@@ -28,6 +28,10 @@
     "updating": "(updating...)",
     "no_results": "No packages found for \"{query}\"",
     "title": "search",
+    "title_search": "search: {search}",
+    "title_packages": "search packages",
+    "meta_description": "Search results for '{search}'",
+    "meta_description_packages": "Search npm packages",
     "not_taken": "{name} is not taken",
     "claim_prompt": "Claim this package name on npm",
     "claim_button": "Claim \"{name}\"",

lunaria/files/es-419.json

@@ -28,6 +28,10 @@
     "updating": "(actualizando...)",
     "no_results": "No se encontraron paquetes para \"{query}\"",
     "title": "búsqueda",
+    "title_search": "búsqueda: {search}",
+    "title_packages": "búsqueda de paquetes",
+    "meta_description": "Resultado de la búsqueda para '{search}'",
+    "meta_description_packages": "Búsqueda de paquetes npm",
     "not_taken": "{name} no está ocupado",
     "claim_prompt": "Reclamar este nombre de paquete en npm",
     "claim_button": "Reclamar \"{name}\"",

lunaria/files/es-ES.json

@@ -28,6 +28,10 @@
     "updating": "(actualizando...)",
     "no_results": "No se encontraron paquetes para \"{query}\"",
     "title": "búsqueda",
+    "title_search": "búsqueda: {search}",
+    "title_packages": "búsqueda de paquetes",
+    "meta_description": "Resultado de la búsqueda para '{search}'",
+    "meta_description_packages": "Búsqueda de paquetes npm",
     "not_taken": "{name} no está ocupado",
     "claim_prompt": "Reclamar este nombre de paquete en npm",
     "claim_button": "Reclamar \"{name}\"",

modules/isr-fallback.ts

@@ -0,0 +1,30 @@
+import { readFileSync, writeFileSync } from 'node:fs'
+import { resolve } from 'node:path'
+import { defineNuxtModule } from 'nuxt/kit'
+import { provider } from 'std-env'
+
+export default defineNuxtModule({
+  meta: {
+    name: 'isr-fallback',
+  },
+  setup(_, nuxt) {
+    if (provider !== 'vercel') {
+      return
+    }
+
+    nuxt.hook('nitro:init', nitro => {
+      nitro.hooks.hook('compiled', () => {
+        const spaTemplate = readFileSync(nitro.options.output.publicDir + '/200.html', 'utf-8')
+        for (const path of ['package', '']) {
+          const outputPath = resolve(
+            nitro.options.output.serverDir,
+            '..',
+            path,
+            'spa.prerender-fallback.html',
+          )
+          writeFileSync(outputPath, spaTemplate)
+        }
+      })
+    })
+  },
+})

nuxt.config.ts

@@ -59,6 +59,7 @@ export default defineNuxtConfig({
   app: {
     head: {
       htmlAttrs: { lang: 'en-US' },
+      title: 'npmx',
       link: [
         {
           rel: 'search',
@@ -85,8 +86,10 @@ export default defineNuxtConfig({
   routeRules: {
     '/': { prerender: true },
     '/opensearch.xml': { isr: true },
-    '/**': { isr: 60 },
-    '/package/**': { isr: 60 },
+    '/**': { isr: getISRConfig(60, true) },
+    '/api/**': { isr: 60 },
+    '/200.html': { prerender: true },
+    '/package/**': { isr: getISRConfig(60, true) },
     '/:pkg/.well-known/skills/**': { isr: 3600 },
     '/:scope/:pkg/.well-known/skills/**': { isr: 3600 },
     // never cache
@@ -279,3 +282,15 @@ export default defineNuxtConfig({
     dirs: ['~/composables', '~/composables/*/*.ts'],
   },
 })
+
+function getISRConfig(expirationSeconds: number, fallback = false) {
+  if (fallback) {
+    return {
+      expiration: expirationSeconds,
+      fallback: 'spa.prerender-fallback.html',
+    } as { expiration: number }
+  }
+  return {
+    expiration: expirationSeconds,
+  }
+}