glotstack 0.0.3 → 0.0.6

package/package.json

@@ -1,28 +1,37 @@
 {
   "name": "glotstack",
-  "version": "0.0.3",
+  "version": "0.0.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "author": "JD Cumpson",
   "license": "MIT",
   "private": false,
-  "dependencies": {},
+  "dependencies": {
+    "commander": "^13.1.0",
+    "eslint": "^9.26.0"
+  },
   "devDependencies": {
+    "@eslint/js": "^9.26.0",
+    "@types/js-yaml": "^4.0.9",
+    "@types/node": "^22.15.17",
+    "@types/react": "^19.1.4",
+    "globals": "^16.1.0",
+    "js-yaml": "^4.1.0",
     "typescript": "5.4.4",
-    "typescript-eslint": "^8.17.0"
+    "typescript-eslint": "^8.32.1"
   },
   "peerDependencies": {
-    "@types/react": "^19.1.3",
-    "react": "^18.3.1"
+    "react": "^19.1.0"
   },
   "resolutions": {
     "react": "18.3.1"
   },
   "bin": {
-    "glotstack": "dist/glotstack-ci.js"
+    "glotstack": "dist/cli.js"
   },
   "scripts": {
-    "build": "tsc",
-    "prepublishOnly": "yarn run build"
+    "build": "tsc && scripts/fix-shebang.sh dist/cli.js",
+    "prepublishOnly": "yarn run build",
+    "glotstack": "node dist/cli.js"
   }
 }

package/scripts/fix-shebang.sh

@@ -0,0 +1,28 @@
+#!/bin/bash
+
+FILE="$1"
+SHEBANG='#!/usr/bin/env node'
+
+if [ -z "$FILE" ]; then
+  echo "Usage: $0 <file>"
+  exit 1
+fi
+
+if [ ! -f "$FILE" ]; then
+  echo "File not found: $FILE"
+  exit 1
+fi
+
+FIRST_LINE=$(head -n 1 "$FILE")
+
+if [ "$FIRST_LINE" != "$SHEBANG" ]; then
+  echo "Injecting shebang into $FILE"
+  TMP_FILE=$(mktemp)
+  echo "$SHEBANG" > "$TMP_FILE"
+  cat "$FILE" >> "$TMP_FILE"
+  mv "$TMP_FILE" "$FILE"
+else
+  echo "Shebang already present in $FILE"
+fi
+
+chmod +x "$FILE"

package/src/cli.tsx

