@orderly.network/i18n 2.0.8-alpha.0

package/README.md

@@ -0,0 +1,219 @@
+# @orderly.network/i18n
+
+Internationalization and cli tools for Orderly SDK. Based on i18next ecosystem.
+
+## Integration
+
+### 1. Wrap LocaleProvider
+
+The LocaleProvider is the core component that provides locale resources to your app. You must wrap you app with LocaleProvider.
+
+### 2. Provide Resources
+
+- By default, English (en) is included.
+- If you want to support other languages besides English, you need to explicitly import it from the i18n package and pass it to the resources prop of LocaleProvider.
+- Currently, we provider English (en) and Chinese (zh) locale files.
+- You can also extend the built-in messages by merging them with your own locale files.
+- With each release we will generate csv files (dist/locale.csv) for easy translation and we provide a cli to convert between csv and json files.
+- It can translate not only the ui in the SDK, but also other components you write outside of the SDK.
+
+### Example
+
+Here’s a complete example of how to set up the i18n integration:
+
+```typescript
+import { FC, ReactNode } from "react";
+import { WalletConnectorProvider } from "@orderly.network/wallet-connector";
+import { OrderlyAppProvider } from "@orderly.network/react-app";
+import {
+  LocaleProvider,
+  Resources,
+  LocaleCode,
+  zh,
+} from "@orderly.network/i18n";
+
+// extend or overrides English translations
+const extendEn = {
+  "extend.trading": "Trading",
+};
+
+// extend or overrides chinese translations
+const extendZh = {
+  "extend.trading": "交易",
+};
+
+type ExtendLocaleMessages = typeof extendEn;
+
+// define language resources
+const resources: Resources<ExtendLocaleMessages> = {
+  en: extendEn,
+  zh: {
+    ...zh,
+    ...extendZh,
+  },
+};
+
+const OrderlyProvider: FC<{ children: ReactNode }> = (props) => {
+  const onLocaleChange = (locale: LocaleCode) => {};
+
+  return (
+    <LocaleProvider resources={resources} onLocaleChange={onLocaleChange}>
+      <WalletConnectorProvider>
+        <OrderlyAppProvider
+          brokerId="orderly"
+          brokerName="Orderly"
+          networkId="testnet"
+        >
+          {props.children}
+        </OrderlyAppProvider>
+      </WalletConnectorProvider>
+    </LocaleProvider>
+  );
+};
+```
+
+### Add more languages
+
+We also support adding more custom languages
+
+```typescript
+import { FC, ReactNode } from "react";
+import { WalletConnectorProvider } from "@orderly.network/wallet-connector";
+import { OrderlyAppProvider } from "@orderly.network/react-app";
+import {
+  LocaleProvider,
+  Resources,
+  zh,
+  LocaleEnum,
+  LocaleCode,
+  Language,
+} from "@orderly.network/i18n";
+
+// japanese locale
+const ja = {
+  "extend.ja": "日本語",
+};
+
+// korean locale
+const ko = {
+  "extend.ko": "한국어",
+};
+
+// define language resources
+const resources: Resources = {
+  en,
+  ja,
+  ko,
+};
+
+// custom languages
+const languages: Language[] = [
+  { localCode: LocaleEnum.en, displayName: "English" },
+  { localCode: LocaleEnum.ja, displayName: "日本語" },
+  { localCode: LocaleEnum.ko, displayName: "한국어" },
+];
+
+const OrderlyProvider: FC<{ children: ReactNode }> = (props) => {
+  const onLocaleChange = (locale: LocaleCode) => {};
+
+  return (
+    <LocaleProvider
+      resources={resources}
+      languages={languages}
+      onLocaleChange={onLocaleChange}
+    >
+      <WalletConnectorProvider>
+        <OrderlyAppProvider
+          brokerId="orderly"
+          brokerName="Orderly"
+          networkId="testnet"
+        >
+          {props.children}
+        </OrderlyAppProvider>
+      </WalletConnectorProvider>
+    </LocaleProvider>
+  );
+};
+```
+
+## CLI
+
+## Usage
+
+The package provides a CLI tool for managing Internationalization files.
+
+```bash
+npx @orderly.network/i18n <command> [options]
+```
+
+## Commands
+
+### csv2json
+
+Convert a locale CSV file to multiple locale JSON files.
+
+```bash
+npx @orderly.network/i18n csv2json <input> <outputDir>
+```
+
+Example:
+
+```bash
+npx @orderly.network/i18n csv2json ./dist/locale.csv ./dist/locale
+```
+
+### json2csv
+
+Convert multiple locale JSON files to a single locale CSV file.
+
+```bash
+npx @orderly.network/i18n json2csv <input> <output>
+```
+
+Example:
+
+```bash
+npx @orderly.network/i18n json2csv ./dist/locale/en.json,./dist/locale/zh.json ./dist/locale.csv
+```
+
+### diffcsv
+
+Compare two locale CSV files to find differences.
+
+```bash
+npx @orderly.network/i18n diffcsv <oldFile> <newFile>
+```
+
+Example:
+
+```bash
+npx @orderly.network/i18n diffcsv ./dist/locale1.csv ./dist/locale2.csv
+```
+
+### generateCsv
+
+Generate a locale CSV file from your source files.
+
+```bash
+npx @orderly.network/i18n generateCsv <output>
+```
+
+Example:
+
+```bash
+npx @orderly.network/i18n generateCsv ./dist/locale.csv
+```
+
+### fillJson
+
+Fill values from an input locale JSON file and generate a new locale JSON file.
+
+```bash
+npx @orderly.network/i18n fillJson <input> <output>
+```
+
+Example:
+
+```bash
+npx @orderly.network/i18n fillJson ./src/locale/zh.json ./dist/locale/zh.json
+```

