Skip to content

Commit 75d92af

Browse files
yini-chenyini-chen
authored
feat: Support English version (#177)
* 插件国际化改造 * 插件国际化改造 * feat: 插件语言随系统变化，也可通过配置项切换语言 * feat: 支持英文版API文档 * feat: 插件文案国际化 * feat: webview 国际化 * feat: webview 国际化新增文案 * test: 国际化单测 * chore: update vscodeignore * chore: update deps * fix: 数据结构文档展示问题修复
1 parent b903422 commit 75d92af

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

76 files changed

+5246
-2025
lines changed

‎.gitignore

+4
Original file line numberDiff line numberDiff line change
@@ -40,3 +40,7 @@ media/out/
4040
media/dist/assets
4141

4242
*.local.js
43+
*.local.ts
44+
*.local.mjs
45+
46+
scripts

‎.vscodeignore

+2
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,5 @@ tsconfig.json
1414
*.md
1515
!README.md
1616
!CHANGELOG.md
17+
scripts
18+
coverage

‎media/next-env.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,4 +2,4 @@
22
/// <reference types="next/image-types/global" />
33

44
// NOTE: This file should not be edited
5-
// see https://nextjs.org/docs/basic-features/typescript for more information.
5+
// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.

‎media/package.json

+1-2
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919
"@vscode-elements/elements": "^1.3.0",
2020
"ahooks": "3.8.1",
2121
"antd": "^5.20.5",
22-
"intl-format": "^1.2.0",
2322
"load-script": "^2.0.0",
2423
"lodash": "^4.17.20",
2524
"next": "^14.2.13",
@@ -58,6 +57,6 @@
5857
"react-syntax-highlighter": "^15.5.0",
5958
"tailwindcss": "^3.4.13",
6059
"typescript": "^5",
61-
"vite": "^2.9.18"
60+
"vite": "^5.4.8"
6261
}
6362
}

‎media/src/components/APIPage/API.tsx

+18-13
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ import { APIPageContext } from "./context";
2222
import { PontUIService } from "../../service/UIService";
2323
import ApiResponseDoc from "./APIDocument/ApiResponseDoc";
2424
import Searcher from "../common/Searcher";
25+
import I18N from "../../utils/I18N";
26+
import { TableI18N } from "../../utils/utils";
2527