@@ -0,0 +1,151 @@
+import { Command, program } from 'commander'
+import path from 'path'
+import { promises as fs, read } from 'fs'
+import { findGlotstackConfig } from './util/findConfig'
+import { cwd } from 'process'
+import { merge } from './util/object'
+import { loadYaml } from './util/yaml'
+import eslint from 'eslint'
+import * as readline from "node:readline/promises"
+import { stdin as input, stdout as output } from "node:process"
+
+
+const fetchGlotstack = async (apiOrigin: string, apiKey: string, body: object) => {
+  const url = `${apiOrigin}/api/translations`
+  console.info(`Fetching translations from: ${url}`)
+
+  const headers = {
+    'Content-Type': 'application/json',
+    'Authorization': `Bearer ${apiKey}`,
+  }
+
+  try {
+    const res = await fetch(url, { method: 'POST', body: JSON.stringify(body), headers })
+    if (!res.ok) throw new Error(`HTTP ${res.status}: ${res.statusText}`)
+    return res.json()
+    // fs.writeFile(`${outputDir}/source.json`, JSON.stringify(json, null, 2))
+  } catch (err) {
+    console.error('Fetch failed:', err)
+    process.exit(1)
+  }
+}
+
+
+async function run(args: string[]) {
+  program
+    .command('extract-translations')
+    .option('--source-path [path]', 'to source files root directory', '.')
+    .option('--api-origin [url]', 'glotstack api origin', process.env.GLOTSTACK_HOST ?? 'https://glotstack.ai')
+    .option('--yes', 'skip confirm checks', false)
+    .action(async (options: Record<string, any>) => {
+      if (!options.apiOrigin) {
+        throw new Error('apiOrigin must be specified')
+      }
+
+      const linter = new eslint.ESLint({ overrideConfigFile: path.join(__dirname, '..', 'eslint-raw-string.mjs') })
+      const results = await linter.lintFiles(["./**/*"])
+      const filesWithIssues = results
+        .filter((r) => r.errorCount + r.warningCount > 0)
+        .map((r) => r.filePath)
+
+      const rl = readline.createInterface({ input, output })
+
+      const askToSend = async (): Promise<boolean> => {
+        if (options.yes) {
+          return true
+        }
+        const response = await rl.question(`Your source are going to be sent to our LLM -- they should not contain any secrets. Proceed? (yes/no):`)
+        if (response === 'yes') {
+          return true
+        } else if (response !== 'no') {
+          console.error('Please respond with yes or no.')
+          return askToSend()
+        } else {
+          return false
+        }
+      }
+
+      const send = await askToSend()
+      if (send) {
+        console.info('Sending files to LLM')
+        rl.close()
+      } else {
+        rl.close()
+      }
+    })
+
+  program
+    .command('get-translations')
+    .option('--source-path [path]', 'path to en-US.json (or your canonical source json)')
+    .option('--api-origin [url]', 'glotstack api origin', process.env.GLOTSTACK_HOST ?? 'https://glotstack.ai')
+    .option('--output-dir [path]', 'path to output directory')
+    .option('--api-key [key]', 'api key for glotstack.ai')
+    .option('--project-id [id]', '(optional) specific project to use')
+    .argument('[output-locales...]', 'locales to get translations for')
+    .action(async (outputLocales: string[], options: Record<string, any>, command: Command) => {
+      const configPath = findGlotstackConfig(cwd())
+      let config = {}
+
+      if (configPath != null) {
+        console.info('Loading config file at ', configPath)
+        try {
+          const text = await fs.readFile(configPath, 'utf-8')
+          config = JSON.parse(text)
+          console.info('Loaded config file', config)
+        } catch (err) {
+          //pass
+        }
+      }
+
+      const resolved = merge(config, options, { outputLocales })
+      const { apiOrigin, sourcePath, outputDir, projectId } = resolved
+
+      if ((resolved.outputLocales as string[]).includes('en-US')) {
+        console.warn('en-US detected in outputLocales, removing')
+        resolved.outputLocales = resolved.outputLocales.filter((x: string) => x !== 'en-US')
+      }
+
+      if (!sourcePath) {
+        throw new Error('sourcePath must be specified')
+      }
+      if (!apiOrigin) {
+        throw new Error('apiOrigin must be specified')
+      }
+      if (!outputDir) {
+        throw new Error('outputDir must be specified')
+      }
+
+      const absPath = path.resolve(sourcePath)
+      const fileContent = await fs.readFile(absPath, 'utf-8')
+
+      let json = null
+      try {
+        json = loadYaml(fileContent)
+      } catch (err) {
+        try {
+          json = JSON.parse(fileContent)
+        } catch (err) {
+          console.error('Unable to parse source file ', absPath, err)
+          throw err
+        }
+      }
+
+      const body = {
+        locales: resolved.outputLocales,
+        translations: json,
+        ...{ ... (projectId != null ? { projectId } : {}) },
+      }
+
+      const data = await fetchGlotstack(apiOrigin, resolved.apiKey, body)
+      console.info('Received translations:', data)
+      Object.entries(data.data).map(([key, val]) => {
+        const p = `${outputDir}/${key}.json`
+        console.info(`Writing file ${p}`)
+        fs.writeFile(`${outputDir}/${key}.json`, JSON.stringify(val, null, 2))
+      })
+    })
+
+  await program.parseAsync(args)
+}
+
+run(process.argv)

package/src/index.tsx

