glotstack 0.0.4 → 0.0.6

package/package.json

@@ -1,25 +1,27 @@
 {
   "name": "glotstack",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "author": "JD Cumpson",
   "license": "MIT",
   "private": false,
   "dependencies": {
-    "commander": "^13.1.0"
+    "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.3",
+    "@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"

package/src/cli.tsx

@@ -1,17 +1,83 @@
 import { Command, program } from 'commander'
 import path from 'path'
-import { promises as fs } from 'fs'
+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', 'http://localhost:4001')
+    .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')
@@ -26,16 +92,16 @@ async function run(args: string[]) {
           const text = await fs.readFile(configPath, 'utf-8')
           config = JSON.parse(text)
           console.info('Loaded config file', config)
-        } catch(err) {
+        } catch (err) {
           //pass
         }
       }
 
       const resolved = merge(config, options, { outputLocales })
-      const { apiOrigin, sourcePath, outputDir, projectId} = resolved
+      const { apiOrigin, sourcePath, outputDir, projectId } = resolved
 
       if ((resolved.outputLocales as string[]).includes('en-US')) {
-        console.warn('en-US detected in outputLocales, removing');
+        console.warn('en-US detected in outputLocales, removing')
         resolved.outputLocales = resolved.outputLocales.filter((x: string) => x !== 'en-US')
       }
 
@@ -49,52 +115,34 @@ async function run(args: string[]) {
         throw new Error('outputDir must be specified')
       }
 
-      const url = `${apiOrigin}/api/translations`
-      console.info(`Fetching translations from: ${url}`)
-
       const absPath = path.resolve(sourcePath)
       const fileContent = await fs.readFile(absPath, 'utf-8')
 
       let json = null
       try {
         json = loadYaml(fileContent)
-      } catch(err) {
+      } catch (err) {
         try {
           json = JSON.parse(fileContent)
-        } catch(err) {
+        } catch (err) {
           console.error('Unable to parse source file ', absPath, err)
-          throw err;
+          throw err
         }
       }
 
       const body = {
         locales: resolved.outputLocales,
         translations: json,
-        ...{ ... (projectId != null ? {projectId} : {})},
-      }
-
-      const headers ={
-        'Content-Type': 'application/json',
-        'Authorization': `Bearer ${resolved.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}`)
-
-        const data = await res.json()
-        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))
-        })
-        // fs.writeFile(`${outputDir}/source.json`, JSON.stringify(json, null, 2))
-      } catch (err) {
-        console.error('Fetch failed:', err)
-        process.exit(1)
+        ...{ ... (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)

package/src/index.tsx

@@ -68,12 +68,12 @@ export const GlotstackProvider = ({ children, initialLocale, initialTranslations
   if (initialLocale == null) {
     throw new Error('initialLocale must be set')
   }
-
   const [locale, setLocale] = React.useState<LocaleRegion>(initialLocale)
-  const [translations, setTranslations] = React.useState(initialTranslations)
+  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])
@@ -84,14 +84,16 @@ export const GlotstackProvider = ({ children, initialLocale, initialTranslations
       if (result == null) {
         throw new Error(`Failed to load translation ${locale} ${JSON.stringify(result)}`)
       }
-      setTranslations({ ...translations, [locale]: 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, translations, onTranslationLoaded, setTranslations])
+  }, [importMethod, onTranslationLoaded])
 
   React.useEffect(() => {
     const run = async () => {
@@ -106,7 +108,7 @@ export const GlotstackProvider = ({ children, initialLocale, initialTranslations
   const context = React.useMemo(() => {
     return {
       setLocale,
-      translations: translations ?? {},
+      translations: translationsRef.current ?? {},
       locale,
       importMethod,
       loadTranslations,
@@ -116,12 +118,12 @@ export const GlotstackProvider = ({ children, initialLocale, initialTranslations
             return
           }
           loadTranslations(opts?.locale)
-        }, [locale])
-        return access(key, locale, translations ?? {})
+        }, [locale, opts?.locale])
+        return access(key, opts?.locale ?? locale, translationsRef.current ?? {})
       }
 
     }
-  }, [locale, importMethod, translations])
+  }, [locale, importMethod])
 
   return <GlotstackContext.Provider value={context}>
     {children}