Merge branch 'main' into i18n/az

Author: danielroe

CONTRIBUTING.md

@@ -256,31 +256,46 @@ The [config/i18n.ts](./config/i18n.ts) configuration file will be used to regist
 - `locales` object will be used to link the supported locales (country and single one)
 - `buildLocales` function will build the target locales
 
-To register a new locale:
+To add a new locale:
 
-- for a single country, your JSON file should include the language and the country in the name (for example, `pl-PL.json`) and register the info at `locales` object
-- for multiple country variants, you need to add the default language JSON file (for example for Spanish, `es.json`) and one of the country variants (for example for Spanish for Spain, `es-ES.json`); register the language at `countryLocaleVariants` object adding the country variants with the JSON country file and register the language at `locales` object using the language JSON file (check how we register `es`, `es-ES` and `es-419` in [config/i18n.ts](./config/i18n.ts))
+1. Create a new JSON file in [`i18n/locales/`](./i18n/locales) with the locale code as the filename (e.g., `uk-UA.json`, `de-DE.json`)
+2. Copy [`en.json`](./i18n/locales/en.json) and translate the strings
+3. Add the locale to the `locales` array in [config/i18n.ts](./config/i18n.ts):
 
-The country file should contain will contain only the translations that differ from the language JSON file, Vue I18n will merge the messages for us.
+   ```typescript
+   {
+     code: 'uk-UA',        // Must match the filename (without .json)
+     file: 'uk-UA.json',
+     name: 'Українська',   // Native name of the language
+   },
+   ```
 
-To add a new locale:
+4. Copy your translation file to `lunaria/files/` for translation tracking:
+
+   ```bash
+   cp i18n/locales/uk-UA.json lunaria/files/uk-UA.json
+   ```
 