@@ -23,125 +23,117 @@ export interface Translations {
 
 export interface ContextType {
   translations: Translations
-  requireTranslations: (localeRegion: string) => Promise<unknown>
-  setLocale: (locale: LocaleRegion) => Promise<unknown>
   locale: string | null
+  loadTranslations: (locale: LocaleRegion) => Promise<Translations>
+  setLocale: (locale: LocaleRegion) => void
+  importMethod: (locale: LocaleRegion) => Promise<Translations>
   t: (key: string, options?: { locale?: LocaleRegion }) => string
 }
 
 export const GlotstackContext = React.createContext<ContextType>({
   translations: {},
-  requireTranslations: () => Promise.resolve(),
-  setLocale: (_locale: LocaleRegion) => Promise.resolve(),
+  loadTranslations: () => { throw new Error('no import method set') },
+  setLocale: (_locale: LocaleRegion) => { throw new Error('import method not set') },
   locale: null,
-  t: () => '',
+  importMethod: (_locale: LocaleRegion) => { throw new Error('import method not set') },
+  t: () => { throw new Error('import method not set') },
 })
 
-export const Provider = ({ children, locale: defaultLocale, onUpdated, initialTranslations, onLocaleChange }: {
-  children: React.ReactNode; locale: string; onUpdated: (value: ContextType) => void
+interface GlotstackProviderProps {
+  children: React.ReactNode
   initialTranslations?: Translations
-  onLocaleChange: (locale: string | null, value: ContextType) => void
-}) => {
-  const [translations, setTranslations] = React.useState<Translations>(initialTranslations ?? {})
-  const loadingRef = React.useRef<Record<string, Promise<{ default: string }>>>({})
-  const [locale, setLocalLocale] = React.useState(defaultLocale)
+  initialLocale?: LocaleRegion
+  onTranslationLoaded?: (locale: LocaleRegion, translations: Translations) => void
+  onLocaleChange?: (locale: LocaleRegion) => void
+  importMethod: (locale: LocaleRegion) => Promise<Translations>
+}
 
-  React.useEffect(() => {
-    setLocalLocale(defaultLocale)
-  }, [defaultLocale])
-
-  const requireTranslations = React.useMemo(() => {
-    return (locale: string) => {
-      const current = translations?.[locale]
-      if (current != null) {
-        return Promise.resolve()
-      }
-      if (loadingRef.current?.[locale] == null) {
-        loadingRef.current[locale] = import(`domains/application/translations/${locale}.json`)
-      }
-      loadingRef.current[locale].then(async (Module) => {
-        if (Module?.default != null) {
-          const data = await (await fetch(Module.default)).json()
-          setTranslations(merge({}, translations, { [locale]: data }))
-        }
-      })
-      return loadingRef.current[locale]
-    }
-  }, [locale, translations])
+export const access = (key: string, locale: LocaleRegion, translations: Translations) => {
+  const access = [...key.split('.')] as [LocaleRegion, ...string[]]
+  const localeTranslations = translations?.[locale]
 
-  const t = React.useMemo(() => (key: string, options?: { locale?: LocaleRegion }) => {
-    React.useEffect(() => {
-      if (options?.locale == null) {
-        return
-      }
-      requireTranslations(options?.locale)?.then(() => {
-        if (options?.locale == null) {
-          return
-        }
-        setLocale(options?.locale)
-      })
-    }, [locale])
-
-    if (translations === null) {
-      return key
-    }
+  if (localeTranslations == null) {
+    return key
+  }
 
-    const access = [...key.split('.')] as [LocaleRegion, ...string[]]
-    const localeTranslations = translations?.[locale]
+  const value = access.reduce((acc: Translations[string], key) => {
+    // @ts-expect-error expected
+    return acc?.[key]
+  }, localeTranslations)
 
-    if (localeTranslations == null) {
-      return key
-    }
+  return (value?.value ?? key) as string
+}
 
-    const value = access.reduce((acc: Translations[string], key) => {
-      // @ts-expect-error expected
-      return acc?.[key]
-    }, localeTranslations)
+export const GlotstackProvider = ({ children, initialLocale, initialTranslations, onLocaleChange, onTranslationLoaded, importMethod }: GlotstackProviderProps) => {
+  if (initialLocale == null) {
+    throw new Error('initialLocale must be set')
+  }
+  const [locale, setLocale] = React.useState<LocaleRegion>(initialLocale)
+  const translationsRef = React.useRef(initialTranslations)
+  const loadingRef = React.useRef<Record<string, Promise<Translations>>>({})
+
+  const loadTranslations = React.useCallback(async (locale: string) => {
+    // TODO: if translations are loaded only reload if some condition is
+    try {
+      if (loadingRef.current?.[locale] != null) {
+        return (await loadingRef.current?.[locale])
+      }
+      loadingRef.current[locale] = importMethod(locale)
+      const result = await loadingRef.current[locale]
 
-    return (value?.value ?? key) as string
-  }, [translations, requireTranslations])
+      if (result == null) {
+        throw new Error(`Failed to load translation ${locale} ${JSON.stringify(result)}`)
+      }
+      if (translationsRef.current) {
+        translationsRef.current[locale] = result
+      }
+      onTranslationLoaded?.(locale, result)
+      return result
+    } catch (err) {
+      console.error('Unable to import translations', err)
+      throw err
+    }
+  }, [importMethod, onTranslationLoaded])
 
-  const setLocale = React.useMemo(() => (locale: LocaleRegion) => {
-    setLocalLocale(locale)
-    return requireTranslations(locale).then(_ => {
-      onLocaleChange(valueRef.current.locale, valueRef.current)
+  React.useEffect(() => {
+    const run = async () => {
+      onLocaleChange?.(locale)
+      const result = await loadTranslations(locale)
+    }
+    React.startTransition(() => {
+      run()
     })
-  }, [setLocalLocale, requireTranslations])
-
-  const valueRef = React.useRef<ContextType>({
-    requireTranslations,
-    locale,
-    translations: initialTranslations ?? {},
-    setLocale,
-    t
-  })
+  }, [locale])
 
-  const current = valueRef.current
-
-  React.useEffect(() => {
-    valueRef.current = {
-      translations,
-      requireTranslations,
+  const context = React.useMemo(() => {
+    return {
       setLocale,
+      translations: translationsRef.current ?? {},
       locale,
-      t
-    }
+      importMethod,
+      loadTranslations,
+      t: (key: string, opts?: { locale?: LocaleRegion }) => {
+        React.useEffect(() => {
+          if (opts?.locale == null) {
+            return
+          }
+          loadTranslations(opts?.locale)
+        }, [locale, opts?.locale])
+        return access(key, opts?.locale ?? locale, translationsRef.current ?? {})
+      }
 
-    if (!isEqual(valueRef.current, current)) {
-      onUpdated?.(valueRef.current)
     }
+  }, [locale, importMethod])
 
-  }, [locale, translations, requireTranslations])
-
-  React.useEffect(() => {
-    requireTranslations(locale)
-  }, [requireTranslations, locale])
-
-  return <GlotstackContext.Provider value={valueRef.current}>
+  return <GlotstackContext.Provider value={context}>
     {children}
   </GlotstackContext.Provider>
 }
 
+export const useGlotstack = () => {
+  return React.useContext(GlotstackContext)
+}
+
 
 export const useTranslations = (_options?: Record<never, never>) => {
   const context = React.useContext(GlotstackContext)

package/src/util/findConfig.ts

@@ -0,0 +1,26 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+/**
+ * Recursively looks for `.glotstack.json` from the current directory up to the root.
+ * @param startDir The directory to start the search from. Defaults to process.cwd().
+ * @returns The absolute path to the file if found, or null if not found.
+ */
+export function findGlotstackConfig(startDir: string = process.cwd()): string | null {
+  let currentDir = path.resolve(startDir);
+
+  while (true) {
+    const candidate = path.join(currentDir, '.glotstack.json');
+    if (fs.existsSync(candidate)) {
+      return candidate;
+    }
+
+    const parentDir = path.dirname(currentDir);
+    if (parentDir === currentDir) {
+      break; // Reached root
+    }
+    currentDir = parentDir;
+  }
+
+  return null;
+}

package/src/util/object.ts

@@ -25,7 +25,7 @@ type MergeTarget = Record<string|number|symbol, any>
 
 export function merge(target: MergeTarget, ...sources: MergeTarget[]): MergeTarget {
   return sources.reduce((previous, current) => {
-    return merge(previous, current);
+    return _merge(previous, current);
   }, target)
 }
 
@@ -49,4 +49,3 @@ export function isEqual(a: any, b: any): boolean {
 
   return false;
 }
-

package/src/util/yaml.ts

@@ -0,0 +1,11 @@
+import yaml from 'js-yaml';
+
+
+export function loadYaml(yamlString: string) {
+  try {
+    return yaml.load(yamlString);
+  } catch (e) {
+    console.error('Error converting yaml to JSON', e)
+    throw new Error('Could not convert yaml to JSON')
+  }
+}

package/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "exclude": ["node_modules", "dist"],
-  "include": ["./"],
+  "include": ["./src"],
   "files": ["./types/global.d.ts"],
   "compilerOptions": {
     "outDir": "dist",
@@ -13,7 +13,6 @@
     "baseUrl": ".",
     "paths": {
     },
-    "rootDirs": ["./src/*"],
     "esModuleInterop": true,
     "skipLibCheck": true,
     "forceConsistentCasingInFileNames": true,