Add support for importing translation files directly

.changeset/twelve-eggs-nail.md

@@ -0,0 +1,8 @@
+---
+"unplugin-saykit": patch
+"babel-plugin-saykit": patch
+"@saykit/format-po": patch
+"@saykit/config": patch
+---
+
+Add support for importing translation files directly

.github/labeller.yml

@@ -40,7 +40,7 @@
 
 'package: unplugin':
   - changed-files:
-      - any-glob-to-any-file: ['packages/unplugin/**']
+      - any-glob-to-any-file: ['packages/plugin-unplugin/**']
 
 'package: transform-js':
   - changed-files:

examples/carbon/package.json

@@ -5,7 +5,6 @@
   "scripts": {
     "check": "tsc --noEmit",
     "extract": "saykit extract",
-    "compile": "saykit compile",
     "build": "tsdown",
     "dev": "wrangler dev"
   },

examples/carbon/saykit.config.ts

@@ -1,16 +1,16 @@
 import { defineConfig } from '@saykit/config';
-import createPoFormatter from '@saykit/format-po';
-import createJsTransformer from '@saykit/transform-js';
+import po from '@saykit/format-po';
+import js from '@saykit/transform-js';
 
 export default defineConfig({
   sourceLocale: 'en',
   locales: ['en', 'fr'],
   buckets: [
     {
       include: ['src/**/*.ts'],
-      output: 'src/locales/{locale}/messages.{extension}',
-      formatter: createPoFormatter(),
-      transformer: createJsTransformer(),
+      output: 'src/locales/{locale}.{extension}',
+      formatter: po(),
+      transformer: js(),
     },
   ],
 });

examples/carbon/src/i18n.ts

@@ -3,8 +3,8 @@ import { Say } from 'saykit';
 const say = new Say({
   locales: ['en', 'fr'],
   messages: {
-    en: await import('./locales/en/messages.json').then((m) => m.default),
-    fr: await import('./locales/fr/messages.json').then((m) => m.default),
+    en: await import('./locales/en.po').then((m) => m.default),
+    fr: await import('./locales/fr.po').then((m) => m.default),
   },
 });
 

examples/carbon/src/locales/en/messages.po → examples/carbon/src/locales/en.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: en\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: en\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 #: src/commands/maths.ts:17

examples/carbon/src/locales/fr/messages.po → examples/carbon/src/locales/fr.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: fr\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: fr\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 #: src/commands/maths.ts:17

examples/nextjs/next-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-import './.next/types/routes.d.ts';
+import './.next/dev/types/routes.d.ts';
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

examples/nextjs/package.json