-1. Add a new file at [locales](./i18n/locales) folder with the language code as the filename.
-2. Copy [en](./i18n/locales/en.json) and translate the strings
-3. Add the language to the `locales` array in [config/i18n.ts](./config/i18n.ts), below `en` and `ar`:
-   - If your language has multiple country variants, add the generic one for language only (only if there are a lot of common entries, you can always add it as a new one)
-     - Add all country variants in [country variants object](./config/i18n.ts)
-     - Add all country variants files with empty `messages` object: `{}`
-     - Translate the strings in the generic language file
-     - Later, when anyone wants to add the corresponding translations for the country variant, just override any entry in the corresponding file: you can see an example with `es` variants.
-   - If the generic language already exists:
-     - If the translation doesn't differ from the generic language, then add the corresponding translations in the corresponding file
-     - If the translation differs from the generic language, then add the corresponding translations in the corresponding file and remove it from the country variants entry
-4. If the language is `right-to-left`, add `dir` option with `rtl` value, for example, for [ar](./config/i18n.ts)
-5. If the language requires special pluralization rules, add `pluralRule` callback option, for example, for [ar](./config/i18n.ts)
+   > [!IMPORTANT]
+   > This file must be committed. Lunaria uses git history to track translation progress, so the build will fail if this file is missing.
+
+5. If the language is `right-to-left`, add `dir: 'rtl'` (see `ar-EG` in config for example)
+6. If the language requires special pluralization rules, add a `pluralRule` callback (see `ar-EG` or `ru-RU` in config for examples)
 
 Check [Pluralization rule callback](https://vue-i18n.intlify.dev/guide/essentials/pluralization.html#custom-pluralization) for more info.
 
+#### Country variants (advanced)
+
+Most languages only need a single locale file. Country variants are only needed when you want to support regional differences (e.g., `es-ES` for Spain vs `es-419` for Latin America).
+
+If you need country variants:
+
+1. Create a base language file (e.g., `es.json`) with all translations
+2. Create country variant files (e.g., `es-ES.json`, `es-419.json`) with only the differing translations
+3. Register the base language in `locales` and add variants to `countryLocaleVariants`
+
+See how `es`, `es-ES`, and `es-419` are configured in [config/i18n.ts](./config/i18n.ts) for a complete example.
+
 ### Adding translations
 
 1. Add your translation key to `i18n/locales/en.json` first (American English is the source of truth)

app/components/PackageDeprecatedTree.vue

@@ -15,7 +15,7 @@ const isExpanded = shallowRef(false)
 const showAll = shallowRef(false)
 
 const hasDeprecated = computed(
-  () => analysisData.value && analysisData.value.deprecatedPackages.length > 0,
+  () => analysisData.value?.deprecatedPackages && analysisData.value.deprecatedPackages.length > 0,
 )
 
 // Banner color - purple for deprecated

app/pages/settings.vue

@@ -5,10 +5,6 @@ const { locale, locales, setLocale } = useI18n()
 const colorMode = useColorMode()
 const { currentLocaleStatus, isSourceLocale } = useI18nStatus()
 
-const availableLocales = computed(() =>
-  locales.value.map(l => (typeof l === 'string' ? { code: l, name: l } : l)),
-)
-
 // Escape to go back (but not when focused on form elements)
 onKeyStroke('Escape', e => {
   const target = e.target as HTMLElement
@@ -211,7 +207,7 @@ defineOgImageComponent('Default', {
                   class="w-full sm:w-auto min-w-48 bg-bg border border-border rounded-md px-3 py-2 text-sm text-fg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-fg/50 cursor-pointer"
                   @change="setLocale(($event.target as HTMLSelectElement).value as typeof locale)"
                 >
-                  <option v-for="loc in availableLocales" :key="loc.code" :value="loc.code">
+                  <option v-for="loc in locales" :key="loc.code" :value="loc.code" :lang="loc.code">
                     {{ loc.name }}
                   </option>
                 </select>

config/i18n.ts

@@ -78,14 +78,14 @@ export const countryLocaleVariants: Record<string, (LocaleObjectData & { country
     ],*/
 }
 
-const locales: (Omit<LocaleObjectData, 'code'> & { code: string })[] = [
+const locales: (LocaleObjectData | (Omit<LocaleObjectData, 'code'> & { code: string }))[] = [
   {
     code: 'en',
     file: 'en.json',
     name: 'English',
   },
   {
-    code: 'ar-EG',
+    code: 'ar',
     file: 'ar.json',
     name: 'العربية',
     dir: 'rtl',
@@ -108,7 +108,7 @@ const locales: (Omit<LocaleObjectData, 'code'> & { code: string })[] = [
       const name = new Intl.PluralRules('ckb').select(choice)
       return { zero: 0, one: 1, two: 2, few: 3, many: 4, other: 5 }[name]
     },
-  } satisfies LocaleObjectData,
+  },
   {
     code: 'fa-IR',
     file: 'fa-IR.json',
@@ -118,7 +118,7 @@ const locales: (Omit<LocaleObjectData, 'code'> & { code: string })[] = [
       const name = new Intl.PluralRules('fa-IR').select(choice)
       return { zero: 0, one: 1, two: 2, few: 3, many: 4, other: 5 }[name]
     },
-  } satisfies LocaleObjectData,
+  },
   {
     code: 'ca',
     file: 'ca.json',
@@ -182,7 +182,7 @@ const locales: (Omit<LocaleObjectData, 'code'> & { code: string })[] = [
       const name = new Intl.PluralRules('ru-RU').select(choice)
       return { zero: 2, one: 0, two: 1, few: 1, many: 2, other: 3 }[name]
     },
-  } satisfies LocaleObjectData,
+  },
   /*{
       code: 'ru-RU',
       file: 'ru-RU.json',
@@ -283,6 +283,8 @@ const locales: (Omit<LocaleObjectData, 'code'> & { code: string })[] = [
     },*/
 ]
 
+const lunariaJSONFiles: Record<string, string> = {}
+
 function buildLocales() {
   const useLocales = Object.values(locales).reduce((acc, data) => {
     const locales = countryLocaleVariants[data.code]
@@ -294,10 +296,12 @@ function buildLocales() {
           name: l.name,
           files: [data.file as string, `${l.code}.json`],
         }
+        lunariaJSONFiles[l.code] = l.country ? (data.file as string) : `${l.code}.json`
         delete entry.file
         acc.push(entry)
       })
     } else {
+      lunariaJSONFiles[data.code] = data.file as string
       acc.push(data as LocaleObjectData)
     }
     return acc
@@ -308,6 +312,8 @@ function buildLocales() {
 
 export const currentLocales = buildLocales()
 
+export { lunariaJSONFiles }
+
 export const datetimeFormats = Object.values(currentLocales).reduce((acc, data) => {
   const dateTimeFormats = data.dateTimeFormats
   if (dateTimeFormats) {

docs/content/index.md

@@ -4,12 +4,13 @@ seo:
   description: A fast, modern browser for the npm registry
 ---
 
-## ::u-page-hero
+<!-- prettier-ignore-start -->
 
+::u-page-hero
+---
 title: npmx.dev
 description: A fast, modern browser for the npm registry. Speed first, URL compatible, and simple.
 links:
-
 - label: Get Started
   to: /getting-started/introduction
   color: neutral
@@ -22,11 +23,11 @@ links:
   size: xl
   icon: i-simple-icons-github
   variant: outline
-
 ---
-
 ::
 
+<!-- prettier-ignore-end -->
+
 ::u-page-section{title="What you can do"}
 #features
 :::u-page-feature{icon="i-lucide-search" to="/guide/features" title="Search packages" description="Fast package search with instant results, infinite scroll, and keyboard navigation."}

lunaria/files/ar.json lunaria/files/ar-EG.jsonlunaria/files/ar.json renamed to lunaria/files/ar-EG.json

@@ -329,7 +329,7 @@
       "size": "Size",
       "deps": "Deps",
       "updated": "Updated",
-      "install": "Install",
+      "get_started": "Get started",
       "readme": "Readme",
       "maintainers": "Maintainers",
       "keywords": "Keywords",

lunaria/files/en-US.json

@@ -1,7 +1,7 @@
 import { createLunaria } from '@lunariajs/core'
 import { mkdirSync, readFileSync, writeFileSync } from 'node:fs'
 import { Page } from './components.ts'
-import { prepareJsonFiles } from './prepare-json-files.ts'
+import { lunariaJSONFiles, prepareJsonFiles } from './prepare-json-files.ts'
 import type { I18nStatus } from '../shared/types/i18n-status.ts'
 
 await prepareJsonFiles()
@@ -61,7 +61,7 @@ const jsonStatus: I18nStatus = {
     }
 
     const completedKeys = totalKeys - missingKeys.length
-    const localeFilePath = `i18n/locales/${locale.lang}.json`
+    const localeFilePath = `i18n/locales/${lunariaJSONFiles[locale.lang]!}.json`
 
     return {
       lang: locale.lang,

lunaria/lunaria.ts

@@ -2,14 +2,16 @@ import type { Locale } from '@lunariajs/core'
 import type { LocaleObject } from '@nuxtjs/i18n'
 import * as path from 'node:path'
 import * as fs from 'node:fs/promises'
-import { currentLocales } from '../config/i18n.ts'
+import { currentLocales, lunariaJSONFiles } from '../config/i18n.ts'
 import { deepCopy } from '@intlify/shared'
 
 const destFolder = path.resolve('lunaria/files')
 const localesFolder = path.resolve('i18n/locales')
 
 const defaultLocale = currentLocales.find(l => l.code === 'en-US')!
 /** @public */
+export { lunariaJSONFiles }
+/** @public */
 export const sourceLocale = {
   label: defaultLocale.name,
   lang: defaultLocale.code,

lunaria/prepare-json-files.ts

@@ -6,7 +6,7 @@ import {
   ERROR_PACKAGE_VERSION_AND_FILE_FAILED,
 } from '#shared/utils/constants'
 
-const CACHE_VERSION = 2
+const CACHE_VERSION = 3
 
 // Maximum file size to fetch and highlight (500KB)
 const MAX_FILE_SIZE = 500 * 1024