@plutocms/pluto 0.12.0 → 0.14.0

package/app/pages/admin/content/[type]/index.vue

@@ -4,13 +4,14 @@ const typeName = route.params.type as string
 
 const { byName } = usePlutoContentTypes()
 const type = byName(typeName)
+const text = usePlutoContentText(type)
 
 if (!type) {
   throw createError({ statusCode: 404, statusMessage: 'Content type not found.', fatal: true })
 }
 
 useHead({
-  title: type.labelPlural,
+  title: () => text.labelPlural,
 })
 </script>
 

package/app/pages/admin/content/[type]/new.vue

@@ -4,13 +4,14 @@ const typeName = route.params.type as string
 
 const { byName } = usePlutoContentTypes()
 const type = byName(typeName)
+const text = usePlutoContentText(type)
 
 if (!type) {
   throw createError({ statusCode: 404, statusMessage: 'Content type not found.', fatal: true })
 }
 
 useHead({
-  title: `New ${type.label}`,
+  title: () => text.newLabel,
 })
 </script>
 

package/app/pages/admin/home.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
+const { t, d } = usePlutoI18n()
+
 useHead({
-  title: 'Dashboard',
+  title: () => t('pluto.pages.dashboard'),
 })
 
-const today = new Intl.DateTimeFormat(undefined, { weekday: 'long', month: 'long', day: 'numeric' }).format(new Date())
+const today = computed(() => d(new Date(), { weekday: 'long', month: 'long', day: 'numeric' }))
 
 // The header's Create button reuses the command palette's Create commands.
 const groups = usePlutoCommandPalette()
