From d528533d399f164fd9021d843b44c77491b58bd5 Mon Sep 17 00:00:00 2001
From: tequ <git@tequ.dev>
Date: Mon, 8 Jul 2024 12:51:41 +0900
Subject: [PATCH] [JA] translate websocket-api-tool page and related component

---
 @i18n/ja/translations.yaml                    | 23 ++++++++++++++++++-
 .../components/websocket-api/curl-modal.tsx   |  6 ++---
 .../websocket-api/data/command-list.json      |  1 -
 .../websocket-api/right-sidebar.tsx           | 14 ++++++++---
 .../dev-tools/websocket-api-tool.page.tsx     | 11 +++++----
 5 files changed, 42 insertions(+), 13 deletions(-)

diff --git a/@i18n/ja/translations.yaml b/@i18n/ja/translations.yaml
index bae5ceafbd..fa32745401 100644
--- a/@i18n/ja/translations.yaml
+++ b/@i18n/ja/translations.yaml
@@ -616,6 +616,28 @@ expand tx: txを展開
 expand all: すべて展開
 collapse all: すべて閉じる
 
+# resources/dev-tools/websocket-api-tool.page.tsx
+# TODO: translate currentMethod.description
+Read more: 詳細を見る
+Request: リクエスト
+Send request: リクエストを送信
+Connected: 接続済み
+Not Connected: 未接続
+Failed to Connect: 接続に失敗
+Responses: レスポンス
+"Keep last:": 表示数
+# resources/dev-tools/websocket-api/connection-modal.tsx
+Connection Settings: 接続先設定
+Close: 閉じる
+# resources/dev-tools/websocket-api/curl-modal.tsx
+cURL Syntax: cURL構文
+resources.dev-tools.websocket-api.curl.modal.desc.part1: コマンドラインインターフェースから
+resources.dev-tools.websocket-api.curl.modal.desc.part2: を使用してこれと同等のJSON-RPCリクエストを行うには、以下の構文を使用します。
+# resources/dev-tools/websocket-api/right-sidebar.tsx
+API Methods: APIメソッド
+Methods: メソッド
+Examples: の例
+
 Open Source.: オープンソース
 Jump to top of page: ページの先頭へ
 Edit page: ページを編集
@@ -662,7 +684,6 @@ References and APIs: リファレンスとAPI
 Everything You Need to Know: 全てはここに
 XRP Ledger address, transaction ID, or ledger index: XRP Ledgerアドレス、トランザクションID、またはレジャーインデックス
 Status: ステータス
-Not Connected: 接続されていません
 Transaction History: トランザクション履歴
 Initialize: 初期化
 Set up the necessary Testnet XRP addresses to send test payments.: テスト支払いに必要なTestnet XRPアドレスを設定する。
