Merge pull request #1572 from sora-xor/release/1.42.0

Release 1.42.0

README.md

@@ -79,3 +79,18 @@ yarn electron:build --linux --mac zip dmg --win portable --x64 --ia32
 ```
 
 Executable files (`.exe`, `.dmg` or `.snap`) will be located in `dist_electron` folder.
+
+
+## How to add translations?
+1) Add your translations to `src/lang/messages.ts`.
+2) Run script to generate `en.json` file from `src/lang/messages.ts`. This will update `en.json` file with new translations, arranged in alphabetical order.
+```
+yarn lang:generate
+```
+3) Load updated `en.json` file to `Lokalise`.
+4) Add translations for other languages in `Localise`.
+5) Download translations from `Localise`, update these files in project.
+6) Run script to order translations alphabetical in `en.json` file (Localise has it's own translations order).
+```
+yarn lang:fix
+```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "polkaswap-exchange-web",
-  "version": "1.41.0",
+  "version": "1.42.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/sora-xor/polkaswap-exchange-web.git"
@@ -19,7 +19,8 @@
     "inspect": "vue-cli-service inspect > .webpack-config.js",
     "electron:build": "vue-cli-service electron:build",
     "electron:serve": "vue-cli-service electron:serve",
-    "generate-lang-json": "tsx ./scripts/generateLocaleJson.ts",
+    "lang:generate": "tsx ./scripts/lang/generate.ts",
+    "lang:fix": "tsx ./scripts/lang/fix.ts",
     "test:unit": "vue-cli-service test:unit --testPathIgnorePatterns Translation.spec.ts",
     "test:translation": "vue-cli-service test:unit -- Translation.spec.ts",
     "test:e2e": "vue-cli-service test:e2e",
@@ -28,7 +29,7 @@
   "dependencies": {
     "@cedelabs/widgets-universal": "^1.3.1",
     "@metamask/detect-provider": "^2.0.0",
-    "@soramitsu/soraneo-wallet-web": "1.40.16",
+    "@soramitsu/soraneo-wallet-web": "1.41.1",
     "@walletconnect/ethereum-provider": "^2.13.3",
     "@walletconnect/modal": "^2.6.2",
     "core-js": "^3.37.1",

scripts/lang/fix.ts

@@ -0,0 +1,15 @@
+import fs from 'fs';
+
+import { format, sortAlpha } from './utils';
+
+(async function main() {
+  const buildDir = './src/lang';
+  if (!fs.existsSync(buildDir)) {
+    fs.mkdirSync(buildDir);
+  }
+  const langObj = (await import('../../src/lang/en.json')).default;
+  const formatted = format(langObj);
+  const sorted = sortAlpha(formatted);
+  fs.writeFileSync(`${buildDir}/en.json`, JSON.stringify(sorted, null, 4));
+  console.info(`${buildDir}/en.json fixed!`);
+})();

scripts/generateLocaleJson.ts → scripts/lang/generate.ts

@@ -2,6 +2,8 @@ import fs from 'fs';
 
 import { JSDOM } from 'jsdom';
 
+import { format, sortAlpha } from './utils';
+
 // Mock browser dependencies for imported libraries
 const dom = new JSDOM();
 global.document = dom.window.document as any;
@@ -17,50 +19,14 @@ Object.defineProperty(global.window, 'matchMedia', {
   }),
 });
 
-function format(obj: any) {
-  if (typeof obj !== 'object' || obj === null) return obj;
-
-  const keys = Object.keys(obj);
-
-  if (!keys.length) return null;
-
-  const formatted = {};
-
-  keys.forEach((key) => {
-    const inner = format(obj[key]);
-    if (inner) {
-      formatted[key] = inner;
-    }
-  });
-
-  return formatted;
-}
-
-function sortAlpha(obj: any) {
-  if (typeof obj !== 'object') return obj;
-
-  const sorted = {};
-
-  const keys = Object.keys(obj)
-    .map((k) => [k, k.toLowerCase()])
-    .sort((a, b) => a[1].localeCompare(b[1]))
-    .map(([k]) => k);
-
-  keys.forEach((key) => {
-    sorted[key] = sortAlpha(obj[key]);
-  });
-
-  return sorted;
-}
-
 (async function main() {
   const buildDir = './src/lang';
   if (!fs.existsSync(buildDir)) {
     fs.mkdirSync(buildDir);
   }
-  const langObj = (await import('../src/lang/messages')).default;
+  const langObj = (await import('../../src/lang/messages')).default;
   const formatted = format(langObj);
   const sorted = sortAlpha(formatted);
-  fs.writeFileSync(`${buildDir}/en-compare.json`, JSON.stringify(sorted, null, 4));
+  fs.writeFileSync(`${buildDir}/en.json`, JSON.stringify(sorted, null, 4));
   console.info(`${buildDir}/en.json created!`);
 })();

scripts/lang/utils.ts

@@ -0,0 +1,35 @@
+export function format(obj: any) {
+  if (typeof obj !== 'object' || obj === null) return obj;
+
+  const keys = Object.keys(obj);
+
+  if (!keys.length) return null;
+
+  const formatted = {};
+
+  keys.forEach((key) => {
+    const inner = format(obj[key]);
+    if (inner) {
+      formatted[key] = inner;
+    }
+  });
+
+  return formatted;
+}
+
+export function sortAlpha(obj: any) {
+  if (typeof obj !== 'object') return obj;
+
+  const sorted = {};
+
+  const keys = Object.keys(obj)
+    .map((k) => [k, k.toLowerCase()])
+    .sort((a, b) => a[1].localeCompare(b[1]))
+    .map(([k]) => k);
+
+  keys.forEach((key) => {
+    sorted[key] = sortAlpha(obj[key]);
+  });
+
+  return sorted;
+}

src/components/App/Alerts/CreateAlert.vue

@@ -20,7 +20,7 @@
     >
       <div v-if="amount" slot="left" class="price-input__prefix">$</div>
       <div class="price-input-inner" slot="top">
-        <div>{{ `${asset.symbol} ${t('exchange.price')}` }}</div>
+        <div>{{ `${asset.symbol} ${t('priceText')}` }}</div>
         <div class="price-input-inner-ratio">
           <span class="price-input-current-title">{{ t('alerts.currentPrice') }}</span>
           <formatted-amount-with-fiat-value

src/components/pages/OrderBook/BookWidget.vue

@@ -25,7 +25,7 @@
     </template>
 
     <div class="book-columns">
-      <div>{{ t('orderBook.price') }}</div>
+      <div>{{ t('priceText') }}</div>
       <div>{{ t('orderBook.amount') }}</div>
       <div>{{ t('orderBook.total') }}</div>
     </div>

src/components/pages/OrderBook/BuySell.vue

@@ -15,7 +15,7 @@
           <div class="delimiter" />
           <div class="order-book-pair-data">
             <div class="order-book-pair-data-item">
-              <span>{{ t('orderBook.price') }}</span>
+              <span>{{ t('priceText') }}</span>
               <span class="order-book-pair-data-item__value order-book-fiat">
                 <formatted-amount :value="orderBookPrice" />
               </span>
@@ -71,7 +71,7 @@
     <token-input
       :balance="getTokenBalance(quoteAsset)"
       :is-max-available="false"
-      :title="t('orderBook.price')"
+      :title="t('priceText')"
       :token="quoteAsset"
       :value="quoteValue"
       :disabled="isPriceInputDisabled"

src/components/pages/OrderBook/Dialogs/PlaceOrder.vue

@@ -20,7 +20,7 @@
         :disabled="isInsufficientBalance"
         @click="handleConfirm"
       >
-        {{ t('exchange.confirm') }}
+        {{ t('confirmText') }}
       </s-button>
     </template>
   </dialog-base>

src/components/pages/OrderBook/MarketTradesWidget.vue

@@ -9,7 +9,7 @@
     <s-table class="market-trades-table" :data="completedOrders">
       <s-table-column>
         <template #header>
-          <span class="market-trades__header">{{ t('orderBook.price') }}</span>
+          <span class="market-trades__header">{{ t('priceText') }}</span>
         </template>
         <template v-slot="{ row }">
           <span class="order-info price" :class="{ buy: row.isBuy }">{{ row.price }}</span>

src/components/pages/OrderBook/Popovers/PairListPopover.vue

@@ -31,7 +31,7 @@
       </s-table-column>
       <s-table-column width="90">
         <template #header>
-          <span>{{ t('orderBook.price') }}</span>
+          <span>{{ t('priceText') }}</span>
         </template>
         <template v-slot="{ row }">
           <formatted-amount :value="row.price" fiatSign="" />

src/components/pages/OrderBook/Tables/OrderTable.vue

@@ -44,7 +44,7 @@
       </s-table-column>
       <s-table-column width="126">
         <template #header>
-          <span>{{ t('orderBook.price') }}</span>
+          <span>{{ t('priceText') }}</span>
         </template>
         <template v-slot="{ row }">
           <div class="order-table__price">

src/components/pages/Referrals/ConfirmBonding.vue

@@ -25,7 +25,7 @@
     <template #footer>
       <account-confirmation-option with-hint class="confirmation-option" />
       <s-button type="primary" class="s-typography-button--large" @click="handleConfirmBonding">
-        {{ t('referralProgram.confirm.text') }}
+        {{ t('confirmText') }}
       </s-button>
     </template>
   </dialog-base>

src/components/pages/Swap/Confirm.vue

@@ -42,7 +42,7 @@
         :disabled="isInsufficientBalance"
         @click="handleConfirm"
       >
-        {{ t('exchange.confirm') }}
+        {{ t('confirmText') }}
       </s-button>
     </template>
   </dialog-base>