@@ -5,7 +5,6 @@
   "scripts": {
     "check": "tsc --noEmit",
     "extract": "saykit extract",
-    "compile": "saykit compile",
     "dev": "next dev",
     "build": "next build",
     "start": "next start"

examples/nextjs/saykit.config.ts

@@ -1,17 +1,17 @@
 import { defineConfig } from '@saykit/config';
-import createPoFormatter from '@saykit/format-po';
-import createJsTransformer from '@saykit/transform-js';
-import createJsxTransformer from '@saykit/transform-jsx';
+import po from '@saykit/format-po';
+import js from '@saykit/transform-js';
+import jsx from '@saykit/transform-jsx';
 
 export default defineConfig({
   sourceLocale: 'en',
   locales: ['en', 'fr'],
   buckets: [
     {
       include: ['src/**/*.{ts,tsx}'],
-      output: 'src/locales/{locale}/messages.{extension}',
-      formatter: createPoFormatter(),
-      transformer: [createJsTransformer(), createJsxTransformer()],
+      output: 'src/locales/{locale}.{extension}',
+      formatter: po(),
+      transformer: [js(), jsx()],
     },
   ],
 });

examples/nextjs/src/i18n.ts

@@ -1,13 +1,12 @@
 import 'server-only';
 import { unstable_createWithSay } from '@saykit/react/server';
 import { Say } from 'saykit';
+import en from './locales/en.po';
+import fr from './locales/fr.po';
 
 const say = new Say({
   locales: ['en', 'fr'],
-  messages: {
-    en: await import('./locales/en/messages.json').then((m) => m.default),
-    fr: await import('./locales/fr/messages.json').then((m) => m.default),
-  },
+  messages: { en, fr },
 });
 
 export const withSay = unstable_createWithSay(say);

examples/nextjs/src/locales/en/messages.po → examples/nextjs/src/locales/en.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: en\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: en\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 msgid "Hello from the <0>{region}</0>"

examples/nextjs/src/locales/fr/messages.po → examples/nextjs/src/locales/fr.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: fr\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: fr\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 msgid "Hello from the <0>{region}</0>"

examples/tanstack-start/package.json

@@ -6,7 +6,6 @@
   "scripts": {
     "check": "tsc --noEmit",
     "extract": "saykit extract",
-    "compile": "saykit compile",
     "build": "vite build && tsc --noEmit",
     "dev": "vite dev"
   },

examples/tanstack-start/saykit.config.ts

@@ -1,17 +1,17 @@
 import { defineConfig } from '@saykit/config';
-import createPoFormatter from '@saykit/format-po';
-import createJsTransformer from '@saykit/transform-js';
-import createJsxTransformer from '@saykit/transform-jsx';
+import po from '@saykit/format-po';
+import js from '@saykit/transform-js';
+import jsx from '@saykit/transform-jsx';
 
 export default defineConfig({
   sourceLocale: 'en',
   locales: ['en', 'fr'],
   buckets: [
     {
       include: ['src/**/*.{ts,tsx}'],
-      output: 'src/locales/{locale}/messages.{extension}',
-      formatter: createPoFormatter(),
-      transformer: [createJsTransformer(), createJsxTransformer()],
+      output: 'src/locales/{locale}.{extension}',
+      formatter: po(),
+      transformer: [js(), jsx()],
     },
   ],
 });

examples/tanstack-start/src/i18n.ts

@@ -3,8 +3,8 @@ import { Say } from 'saykit';
 const say = new Say({
   locales: ['en', 'fr'],
   messages: {
-    en: await import('./locales/en/messages.json').then((m) => m.default),
-    fr: await import('./locales/fr/messages.json').then((m) => m.default),
+    en: await import('./locales/en.po').then((m) => m.default),
+    fr: await import('./locales/fr.po').then((m) => m.default),
   },
 });
 

examples/tanstack-start/src/locales/en/messages.po → examples/tanstack-start/src/locales/en.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: en\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: en\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 msgid "Count: {count}"

examples/tanstack-start/src/locales/fr/messages.po → examples/tanstack-start/src/locales/fr.po

@@ -1,8 +1,15 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: \n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: \n"
+"PO-Revision-Date: \n"
+"Last-Translator: \n"
+"Language: fr\n"
+"Language-Team: \n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
-"Language: fr\n"
+"Plural-Forms: \n"
 "X-Generator: saykit\n"
 
 msgid "Count: {count}"

packages/config/src/commands/extract.ts

@@ -1,27 +1,19 @@
 import { Command } from '@commander-js/extra-typings';
-import { resolveConfig } from '~/features/loader/resolve.js';
+import { resolveConfig } from '~/features/loader/index.js';
 import Logger from '~/features/logger.js';
 import { BucketExtractWorker } from '~/features/workers/extract-worker.js';
 
 export default new Command('extract')
   .description('Extract messages from source files')
   .option('-v, --verbose', 'enable verbose logging', false)
   .option('-q, --quiet', 'suppress all logging', false)
+  .option('-w, --watch', 'watch source files for changes', false)
   .action(async (options) => {
-    const config = await resolveConfig('saykit');
+    const config = resolveConfig();
     const logger = new Logger(options);
     logger.header('🛠 Extracting Messages');
 
-    const tasks = config.buckets.map(async (bucket) => {
-      const worker = new BucketExtractWorker(config, bucket, logger);
-      await worker.scanAll();
-      await worker.writeAll();
-    });
-
-    const results = await Promise.allSettled(tasks);
-    const rejections = results.filter((r): r is PromiseRejectedResult => r.status === 'rejected');
-    if (rejections.length > 0) {
-      const errors = rejections.map((r) => r.reason).join('\n');
-      throw new Error(`Bucket extraction failed:\n${errors}`);
-    }
+    const workers = config.buckets.map((b) => new BucketExtractWorker(config, b, logger));
+    await Promise.all(workers.map((w) => w.scan().then(() => w.write())));
+    if (options.watch) await Promise.all(workers.map((w) => w.watch()));
   });

packages/config/src/commands/index.ts

@@ -1,15 +1,11 @@
 #!/usr/bin/env node
 
 import { program } from '@commander-js/extra-typings';
-import build from './build.js';
-import compile from './compile.js';
 import extract from './extract.js';
 
 program
   .name('saykit')
   .helpOption('-h, --help', 'Display help for command')
   .helpCommand('help [command]', 'Display help for command')
   .addCommand(extract)
-  .addCommand(compile)
-  .addCommand(build)
   .parse();

packages/config/src/features/catalogue/path.ts

@@ -11,3 +11,8 @@ export function expandBucketOutputPath(
     .replaceAll('{extension}', extension.slice(1));
   return resolve(outputMessageTemplate);
 }
+
+export function expandBucketOutputIgnoreDirectory(bucket: Bucket) {
+  const [prefix] = bucket.output.split('{locale}');
+  return resolve(prefix || '.');
+}