package/bin/cli.js

@@ -0,0 +1,172 @@
+#!/usr/bin/env node
+
+const yargs = require("yargs/yargs");
+const { hideBin } = require("yargs/helpers");
+const { generateCsv } = require("../script/generateCsv");
+const { json2csv } = require("../script/json2csv");
+const { csv2json } = require("../script/csv2json");
+const { diffCsv } = require("../script/diffCsv");
+const { fillJson } = require("../script/fillJson");
+main();
+
+async function main() {
+  const argv = getArgv();
+
+  const { _, input, output, oldFile, newFile, outputDir } = argv;
+
+  const command = _[0];
+  // console.log("argv", argv);
+
+  switch (command) {
+    case "json2csv":
+      await json2csv(input, output);
+      break;
+    case "csv2json":
+      await csv2json(input, outputDir);
+      break;
+    case "diffcsv":
+      await diffCsv(oldFile, newFile);
+      break;
+    case "generateCsv":
+      await generateCsv(output);
+      break;
+    case "fillJson":
+      await fillJson(input, output);
+      break;
+    default:
+      console.log("Invalid command");
+      break;
+  }
+}
+
+function getArgv() {
+  const argv = yargs(hideBin(process.argv))
+    .scriptName("")
+    .usage("i18n locale tools")
+    .usage("$0 <command> [options]")
+    .strict()
+    // Error if no subcommand is provided
+    .demandCommand(1, "Please provide a valid subcommand")
+    .help()
+    // Add `-h` as an alias for `--help`
+    .alias("h", "help")
+
+    // csv2json command
+    .command(
+      "csv2json <input> <outputDir>",
+      "Convert locale CSV to multiple locale JSON files",
+      (yargs) => {
+        return yargs
+          .positional("input", {
+            describe: "Input path for the locale CSV file",
+            type: "string",
+            demandOption: true,
+          })
+          .positional("outputDir", {
+            describe: "Output directory for locale JSON files",
+            type: "string",
+            demandOption: true,
+          });
+      },
+      (argv) => {
+        console.log(
+          `Converting ${argv.input} to locale JSON files, output directory: ${argv.outputDir}`
+        );
+      }
+    )
+
+    // json2csv command
+    .command(
+      "json2csv <input> <output>",
+      "Convert locale JSON files to a locale CSV file",
+      (yargs) => {
+        return yargs
+          .positional("input", {
+            describe:
+              "Path to locale JSON file(s) (supports multiple files, separated by commas)",
+            type: "string",
+            demandOption: true,
+          })
+          .positional("output", {
+            describe: "Output path for the locale CSV file",
+            type: "string",
+            demandOption: true,
+          });
+      },
+      (argv) => {
+        const inputFiles = argv.input.split(","); // Parse multiple input files
+        console.log(
+          `Converting locale JSON files: ${inputFiles.join(
+            ", "
+          )} to locale CSV: ${argv.output}`
+        );
+      }
+    )
+
+    // diffcsv command
+    .command(
+      "diffcsv <oldFile> <newFile>",
+      "Compare two locale CSV files",
+      (yargs) => {
+        return yargs
+          .positional("oldFile", {
+            describe: "Path to the first locale CSV file",
+            type: "string",
+            demandOption: true,
+          })
+          .positional("newFile", {
+            describe: "Path to the second CSV file",
+            type: "string",
+            demandOption: true,
+          });
+      },
+      (argv) => {
+        console.log(
+          `Comparing locale CSV files: ${argv.oldFile} and ${argv.newFile}`
+        );
+      }
+    )
+
+    // generateCsv command
+    .command(
+      "generateCsv <output>",
+      "Generate a locale CSV file",
+      (yargs) => {
+        return yargs.positional("output", {
+          describe: "Output path for the locale CSV file",
+          type: "string",
+          // Required
+          demandOption: true,
+        });
+      },
+      (argv) => {
+        console.log(`Generating locale CSV file at: ${argv.output}`);
+      }
+    )
+
+    // fillJson command
+    .command(
+      "fillJson <input> <output>",
+      "Fill values from the input locale JSON file and generate a new locale JSON file",
+      (yargs) => {
+        return yargs
+          .positional("input", {
+            describe: "Input path for the locale JSON file",
+            type: "string",
+            demandOption: true,
+          })
+          .positional("output", {
+            describe: "Output path for the locale JSON file",
+            type: "string",
+            demandOption: true,
+          });
+      },
+      (argv) => {
+        console.log(
+          `Filling values from the input locale JSON file: ${argv.input} and generating a new locale JSON file: ${argv.output}`
+        );
+      }
+    ).argv;
+
+  return argv;
+}