@@ -21,7 +23,7 @@ function run(item: {
     <header class="flex flex-col gap-4 sm:flex-row sm:items-end sm:justify-between">
       <div>
         <p class="text-muted text-sm">{{ today }}</p>
-        <h1 class="text-highlighted text-2xl font-semibold tracking-tight lg:text-3xl">Dashboard</h1>
+        <h1 class="text-highlighted text-2xl font-semibold tracking-tight lg:text-3xl">{{ t('pluto.pages.dashboard') }}</h1>
       </div>
 
       <UButton
@@ -33,7 +35,7 @@ function run(item: {
       />
 
       <UDropdownMenu v-else-if="createItems.length > 1" :items="createItems" :content="{ align: 'end' }">
-        <UButton label="Create" icon="lucide:plus" trailing-icon="lucide:chevron-down" size="md" />
+        <UButton :label="t('pluto.common.create')" icon="lucide:plus" trailing-icon="lucide:chevron-down" size="md" />
       </UDropdownMenu>
     </header>
 

package/app/pages/admin/settings.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
+const { t } = usePlutoI18n()
+
 useHead({
-  title: 'Settings',
+  title: () => t('pluto.pages.settings'),
 })
 
 const { items } = usePlutoSettingsPanels()
@@ -16,13 +18,16 @@ onMounted(() => {
 <template>
   <main>
     <AdminView>
-      <h1 class="text-3xl font-bold lg:text-4xl">Settings</h1>
+      <h1 class="text-3xl font-bold lg:text-4xl">{{ t('pluto.pages.settings') }}</h1>
+
+      <!-- Per-user, so it needs no capability and no settings driver. -->
+      <PlutoSettingsLanguage />
 
       <UAlert
         v-if="!hasDriver"
+        :title="t('pluto.settings.noStorage')"
+        :description="t('pluto.settings.noStorageHint')"
         color="warning"
-        title="No settings storage"
-        description="No installed layer provides settings storage yet."
       />
 
       <template v-else>
@@ -37,7 +42,7 @@ onMounted(() => {
 
         <div class="flex">
           <UButton :loading="status === 'saving'" icon="lucide:save" @click="save">
-            Save
+            {{ t('pluto.common.save') }}
           </UButton>
         </div>
       </template>

package/app/plugins/pluto-core-registrations.ts

@@ -14,6 +14,9 @@ import PlutoDashboardQuickActions from '../components/Pluto/Dashboard/PlutoDashb
 // Home/Settings nav entries, so every other layer's nav item sorts between
 // them by default (default order is 100).
 //
+// Labels and titles are translation keys, not English text. The consumer
+// composables resolve them with `tx()`. See the i18n skill.
+//
 // Everything core itself contributes to the registry lives in this one
 // `definePlutoExtension` call — `definePlutoExtension` replaces a layer's
 // whole contribution on every call, not just the buckets that call passes,
@@ -27,12 +30,12 @@ export default defineNuxtPlugin(() => {
   definePlutoExtension({
     id: 'pluto',
     nav: [
-      { id: 'home', order: 0, label: 'Home', icon: 'lucide:house', to: '/admin/home' },
-      { id: 'settings', order: 1000, label: 'Settings', icon: 'lucide:settings', to: '/admin/settings' },
+      { id: 'home', order: 0, label: 'pluto.nav.home', icon: 'lucide:house', to: '/admin/home' },
+      { id: 'settings', order: 1000, label: 'pluto.nav.settings', icon: 'lucide:settings', to: '/admin/settings' },
     ],
     pages: [
-      { id: 'home', path: '/admin/home', title: 'Dashboard', icon: 'lucide:house' },
-      { id: 'settings', path: '/admin/settings', title: 'Settings', icon: 'lucide:settings' },
+      { id: 'home', path: '/admin/home', title: 'pluto.pages.dashboard', icon: 'lucide:house' },
+      { id: 'settings', path: '/admin/settings', title: 'pluto.pages.settings', icon: 'lucide:settings' },
     ],
     contentFieldWidgets: [
       { id: 'text', fieldType: 'text', component: PlutoFieldText },
@@ -52,7 +55,7 @@ export default defineNuxtPlugin(() => {
       {
         id: 'content-overview',
         order: 0,
-        title: 'Content',
+        title: 'pluto.dashboard.overview.title',
         colSpan: 3,
         component: PlutoDashboardContentOverview,
         enabled: () => usePlutoContentTypes().items.value.length > 0,
@@ -62,7 +65,7 @@ export default defineNuxtPlugin(() => {
       {
         id: 'content-activity',
         order: 10,
-        title: 'Content activity',
+        title: 'pluto.dashboard.activity.title',
         colSpan: 2,
         component: PlutoDashboardContentActivity,
         enabled: () => usePlutoContentTypes().items.value.length > 0,
@@ -70,7 +73,7 @@ export default defineNuxtPlugin(() => {
       {
         id: 'quick-actions',
         order: 20,
-        title: 'Quick actions',
+        title: 'pluto.dashboard.quickActions.title',
         colSpan: 1,
         component: PlutoDashboardQuickActions,
       },

package/app/plugins/pluto-i18n.ts

@@ -0,0 +1,20 @@
+import {
+  loadPlutoLocale,
+  resolveAdminLocale,
+  resolveSiteLocale,
+} from '../composables/internal/i18n-runtime'
+
+// Resolves the admin locale and the site locale, and loads their messages and
+// Nuxt UI locale before the first render. The locales live in `useState`, so
+// the client reuses the value the server chose: no mismatch on hydration. The
+// resolve runs only when the state is empty (the server, or a client-only
+// route such as /admin/**).
+export default defineNuxtPlugin({
+  name: 'pluto-i18n',
+  async setup() {
+    const admin = useState<string>('pluto-admin-locale', resolveAdminLocale)
+    const site = useState<string>('pluto-site-locale', resolveSiteLocale)
+
+    await Promise.all([loadPlutoLocale(admin.value), loadPlutoLocale(site.value)])
+  },
+})

package/i18n/locales/en.json

@@ -0,0 +1,137 @@
+{
+  "pluto": {
+    "app": {
+      "name": "Pluto Admin"
+    },
+    "common": {
+      "save": "Save",
+      "cancel": "Cancel",
+      "delete": "Delete",
+      "tryAgain": "Try again",
+      "close": "Close",
+      "loading": "Loading...",
+      "remove": "Remove",
+      "edit": "Edit",
+      "refresh": "Refresh",
+      "settings": "Settings",
+      "create": "Create",
+      "error": "Error",
+      "switchToLightMode": "Switch to light mode",
+      "switchToDarkMode": "Switch to dark mode"
+    },
+    "nav": {
+      "home": "Home",
+      "settings": "Settings"
+    },
+    "pages": {
+      "dashboard": "Dashboard",
+      "settings": "Settings"
+    },
+    "palette": {
+      "goTo": "Go to",
+      "placeholder": "Search pages and actions…"
+    },
+    "content": {
+      "new": "New {label}",
+      "edit": "Edit {label}",
+      "all": "All {labelPlural}",
+      "createNew": "Create new {label}",
+      "typeNotFound": "Content type not found",
+      "typeNotFoundDescription": "No content type named \"{type}\" is registered.",
+      "removeConfirm": "Do you really want to remove this item?"
+    },
+    "form": {
+      "published": "Published",
+      "unpublished": "Unpublished",
+      "saved": "Saved",
+      "updated": "{label} updated successfully.",
+      "saveError": "An error occurred while saving.",
+      "removeError": "An error occurred while removing.",
+      "saveDraft": "Save draft",
+      "update": "Update",
+      "publish": "Publish",
+      "unpublish": "Unpublish",
+      "fixErrors": "Please fix the following before saving",
+      "removeTitle": "Remove {label}"
+    },
+    "list": {
+      "loading": "Loading {labelPlural}…",
+      "loadFailed": "Could not load {labelPlural}",
+      "loadFailedHint": "Check your connection and try again.",
+      "empty": "No {labelPlural} yet",
+      "emptyCanWrite": "Create the first {label} to see it here.",
+      "emptyReadOnly": "There is nothing here yet.",
+      "refreshFailed": "Could not refresh {labelPlural}",
+      "refreshFailedHint": "The list below may be out of date.",
+      "emptyTable": "No items yet.",
+      "removeTitle": "Remove item",
+      "showing": "Showing {loaded} {labelPlural}",
+      "showingOf": "Showing {loaded} of {total} {labelPlural}",
+      "loadingMore": "Loading more…"
+    },
+    "fields": {
+      "noWidget": "No widget registered for field type \"{type}\".",
+      "noOptionsSource": "No options source configured for this reference field."
+    },
+    "dashboard": {
+      "noWidgets": "No dashboard widgets are registered yet. A layer can add one with",
+      "overview": {
+        "title": "Content",
+        "label": "Content overview",
+        "loadFailed": "Could not load the content counts",
+        "thisWeek": "this week",
+        "noneThisWeek": "none new this week",
+        "meter": "{published} of {total} {labelPlural} published",
+        "published": "published | published | published",
+        "drafts": "drafts | draft | drafts"
+      },
+      "activity": {
+        "title": "Content activity",
+        "subtitle": "Items created per week, last {weeks} weeks",
+        "created": "created | created | created",
+        "loadFailed": "Could not load the activity",
+        "unavailable": "Activity is not available",
+        "unavailableHint": "The content backend cannot count items by creation date yet.",
+        "none": "Nothing created in the last {weeks} weeks",
+        "noneHint": "New items show up here week by week.",
+        "weekOf": "Week of"
+      },
+      "quickActions": {
+        "title": "Quick actions",
+        "pressBefore": "Press",
+        "pressAfter": "to search everything."
+      }
+    },
+    "settings": {
+      "noStorage": "No settings storage",
+      "noStorageHint": "No installed layer provides settings storage yet.",
+      "language": {
+        "cardTitle": "Your preferences",
+        "label": "Language",
+        "description": "Choose the language of the admin. It applies to your account only.",
+        "automatic": "Automatic (browser)",
+        "saved": "Language updated",
+        "saveFailed": "Could not save your language",
+        "saveFailedDescription": "The language changed on this device only. {reason}"
+      }
+    },
+    "errors": {
+      "unknown": "Something went wrong.",
+      "contentTypeNotFound": "Content type \"{name}\" not found.",
+      "noContentAdapter": "No content adapter is registered.",
+      "notFound": "Not found.",
+      "bodyNotObject": "Request body must be a JSON object.",
+      "validationFailed": "Validation failed."
+    },
+    "validation": {
+      "required": "\"{label}\" is required.",
+      "number": "\"{label}\" must be a number.",
+      "integer": "\"{label}\" must be an integer.",
+      "min": "\"{label}\" must be at least {min}.",
+      "max": "\"{label}\" must be at most {max}.",
+      "boolean": "\"{label}\" must be a boolean.",
+      "option": "\"{label}\" must be one of the allowed options.",
+      "maxLength": "\"{label}\" must be at most {max} characters."
+    }
+  }
+}

package/i18n/locales/pt-BR.json

@@ -0,0 +1,137 @@
+{
+  "pluto": {
+    "app": {
+      "name": "Pluto Admin"
+    },
+    "common": {
+      "save": "Salvar",
+      "cancel": "Cancelar",
+      "delete": "Excluir",
+      "tryAgain": "Tentar novamente",
+      "close": "Fechar",
+      "loading": "Carregando...",
+      "remove": "Remover",
+      "edit": "Editar",
+      "refresh": "Atualizar",
+      "settings": "Configurações",
+      "create": "Criar",
+      "error": "Erro",
+      "switchToLightMode": "Mudar para o tema claro",
+      "switchToDarkMode": "Mudar para o tema escuro"
+    },
+    "nav": {
+      "home": "Início",
+      "settings": "Configurações"
+    },
+    "pages": {
+      "dashboard": "Painel",
+      "settings": "Configurações"
+    },
+    "palette": {
+      "goTo": "Ir para",
+      "placeholder": "Buscar páginas e ações…"
+    },
+    "content": {
+      "new": "Criar {label}",
+      "edit": "Editar {label}",
+      "all": "Ver {labelPlural}",
+      "createNew": "Criar {label}",
+      "typeNotFound": "Tipo de conteúdo não encontrado",
+      "typeNotFoundDescription": "Nenhum tipo de conteúdo chamado \"{type}\" está registrado.",
+      "removeConfirm": "Deseja mesmo remover este item?"
+    },
+    "form": {
+      "published": "Publicado",
+      "unpublished": "Não publicado",
+      "saved": "Salvo",
+      "updated": "{label}: alterações salvas.",
+      "saveError": "Ocorreu um erro ao salvar.",
+      "removeError": "Ocorreu um erro ao remover.",
+      "saveDraft": "Salvar rascunho",
+      "update": "Atualizar",
+      "publish": "Publicar",
+      "unpublish": "Despublicar",
+      "fixErrors": "Corrija os itens abaixo antes de salvar",
+      "removeTitle": "Remover {label}"
+    },
+    "list": {
+      "loading": "Carregando {labelPlural}…",
+      "loadFailed": "Não foi possível carregar {labelPlural}",
+      "loadFailedHint": "Verifique a conexão e tente novamente.",
+      "empty": "Ainda não há {labelPlural}",
+      "emptyCanWrite": "Use “Criar {label}” para adicionar o primeiro item.",
+      "emptyReadOnly": "Ainda não há nada aqui.",
+      "refreshFailed": "Não foi possível atualizar {labelPlural}",
+      "refreshFailedHint": "A lista abaixo pode estar desatualizada.",
+      "emptyTable": "Nenhum item ainda.",
+      "removeTitle": "Remover item",
+      "showing": "Mostrando {loaded} {labelPlural}",
+      "showingOf": "Mostrando {loaded} de {total} {labelPlural}",
+      "loadingMore": "Carregando mais…"
+    },
+    "fields": {
+      "noWidget": "Nenhum widget registrado para o tipo de campo \"{type}\".",
+      "noOptionsSource": "Nenhuma fonte de opções configurada para este campo de referência."
+    },
+    "dashboard": {
+      "noWidgets": "Ainda não há widgets registrados no painel. Uma camada pode adicionar um com",
+      "overview": {
+        "title": "Conteúdo",
+        "label": "Visão geral do conteúdo",
+        "loadFailed": "Não foi possível carregar as contagens de conteúdo",
+        "thisWeek": "esta semana",
+        "noneThisWeek": "nada novo esta semana",
+        "meter": "Publicação: {published} de {total} {labelPlural}",
+        "published": "publicados | publicado | publicados",
+        "drafts": "rascunhos | rascunho | rascunhos"
+      },
+      "activity": {
+        "title": "Atividade de conteúdo",
+        "subtitle": "Itens criados por semana, últimas {weeks} semanas",
+        "created": "criados | criado | criados",
+        "loadFailed": "Não foi possível carregar a atividade",
+        "unavailable": "Atividade indisponível",
+        "unavailableHint": "O backend de conteúdo ainda não consegue contar itens pela data de criação.",
+        "none": "Nada criado nas últimas {weeks} semanas",
+        "noneHint": "Os novos itens aparecem aqui semana a semana.",
+        "weekOf": "Semana de"
+      },
+      "quickActions": {
+        "title": "Ações rápidas",
+        "pressBefore": "Pressione",
+        "pressAfter": "para buscar tudo."
+      }
+    },
+    "settings": {
+      "noStorage": "Sem armazenamento de configurações",
+      "noStorageHint": "Nenhuma camada instalada oferece armazenamento de configurações ainda.",
+      "language": {
+        "cardTitle": "Suas preferências",
+        "label": "Idioma",
+        "description": "Escolha o idioma do painel. Vale só para a sua conta.",
+        "automatic": "Automático (navegador)",
+        "saved": "Idioma atualizado",
+        "saveFailed": "Não foi possível salvar o idioma",
+        "saveFailedDescription": "O idioma mudou apenas neste dispositivo. {reason}"
+      }
+    },
+    "errors": {
+      "unknown": "Algo deu errado.",
+      "contentTypeNotFound": "Tipo de conteúdo \"{name}\" não encontrado.",
+      "noContentAdapter": "Nenhum adaptador de conteúdo está registrado.",
+      "notFound": "Não encontrado.",
+      "bodyNotObject": "O corpo da requisição deve ser um objeto JSON.",
+      "validationFailed": "Falha na validação."
+    },
+    "validation": {
+      "required": "Preencha \"{label}\".",
+      "number": "Informe um número em \"{label}\".",
+      "integer": "Informe um número inteiro em \"{label}\".",
+      "min": "Informe em \"{label}\" um valor de no mínimo {min}.",
+      "max": "Informe em \"{label}\" um valor de no máximo {max}.",
+      "boolean": "Use apenas verdadeiro ou falso em \"{label}\".",
+      "option": "Escolha uma das opções permitidas em \"{label}\".",
+      "maxLength": "Use no máximo {max} caracteres em \"{label}\"."
+    }
+  }
+}

package/modules/pluto-i18n/index.ts

@@ -0,0 +1,89 @@
+import type { PlutoI18nOptions } from './locale-files'
+import { existsSync, readdirSync } from 'node:fs'
+import { dirname } from 'node:path'
+import { addTemplate, defineNuxtModule, getLayerDirectories, resolvePath, updateTemplates, useLogger } from '@nuxt/kit'
+import {
+  findLayerLocaleFiles,
+  LOCALE_DIR,
+  renderI18nTemplate,
+  renderI18nTypes,
+  resolveI18nOptions,
+} from './locale-files'
+
+export type { PlutoI18nOptions } from './locale-files'
+
+/**
+ * Finds every layer's `i18n/locales/<code>.json` and generates
+ * `#build/pluto-i18n.mjs`: the locale codes and one lazy loader per locale.
+ * The files of all layers merge, base layer first and the app last, so the
+ * app overrides a layer's text. Adding a language is adding the JSON files.
+ * No code change.
+ *
+ * The module also puts the resolved options in
+ * `runtimeConfig.public.plutoI18n`. See the i18n skill.
+ */
+export default defineNuxtModule<PlutoI18nOptions>({
+  meta: { name: 'pluto-i18n', configKey: 'plutoI18n' },
+  defaults: {},
+  async setup(options, nuxt) {
+    const logger = useLogger('pluto-i18n')
+    const layerRoots = getLayerDirectories(nuxt).map((layer) => layer.root)
+
+    function listDir(dir: string): string[] {
+      return existsSync(dir) ? readdirSync(dir) : []
+    }
+
+    // Nuxt UI's locale files. The generated file imports them by absolute
+    // path, so the app needs no direct `@nuxt/ui` dependency.
+    const uiLocaleDir = dirname(await resolvePath('@nuxt/ui/runtime/locale/en.js'))
+    const uiLocaleFiles = listDir(uiLocaleDir)
+      .filter((name) => name.endsWith('.js'))
+      .map((name) => name.slice(0, -'.js'.length))
+      .filter((name) => name !== 'index')
+
+    let files = findLayerLocaleFiles(layerRoots, listDir)
+    const resolved = resolveI18nOptions(options, Object.keys(files))
+
+    if (!nuxt.options._prepare) {
+      for (const warning of resolved.warnings) {
+        logger.warn(warning)
+      }
+    }
+
+    nuxt.options.runtimeConfig.public.plutoI18n = {
+      defaultLocale: resolved.defaultLocale,
+      adminLocales: resolved.adminLocales,
+      siteLocales: resolved.siteLocales,
+      siteLocale: resolved.siteLocale,
+    }
+
+    addTemplate({
+      filename: 'pluto-i18n.mjs',
+      write: true,
+      getContents: () => renderI18nTemplate({
+        files,
+        defaultLocale: resolved.defaultLocale,
+        uiLocaleDir,
+        uiLocaleFiles,
+      }),
+    })
+
+    addTemplate({
+      filename: 'pluto-i18n.d.mts',
+      write: true,
+      getContents: renderI18nTypes,
+    })
+
+    // A new or removed locale file changes the generated file. Locale
+    // codes and options come from the first run, so restart the dev server
+    // after a new language. An edit of an existing file hot-reloads on its own.
+    nuxt.hook('builder:watch', async (_event, path) => {
+      const normalized = path.replaceAll('\\', '/')
+      if (!normalized.includes(`/${LOCALE_DIR}/`) || !normalized.endsWith('.json')) {
+        return
+      }
+      files = findLayerLocaleFiles(layerRoots, listDir)
+      await updateTemplates({ filter: (template) => template.filename.startsWith('pluto-i18n.') })
+    })
+  },
+})