diff --git a/resources/dev-tools/components/websocket-api/curl-modal.tsx b/resources/dev-tools/components/websocket-api/curl-modal.tsx
index cf9b1a2e90..6293ef9870 100644
--- a/resources/dev-tools/components/websocket-api/curl-modal.tsx
+++ b/resources/dev-tools/components/websocket-api/curl-modal.tsx
@@ -54,9 +54,9 @@ export const CurlModal: React.FC<CurlProps> = ({
       <form>
         <div className="form-group">
           <label htmlFor="curl-box-1">
-            Use the following syntax to make the equivalent JSON-RPC
-            request using <a href="https://curl.se/">cURL</a> from a
-            commandline interface:
+            {translate('resources.dev-tools.websocket-api.curl.modal.desc.part1', 'Use the following syntax to make the equivalent JSON-RPC request using ')}
+            <a href="https://curl.se/">cURL</a>
+            {translate('resources.dev-tools.websocket-api.curl.modal.desc.part2',' from a commandline interface:')}
           </label>
           <textarea
             id="curl-box-1"
diff --git a/resources/dev-tools/components/websocket-api/data/command-list.json b/resources/dev-tools/components/websocket-api/data/command-list.json
index eb3586458b..a3f1243690 100644
--- a/resources/dev-tools/components/websocket-api/data/command-list.json
+++ b/resources/dev-tools/components/websocket-api/data/command-list.json
@@ -554,7 +554,6 @@
         "name": "ledger_entry - AMM",
         "description": "Returns a single Automated Market Maker object in its raw ledger format.",
         "link": "/docs/references/http-websocket-apis/public-api-methods/ledger-methods/ledger_entry#get-amm-object",
-        "status": "not_enabled",
         "body": {
           "id": "example_get_amm",
           "command": "ledger_entry",
diff --git a/resources/dev-tools/components/websocket-api/right-sidebar.tsx b/resources/dev-tools/components/websocket-api/right-sidebar.tsx
index a8c02a411a..869ed2dd63 100644
--- a/resources/dev-tools/components/websocket-api/right-sidebar.tsx
+++ b/resources/dev-tools/components/websocket-api/right-sidebar.tsx
@@ -25,14 +25,22 @@ export const RightSideBar: React.FC<RightSideBarProps> = ({
       <ul className="command-list" id="command_list">
         {commandList.map((list, index) => (
           <Fragment key={index}>
-            <li className="separator">{list.group}</li>
+            <li className="separator">
+              {
+                list.group.endsWith("Methods") ?
+                `${list.group.replace('Methods', '')}${translate('Methods')}` :
+                list.group.endsWith("Examples") ?
+                  `${list.group.replace('Examples', '')}${translate('Examples')}` :
+                  translate(list.group)
+              }
+            </li>
             {list.methods.map((method) => (
               <li
                 className={`method${method === currentMethod ? " active" : ""}`}
                 key={method.name}
               >
                 <Link
-                  to={`resources/dev-tools/websocket-api-tool#${slugify(method.name)}`}
+                  to={`/resources/dev-tools/websocket-api-tool#${slugify(method.name)}`}
                   onClick={() => setCurrentMethod(method)}
                 >
                   {method.name}&nbsp;
@@ -49,7 +57,7 @@ export const RightSideBar: React.FC<RightSideBarProps> = ({
                       className="status clio_only"
                       title="This method is only available from the Clio server."
                     >
-                      <i className=" fa fa-exclamation-circle"></i>
+                      <i className="fa fa-exclamation-circle"></i>
                     </span>
                   )}
                 </Link>
diff --git a/resources/dev-tools/websocket-api-tool.page.tsx b/resources/dev-tools/websocket-api-tool.page.tsx
index 2a84a0e5ff..2ddfb5f2a8 100644
--- a/resources/dev-tools/websocket-api-tool.page.tsx
+++ b/resources/dev-tools/websocket-api-tool.page.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState, useRef } from 'react';
 import { useLocation } from "react-router-dom";
 import { useThemeHooks } from '@redocly/theme/core/hooks';
+import { Link } from "@redocly/theme/components/Link/Link";
 import {
   JsonParam,
   StringParam,
@@ -213,12 +214,12 @@ export function WebsocketApiTool() {
                 />
               )}
               {currentMethod.link && (
-                <a
+                <Link
                   className="btn btn-outline-secondary api-readmore"
-                  href={currentMethod.link}
+                  to={currentMethod.link}
                 >
                   {translate("Read more")}
-                </a>
+                </Link>
               )}
             </div>
 
@@ -259,8 +260,8 @@ export function WebsocketApiTool() {
                     data-target="#wstool-1-connection-settings"
                   >
                     {`${selectedConnection.shortname}${
-                      connected ? " (Connected)" : " (Not Connected)"
-                    }${connectionError ? " (Failed to Connect)" : ""}`}
+                      connected ? ` (${translate('Connected')})` : ` (${translate('Not Connected')})`
+                    }${connectionError ? ` (${translate('Failed to Connect')})` : ""}`}
                   </button>
                   {isConnectionModalVisible && (
                     <ConnectionModal