2628
export class APIProps {
2729
selectedApi?: PontSpec.PontAPI;
@@ -48,6 +50,7 @@ export const API: React.FC<APIProps> = (props) => {
4850
const initValue = React.useMemo(() => {
4951
return {
5052
schemas: definitions as any,
53+
I18N: new TableI18N(),
5154
getRefSchema: getSchema,
5255
renderTypeColAppendix: (node: any) => {
5356
if (node?.nodeValue?.schema.in) {
@@ -72,7 +75,7 @@ export const API: React.FC<APIProps> = (props) => {
7275
return (
7376
<tr>
7477
<td colSpan={2} style={{ padding: "15px 0", textAlign: "center" }}>
75-
无出参定义
78+
{I18N.ide.main.common.noOutputParameterDefinition}
7679
</td>
7780
</tr>
7881
);
@@ -122,9 +125,9 @@ export const API: React.FC<APIProps> = (props) => {
122125
});
123126

124127
const tabs = [
125-
{ tab: "文档", key: "doc" },
126-
{ tab: "调试", key: "debug" },
127-
{ tab: "代码示例", key: "sdk" },
128+
{ tab: I18N.ide.main.home.document, key: "doc" },
129+
{ tab: I18N.ide.main.explorer.debug, key: "debug" },
130+
{ tab: I18N.ide.main.common.codeSample, key: "sdk" },
128131
];
129132

130133
const [pageEl, resizeObserverEntry] = useResizeObserver();
@@ -142,13 +145,13 @@ export const API: React.FC<APIProps> = (props) => {
142145
) : null}
143146
<div className="mb-4 bg-[var(--vscode-editor-background)]">
144147
<div className="border-t border-gray-100 px-5 py-4 text-base font-medium text-[var(--vscode-foreground)]">
145-
请求参数
148+
{I18N.ide.main.explorer.requestParameter}
146149
</div>
147150
<ApiParamsDoc parameters={selectedApi?.parameters} apiName={selectedApi?.name} schemas={definitions as any} />
148151
</div>
149152
<div className="mb-4 bg-[var(--vscode-editor-background)]">
150153
<div className="border-t border-gray-100 px-5 py-4 text-base font-medium text-[var(--vscode-foreground)]">
151-
出参
154+
{I18N.ide.main.explorer.response}
152155
</div>
153156
<ApiResponseDoc selectedApi={selectedApi}></ApiResponseDoc>
154157
</div>
@@ -172,17 +175,17 @@ export const API: React.FC<APIProps> = (props) => {
172175
changeMode(key);
173176
}}
174177
>
175-
<Tab.Item key="debug-doc" title="API 文档">
178+
<Tab.Item key="debug-doc" title={I18N.ide.main.notFound.APIDoc}>
176179
<div className="grid h-[calc(100vh_-_177px)] w-full bg-[var(--vscode-editor-background)]">
177180
<div className="scrollbar-custom overflow-scroll">{documentComp}</div>
178181
</div>
179182
</Tab.Item>
180-
<Tab.Item key="sdk" title="示例代码">
183+
<Tab.Item key="sdk" title={I18N.ide.main.common.codeSample}>
181184
<div className="content">
182185
<TrySDK isExpand={isExpand}></TrySDK>
183186
</div>
184187
</Tab.Item>
185-
<Tab.Item key="debug" title="调试结果">
188+
<Tab.Item key="debug" title={I18N.ide.main.common.debugResult}>
186189
<div className="content">
187190
<TryAPI></TryAPI>
188191
</div>
@@ -206,13 +209,15 @@ export const API: React.FC<APIProps> = (props) => {
206209

207210
const openNotification = () => {
208211
notification.open({
209-
message: "体验调研",
212+
message: I18N.ide.main.common.experienceResearch,
210213
duration: null,
211214
description: (
212215
<span>
213-
您对插件的使用体验满意吗？点击
214-
<a href="https://g.alicdn.com/aes/tracker-survey-preview/0.0.13/survey.html?pid=fePxMy&id=3486">体验问卷</a>
215-
进行吐槽或夸赞，您的反馈对我们十分重要！
216+
{I18N.ide.main.common.noSatisfiedToClick}
217+
<a href="https://g.alicdn.com/aes/tracker-survey-preview/0.0.13/survey.html?pid=fePxMy&id=3486">
218+
{I18N.ide.main.common.experienceQuestionnaire}
219+
</a>
220+
{I18N.ide.main.common.feedbackIsImportant}
216221
</span>
217222
),
218223
onClose: () => {

‎media/src/components/APIPage/APIDebugger/APIDebugger.tsx

+4-4
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@
44
*/
55
import { Button } from "@alicloud/console-components";
66
import React from "react";
7-
import I18N from "../../../utils/I18N";
87
import { SemixForm } from "../../SemixFormRender";
98
import { APIPageContext } from "../context";
109
import { APIGuide } from "./APIGuide";
1110
import RegionSelector from "./RegionSelector";
1211
import { xconsoleWidgets } from "./widgets/xconsole";
1312
import { debugForbiddenProducts } from "../../../utils/utils";
13+
import I18N from "../../../utils/I18N";
1414

1515
export class APIDebuggerProps {}
1616

@@ -52,11 +52,11 @@ export const APIDebugger: React.FC<APIDebuggerProps> = (props) => {
5252
schemaForm.setFormData({});
5353
}}
5454
>
55-
{I18N.main.explorer.empty}
55+
{I18N.ide.main.explorer.empty}
5656
</Button>
5757
{debugForbiddenProducts?.includes(`${product}__${version}`) ? (
5858
<a href={apiMeta?.externalDocs?.url}>
59-
<Button type="primary">去门户网页版调试</Button>
59+
<Button type="primary">{I18N.ide.main.common.gotoPortal}</Button>
6060
</a>
6161
) : (
6262
<Button
@@ -72,7 +72,7 @@ export const APIDebugger: React.FC<APIDebuggerProps> = (props) => {
7272
});
7373
}}
7474
>
75-
{I18N.main.explorer.debug}
75+
{I18N.ide.main.explorer.debug}
7676
</Button>
7777
)}
7878
</div>

‎media/src/components/APIPage/APIDebugger/APIGuide.tsx

+9-8
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
import { Balloon, Tag } from "@alicloud/console-components";
66
import React from "react";
77
import { SemixMarkdown } from "semix-schema-table";
8+
import I18N from "../../../utils/I18N";
89

910
export class APIGuideProps {
1011
schema?: any;
@@ -109,40 +110,40 @@ export const APIGuide = React.memo((props: APIGuideProps) => {
109110
}
110111
>
111112
<div className="api-debugger-param-desc !text-xs">
112-
<span className="config-title-desc text-gray-500">描述</span>
113+
<span className="config-title-desc text-gray-500">{I18N.ide.main.explorer.description}</span>
113114
<div className="!text-xs">
114115
<SemixMarkdown source={description}></SemixMarkdown>
115116
</div>
116117
{props.schema?.example ? (
117118
<>
118-
<div className="config-title mt-2 text-gray-500">
119-
<span>示例值</span>
119+
<div className="config-title mt-2 text-gray-500">
120+
<span>{I18N.ide.main.explorer.sampleValue}</span>
120121
</div>
121122

122123
<div className="config-content">{props.schema?.example}</div>
123124
</>
124125
) : null}
125126
{props.schema?.maximum ? (
126127
<>
127-
<div className="config-title mt-2 text-gray-500">最大值</div>
128+
<div className="config-title mt-2 text-gray-500">{I18N.ide.main.common.maximum}</div>
128129
<div className="config-content">{props.schema?.maximum}</div>
129130
</>
130131
) : null}
131132
{props.schema?.minimum ? (
132133
<>
133-
<div className="config-title mt-2 text-gray-500">最小值</div>
134+
<div className="config-title mt-2 text-gray-500">{I18N.ide.main.common.minimum}</div>
134135
<div className="config-content">{props.schema?.minimum}</div>
135136
</>
136137
) : null}
137138
{props.schema?.format ? (
138139
<>
139-
<div className="config-title mt-2 text-gray-500">格式</div>
140+
<div className="config-title mt-2 text-gray-500">{I18N.ide.main.common.format}</div>
140141
<div className="config-content">{props.schema?.format}</div>
141142
</>
142143
) : null}
143144
{props.schema?.enum?.length ? (
144145
<>
145-
<div className="config-title mt-2 text-gray-500">枚举值</div>
146+
<div className="config-title mt-2 text-gray-500">{I18N.ide.main.common.enum}</div>
146147
{props.schema?.enum?.map((item) => (
147148
<Tag size="small" type="normal" style={{ marginRight: "4px", borderRadius: "2px" }}>
148149
{item.value || item}
@@ -152,7 +153,7 @@ export const APIGuide = React.memo((props: APIGuideProps) => {
152153
) : null}
153154
{props.schema?.pattern ? (
154155
<>
155-
<div className="config-title mt-2 text-gray-500">正则</div>
156+
<div className="config-title mt-2 text-gray-500">{I18N.ide.main.common.regular}</div>
156157
<div className="config-content">{props.schema?.pattern}</div>
157158
</>
158159
) : null}

‎media/src/components/APIPage/APIDebugger/RegionSelector.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export const RegionSelector: React.FC<RegionSelectorProps> = (props) => {
3737

3838
return (
3939
<div className="flex">
40-
<div className="m-auto w-16">{I18N.main.explorer.endPoint}:</div>
40+
<div className="m-auto w-16">{I18N.ide.main.explorer.endPoint}:</div>
4141
<Select
4242
style={{ width: "300px" }}
4343
value={props.regionId?.length ? props.regionId : "cn-hangzhou"}

‎media/src/components/APIPage/APIDebugger/widgets/xconsole/JsonEdit.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { CommonWidgetProps } from "../types";
88
import { Editor } from "@monaco-editor/react";
99
import { APIPageContext } from "../../../context";
1010
import { getMonacoTheme } from "../../../../utils";
11+
import I18N from "../../../../../utils/I18N";
1112

1213
export class JsonEditProps extends CommonWidgetProps {}
1314

@@ -34,7 +35,7 @@ export const JsonEdit: React.FC<JsonEditProps> = (props) => {
3435
const val = JSON.parse(curval);
3536
props.onChange(val);
3637
} catch {
37-
setErrMsg("json 格式错误");
38+
setErrMsg(I18N.xconsole.JsonEdit.formatError);
3839
}
3940
}}
4041
>

‎media/src/components/APIPage/APIDebugger/widgets/xconsole/Struct.tsx

+8-7
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@
55
// import { AmpIcon } from '@ali/amp-base';
66
// import { CommonWidgetProps } from '@ali/api-component';
77
// import { LinkButton } from '@alicloud/console-components-actions';
8-
import React from 'react';
9-
import { CommonWidgetProps } from '../types';
8+
import React from "react";
9+
import { CommonWidgetProps } from "../types";
10+
import I18N from "../../../../../utils/I18N";
1011
// import { addParamStruct } from './utils';
1112
// import { addParamStruct } from '../utils';
1213

@@ -17,7 +18,7 @@ export class StructProps extends CommonWidgetProps {
1718

1819
export const Struct: React.FC<StructProps> = (props) => {
1920
if (props.value) {
20-
if (typeof props.value === 'string') {
21+
if (typeof props.value === "string") {
2122
let value = props.value;
2223
try {
2324
value = JSON.parse(props.value);
@@ -27,17 +28,17 @@ export const Struct: React.FC<StructProps> = (props) => {
2728
// addParamStruct(props.schemaPath, props.schema);
2829
}
2930
return (
30-
<div style={{ marginBottom: '16px' }}>
31+
<div style={{ marginBottom: "16px" }}>
3132
<a
3233
// href="javascript:;"
33-
style={{ textDecoration: 'none' }}
34+
style={{ textDecoration: "none" }}
3435
className="op"
3536
onClick={() => {
3637
// addParamStruct(props.schemaPath, props.schema);
3738
}}
3839
>
39-
<div className='codicon codicon-add' style={{ marginRight: '5px', marginTop: '1px' }}></div>
40-
添加数据结构
40+
<div className="codicon codicon-add" style={{ marginRight: "5px", marginTop: "1px" }}></div>
41+
{I18N.xconsole.Struct.addStruct}
4142
</a>
4243
</div>
4344
);

‎media/src/components/APIPage/APIDebugger/widgets/xconsole/UploadFile.tsx

+13-10
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,21 @@
33
* @description 上传文件
44
*/
55

6-
import { Button, message, Upload } from 'antd';
7-
import { UploadOutlined } from '@ant-design/icons';
8-
import * as React from 'react';
9-
import { CommonWidgetProps } from '../types';
10-
import { APIPageContext } from '../../../context';
6+
import * as React from "react";
7+
import { CommonWidgetProps } from "../types";
8+
import { APIPageContext } from "../../../context";
9+
import I18N from "../../../../../utils/I18N";
1110
// import { CommonWidgetProps } from '@ali/api-component';
1211
// import { useLocation } from 'react-router-dom';
1312

1413
export class UploadFileProps extends CommonWidgetProps {
15-
onChange: (value: any) => void;
14+
onChange: (value: any) => void;
1615
}
1716

1817
export const UploadFile: React.FC<UploadFileProps> = (props) => {
1918
const [isUpload, changeIsUpload] = React.useState(false);
2019
const { apiMeta } = APIPageContext.useContainer();
21-
// const location = useLocation();
22-
// const [product, version, apiName] = location?.pathname?.replace('/api/', '').split('/');
23-
const [fileInfo, setFileInfo] = React.useState({ fileName: '', mime: '' } as FileInfo);
20+
const [fileInfo, setFileInfo] = React.useState({ fileName: "", mime: "" } as FileInfo);
2421

2522
type FileInfo = {
2623
fileName: string;
@@ -36,7 +33,13 @@ export const UploadFile: React.FC<UploadFileProps> = (props) => {
3633
};
3734

3835
return (
39-
<div>暂不支持文件传输调试，您可以到<a href={apiMeta?.externalDocs?.url} target='_blank'>开发者门户网页版</a>进行调试</div>
36+
<div>
37+
{I18N.xconsole.UploadFile.notSupportDebug}
38+
<a href={apiMeta?.externalDocs?.url} target="_blank">
39+
{I18N.xconsole.UploadFile.explorerWebsite}
40+
</a>
41+
{I18N.xconsole.UploadFile.processDebug}
42+
</div>
4043
// <Upload
4144
// className="jsonschema-form-widget"
4245
// action={getUploadPath(product, version, apiName, fileInfo)}

0 commit comments

Comments
 (0)