diff --git a/netlify.toml b/netlify.toml index 17f612e61f..944163d9d9 100644 --- a/netlify.toml +++ b/netlify.toml @@ -2,3 +2,8 @@ from = "/apisix/*" to = "http://139.217.190.60/apisix/:splat" status = 200 + +[[redirects]] + from = "/*" + to = "/index.html" + status = 200 diff --git a/web/cypress.json b/web/cypress.json index 88b22c07b4..9fb0b6162e 100644 --- a/web/cypress.json +++ b/web/cypress.json @@ -3,5 +3,9 @@ "viewportHeight": 1080, "baseUrl": "http://localhost:8000", "video": true, - "videoUploadOnPasses": false + "videoUploadOnPasses": false, + "retries": { + "runMode": 3, + "openMode": 0 + } } diff --git a/web/cypress/fixtures/export-route-dataset.json b/web/cypress/fixtures/export-route-dataset.json index 133971fa7e..15f70fc0c1 100644 --- a/web/cypress/fixtures/export-route-dataset.json +++ b/web/cypress/fixtures/export-route-dataset.json @@ -38,13 +38,13 @@ "weight": 1 } ], - "retries": 1, "timeout": { "connect": 6, "read": 6, "send": 6 }, "type": "roundrobin", + "scheme": "http", "pass_host": "pass" } } @@ -90,13 +90,13 @@ "weight": 1 } ], - "retries": 1, "timeout": { "connect": 6, "read": 6, "send": 6 }, "type": "roundrobin", + "scheme": "http", "pass_host": "pass" } } @@ -141,13 +141,13 @@ "weight": 1 } ], - "retries": 1, "timeout": { "connect": 6, "read": 6, "send": 6 }, "type": "roundrobin", + "scheme": "http", "pass_host": "pass" } } diff --git a/web/src/components/Plugin/PluginDetail.tsx b/web/src/components/Plugin/PluginDetail.tsx index 8dbdfe8376..a807b2d719 100644 --- a/web/src/components/Plugin/PluginDetail.tsx +++ b/web/src/components/Plugin/PluginDetail.tsx @@ -27,6 +27,8 @@ import { Alert, Space, Popconfirm, + Tooltip, + Input, } from 'antd'; import { useIntl } from 'umi'; import CodeMirror from '@uiw/react-codemirror'; @@ -105,13 +107,13 @@ const PluginDetail: React.FC = ({ const [codeMirrorMode, setCodeMirrorMode] = useState( codeMirrorModeList.JSON, ); - const modeOptions = [ + const modeOptions: { label: string; value: string }[] = [ { label: codeMirrorModeList.JSON, value: codeMirrorModeList.JSON }, { label: codeMirrorModeList.YAML, value: codeMirrorModeList.YAML }, ]; if (PLUGIN_UI_LIST.includes(name)) { - modeOptions.push({ label: codeMirrorModeList.UIForm, value: codeMirrorModeList.UIForm }); + modeOptions.push({ label: formatMessage({ id: 'component.plugin.form' }), value: codeMirrorModeList.UIForm }); } useEffect(() => { @@ -247,7 +249,7 @@ const PluginDetail: React.FC = ({ return ( <> = ({ border: 1px solid rgb(235, 237, 240); margin-top:10px; } + .ant-input[disabled] { + color: #000; + } `}
+ + + = ({ {type === 'global' && ( )} @@ -338,11 +346,26 @@ const PluginDetail: React.FC = ({ title="" subTitle={ pluginType === 'auth' && schemaType !== 'consumer' && (codeMirrorMode !== codeMirrorModeList.UIForm) ? ( - + ) : null } ghost={false} extra={[ + , + + + , , - , - ]} /> diff --git a/web/src/components/Plugin/UI/plugin.tsx b/web/src/components/Plugin/UI/plugin.tsx index 8d44a570b6..79a2df5754 100644 --- a/web/src/components/Plugin/UI/plugin.tsx +++ b/web/src/components/Plugin/UI/plugin.tsx @@ -15,7 +15,7 @@ * limitations under the License. */ import React from 'react'; -import { FormInstance } from 'antd/es/form'; +import type { FormInstance } from 'antd/es/form'; import { Empty } from 'antd'; import { useIntl } from 'umi'; @@ -34,7 +34,7 @@ export const PluginForm: React.FC = ({ name, renderForm, form }) => { const { formatMessage } = useIntl(); - if (!renderForm) { return }; + if (!renderForm) { return }; switch (name) { case 'basic-auth': diff --git a/web/src/components/Plugin/locales/en-US.ts b/web/src/components/Plugin/locales/en-US.ts index 890b0bbdf0..2b63c63573 100644 --- a/web/src/components/Plugin/locales/en-US.ts +++ b/web/src/components/Plugin/locales/en-US.ts @@ -28,4 +28,9 @@ export default { 'component.pluginForm.limit-conn.default_conn_delay.tooltip': 'the latency seconds of request when concurrent requests exceeding conn but below (conn + burst).', 'component.pluginForm.limit-conn.key.tooltip': 'to limit the concurrency level.For example, one can use the host name (or server zone) as the key so that we limit concurrency per host name. Otherwise, we can also use the client address as the key so that we can avoid a single client from flooding our service with too many parallel connections or requests.Now accept those as key: "remote_addr"(client\'s IP), "server_addr"(server\'s IP), "X-Forwarded-For/X-Real-IP" in request header, "consumer_name"(consumer\'s username).', 'component.pluginForm.limit-conn.rejected_code.tooltip': 'returned when the request exceeds conn + burst will be rejected.', + + 'component.plugin.form': 'Form', + 'component.plugin.format-codes.disable': 'Format JSON or YAML data', + 'component.plugin.editor': 'Plugin Editor', + 'component.plugin.noConfigurationRequired': 'Doesn\'t need configuration', }; diff --git a/web/src/components/Plugin/locales/zh-CN.ts b/web/src/components/Plugin/locales/zh-CN.ts index a035228a96..c106b2e0dc 100644 --- a/web/src/components/Plugin/locales/zh-CN.ts +++ b/web/src/components/Plugin/locales/zh-CN.ts @@ -28,4 +28,9 @@ export default { 'component.pluginForm.limit-conn.default_conn_delay.tooltip': '默认的典型连接（或请求）的处理延迟时间。', 'component.pluginForm.limit-conn.key.tooltip': '用户指定的限制并发级别的关键字，可以是客户端 IP 或服务端 IP。例如，可以使用主机名（或服务器区域）作为关键字，以便限制每个主机名的并发性。 否则，我们也可以使用客户端地址作为关键字，这样我们就可以避免单个客户端用太多的并行连接或请求淹没我们的服务。当前接受的 key 有："remote_addr"（客户端 IP 地址）, "server_addr"（服务端 IP 地址）, 请求头中的"X-Forwarded-For" 或 "X-Real-IP", "consumer_name"（consumer 的 username）。', 'component.pluginForm.limit-conn.rejected_code.tooltip': '当请求超过 conn + burst 这个阈值时，返回的 HTTP 状态码。', + + 'component.plugin.form': '表单', + 'component.plugin.format-codes.disable': '用于格式化 JSON 或 YAML 内容', + 'component.plugin.editor': '插件配置', + 'component.plugin.noConfigurationRequired': '本插件无需配置', }; diff --git a/web/src/components/RawDataEditor/RawDataEditor.tsx b/web/src/components/RawDataEditor/RawDataEditor.tsx index 3117bd2e95..880d00b901 100644 --- a/web/src/components/RawDataEditor/RawDataEditor.tsx +++ b/web/src/components/RawDataEditor/RawDataEditor.tsx @@ -146,18 +146,6 @@ const RawDataEditor: React.FC = ({ visible, readonly = true, type, data = } - onClick={() => { - window.open( - `https://apisix.apache.org/docs/apisix/admin-api#${type}`, - ); - }} - key={1} - > - Document - , , , { if (!result) { @@ -182,9 +170,21 @@ const RawDataEditor: React.FC = ({ visible, readonly = true, type, data = }); }}> , + , ]} /> = forwardRef( ({ form, disabled, list = [], showSelector, required = true }, ref) => { const { formatMessage } = useIntl(); @@ -130,487 +106,102 @@ const UpstreamForm: React.FC = forwardRef( setReadonly(Boolean(upstream_id) || disabled); }, [list]); - const CHash = () => ( - <> - - - - - - - - ); - const TimeUnit = () => s; - const NodeList = () => ( - - {(fields, { add, remove }) => ( - <> - - {fields.map((field, index) => ( - - - - - - - - - - - - - - - - - - {!readonly && ( - remove(field.name)} /> - )} - - - ))} - - {!readonly && ( - - - - )} - - )} - - ); const ActiveHealthCheck = () => ( - <> - - - - - - - - - - - - - - - - - - - - - - - + + + + + + {formatMessage({ id: 'page.upstream.step.healthyCheck.healthy.status' })} - - - - - - - - - - - + + + {formatMessage({ id: 'page.upstream.step.healthyCheck.unhealthyStatus' })} - - - - - - - - - - - - - {(fields, { add, remove }) => ( - <> - {fields.map((field, index) => ( - - - - - - - - - {!readonly && fields.length > 1 && ( - { - remove(field.name); - }} - /> - )} - - - - ))} - {!readonly && ( - - - - )} - - )} - - + + + + + + + Others + + + ); + const InActiveHealthCheck = () => ( - <> + + + {formatMessage({ id: 'page.upstream.step.healthyCheck.healthy.status' })} - - {(fields, { add, remove }) => ( - <> - - {fields.map((field, index) => ( - - - - - - - - {!readonly && ( - { - remove(field.name); - }} - /> - )} - - - ))} - - {!readonly && ( - - - - )} - - )} - - - - - - + + + {formatMessage({ id: 'page.upstream.step.healthyCheck.unhealthyStatus' })} - - {(fields, { add, remove }) => ( + + + + + + + ); + + const HealthCheckComponent = () => { + const options = [ + { + label: formatMessage({ id: 'page.upstream.step.healthyCheck.active' }), + name: ['checks', 'active'], + component: ( <> - - {fields.map((field, index) => ( - - - - - - - - {!readonly && fields.length > 1 && ( - { - remove(field.name); - }} - /> - )} - - - ))} - - {!readonly && ( - - - - )} + + - )} - - - - - - - , + }, + ] + + return ( + - - - - - - ); + {options.map(({ label, name, component }) => ( +
+ + + + + {() => { + if (form.getFieldValue(name)) { + return component; + } + return null; + }} + +
+ ))} + + ) + } + return ( = forwardRef( }} > {showSelector && ( - { setReadonly(Boolean(next.upstream_id)); if (prev.upstream_id !== next.upstream_id) { @@ -637,173 +229,32 @@ const UpstreamForm: React.FC = forwardRef( } return prev.upstream_id !== next.upstream_id; }} - > - - + }} + /> )} {!hiddenForm && ( - <> - - - - - {() => { - if (form.getFieldValue('type') === 'chash') { - return ; - } - return null; - }} - - {NodeList()} - - - - - - - + + + - { - return prev.pass_host !== next.pass_host; - }} - > - {() => { - if (form.getFieldValue('pass_host') === 'rewrite') { - return ( - - - - ); - } - return null; - }} - - - {timeoutFields.map(({ label, name, desc = '' }) => ( - - - - - - + + + + {timeoutFields.map((item, index) => ( + ))} - - {[ - { - label: formatMessage({ id: 'page.upstream.step.healthyCheck.active' }), - name: ['checks', 'active'], - component: ( - <> - - - - ), - }, - { - label: formatMessage({ id: 'page.upstream.step.healthyCheck.passive' }), - name: ['checks', 'passive'], - component: , - }, - ].map(({ label, name, component }) => ( -
- - - - - {() => { - if (form.getFieldValue(name)) { - return component; - } - return null; - }} - -
- ))} - - + + )} ); diff --git a/web/src/components/Upstream/components/Nodes.tsx b/web/src/components/Upstream/components/Nodes.tsx new file mode 100644 index 0000000000..2a92d48787 --- /dev/null +++ b/web/src/components/Upstream/components/Nodes.tsx @@ -0,0 +1,125 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Input, Row, Col, InputNumber, Button } from 'antd' +import { useIntl } from 'umi' +import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons' + +import { removeBtnStyle } from '..' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + {(fields, { add, remove }) => ( + <> + + {fields.map((field, index) => ( + + + + + + + + + + + + + + + + + + {!readonly && ( + remove(field.name)} /> + )} + + + ))} + + {!readonly && ( + + + + )} + + )} + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/PassHost.tsx b/web/src/components/Upstream/components/PassHost.tsx new file mode 100644 index 0000000000..6102076eb8 --- /dev/null +++ b/web/src/components/Upstream/components/PassHost.tsx @@ -0,0 +1,88 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Input, Select } from 'antd' +import { useIntl } from 'umi' +import type { FormInstance } from 'antd/lib/form' + +type Props = { + form: FormInstance + readonly?: boolean +} + +const Component: React.FC = ({ form, readonly }) => { + const { formatMessage } = useIntl() + + const options = [ + { + value: "pass", + label: formatMessage({ id: 'page.upstream.step.pass-host.pass' }) + }, { + value: "node", + label: formatMessage({ id: 'page.upstream.step.pass-host.node' }) + }, { + value: "rewrite", + label: formatMessage({ id: 'page.upstream.step.pass-host.rewrite' }), + disabled: true + } + ] + + return ( + + + + + { + return prev.pass_host !== next.pass_host; + }} + > + {() => { + if (form.getFieldValue('pass_host') === 'rewrite') { + return ( + + + + ); + } + return null; + }} + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/Retries.tsx b/web/src/components/Upstream/components/Retries.tsx new file mode 100644 index 0000000000..a77ecefce7 --- /dev/null +++ b/web/src/components/Upstream/components/Retries.tsx @@ -0,0 +1,39 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/Scheme.tsx b/web/src/components/Upstream/components/Scheme.tsx new file mode 100644 index 0000000000..840d5e6d55 --- /dev/null +++ b/web/src/components/Upstream/components/Scheme.tsx @@ -0,0 +1,62 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Select } from 'antd' +import { useIntl } from 'umi' + +const options = [ + { + label: "HTTP", + value: "http" + }, { + label: "HTTPs", + value: "https" + }, { + label: "gRPC", + value: "grpc" + }, { + label: "gRPCs", + value: "grpcs" + } +] + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/TimeUnit.tsx b/web/src/components/Upstream/components/TimeUnit.tsx new file mode 100644 index 0000000000..292c0cfe7a --- /dev/null +++ b/web/src/components/Upstream/components/TimeUnit.tsx @@ -0,0 +1,21 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' + +const TimeUnit = () => s; + +export default TimeUnit diff --git a/web/src/components/Upstream/components/Timeout.tsx b/web/src/components/Upstream/components/Timeout.tsx new file mode 100644 index 0000000000..059b63a5f9 --- /dev/null +++ b/web/src/components/Upstream/components/Timeout.tsx @@ -0,0 +1,49 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +import TimeUnit from './TimeUnit' + +const Component: React.FC<{ + label: string; + desc: string; + name: string[]; + readonly?: boolean; +}> = ({ label, desc, name, readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/Type.tsx b/web/src/components/Upstream/components/Type.tsx new file mode 100644 index 0000000000..0a7ce25306 --- /dev/null +++ b/web/src/components/Upstream/components/Type.tsx @@ -0,0 +1,112 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Select } from 'antd' +import { useIntl } from 'umi' +import type { FormInstance } from 'antd/es/form' + +enum Type { + roundrobin = 'roundrobin', + chash = 'chash', + ewma = 'ewma', + // TODO: new type + // least_conn = 'least_conn' +} + +enum HashOn { + vars = 'vars', + header = 'header', + cookie = 'cookie', + consumer = 'consumer', + // TODO: new hash_on key + // vars_combinations = 'vars_combinations' +} + +enum HashKey { + remote_addr = 'remote_addr', + host = 'host', + uri = 'uri', + server_name = 'server_name', + server_addr = 'server_addr', + request_uri = 'request_uri', + query_string = 'query_string', + remote_port = 'remote_port', + hostname = 'hostname', + arg_id = 'arg_id', +} + +type Props = { + readonly?: boolean + form: FormInstance +} + +const CHash: React.FC> = ({ readonly }) => ( + <> + + + + + + + +); + +const Component: React.FC = ({ readonly, form }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + {() => { + if (form.getFieldValue('type') === 'chash') { + return ; + } + return null; + }} + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/UpstreamSelector.tsx b/web/src/components/Upstream/components/UpstreamSelector.tsx new file mode 100644 index 0000000000..1f8b2254e9 --- /dev/null +++ b/web/src/components/Upstream/components/UpstreamSelector.tsx @@ -0,0 +1,69 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Select } from 'antd' +import { useIntl } from 'umi' + +type Upstream = { + name?: string; + id?: string; +}; + +type Props = { + list?: Upstream[]; + disabled?: boolean; + required?: boolean; + shouldUpdate: (prev: any, next: any) => void; + onChange: (id: string) => void +} + +const Component: React.FC = ({ shouldUpdate, onChange, list = [], disabled, required }) => { + const { formatMessage } = useIntl() + + return ( + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Healthy/Interval.tsx b/web/src/components/Upstream/components/active-check/Healthy/Interval.tsx new file mode 100644 index 0000000000..47ca56e2ba --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Healthy/Interval.tsx @@ -0,0 +1,54 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' +import TimeUnit from '../../TimeUnit' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Healthy/Successes.tsx b/web/src/components/Upstream/components/active-check/Healthy/Successes.tsx new file mode 100644 index 0000000000..84fbccfd45 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Healthy/Successes.tsx @@ -0,0 +1,50 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { Form, InputNumber } from 'antd' +import React from 'react' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Healthy/index.ts b/web/src/components/Upstream/components/active-check/Healthy/index.ts new file mode 100644 index 0000000000..cef27c1d31 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Healthy/index.ts @@ -0,0 +1,23 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import Interval from './Interval' +import Successes from './Successes' + +export default { + Interval, + Successes +} diff --git a/web/src/components/Upstream/components/active-check/Host.tsx b/web/src/components/Upstream/components/active-check/Host.tsx new file mode 100644 index 0000000000..871000b7f2 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Host.tsx @@ -0,0 +1,61 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Input } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/HttpPath.tsx b/web/src/components/Upstream/components/active-check/HttpPath.tsx new file mode 100644 index 0000000000..4914a49e3d --- /dev/null +++ b/web/src/components/Upstream/components/active-check/HttpPath.tsx @@ -0,0 +1,55 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Input } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Port.tsx b/web/src/components/Upstream/components/active-check/Port.tsx new file mode 100644 index 0000000000..3d04e0756b --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Port.tsx @@ -0,0 +1,43 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/ReqHeaders.tsx b/web/src/components/Upstream/components/active-check/ReqHeaders.tsx new file mode 100644 index 0000000000..25fb8d6c9e --- /dev/null +++ b/web/src/components/Upstream/components/active-check/ReqHeaders.tsx @@ -0,0 +1,81 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Row, Col, Input, Button } from 'antd' +import { useIntl } from 'umi' +import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons' + +import { removeBtnStyle } from '../../constant' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + {(fields, { add, remove }) => ( + <> + + {fields.map((field, index) => ( + + + + + + + + {!readonly && fields.length > 1 && ( + { + remove(field.name); + }} + /> + )} + + + ))} + + {!readonly && ( + + + + )} + + )} + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Timeout.tsx b/web/src/components/Upstream/components/active-check/Timeout.tsx new file mode 100644 index 0000000000..4d294b7d05 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Timeout.tsx @@ -0,0 +1,39 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' +import TimeUnit from '../TimeUnit' + +type Props = { + readonly?: boolean +} + +const ActiveCheckTimeoutComponent: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + + ) +} + +export default ActiveCheckTimeoutComponent diff --git a/web/src/components/Upstream/components/active-check/Type.tsx b/web/src/components/Upstream/components/active-check/Type.tsx new file mode 100644 index 0000000000..e8b95c63fd --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Type.tsx @@ -0,0 +1,57 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Select } from 'antd' + +type Props = { + readonly?: boolean +} + +const options = [ + { + label: "HTTP", + value: "http" + }, { + label: "HTTPs", + value: "https" + }, { + label: "TCP", + value: "tcp" + } +] + +const ActiveCheckTypeComponent: React.FC = ({ readonly }) => { + return ( + + + + ) +} + +export default ActiveCheckTypeComponent diff --git a/web/src/components/Upstream/components/active-check/Unhealthy/HttpFailures.tsx b/web/src/components/Upstream/components/active-check/Unhealthy/HttpFailures.tsx new file mode 100644 index 0000000000..dbd411827e --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Unhealthy/HttpFailures.tsx @@ -0,0 +1,52 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { Form, InputNumber } from 'antd' +import React from 'react' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Unhealthy/HttpStatuses.tsx b/web/src/components/Upstream/components/active-check/Unhealthy/HttpStatuses.tsx new file mode 100644 index 0000000000..0cdad520f6 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Unhealthy/HttpStatuses.tsx @@ -0,0 +1,74 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Row, Col, Button, InputNumber } from 'antd' +import { useIntl } from 'umi' +import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons' + +import { removeBtnStyle } from '@/components/Upstream' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + {(fields, { add, remove }) => ( + <> + + {fields.map((field, index) => ( + + + + + + + + {!readonly && ( + { + remove(field.name); + }} + /> + )} + + + ))} + + {!readonly && ( + + + + )} + + )} + + ) +} +export default Component diff --git a/web/src/components/Upstream/components/active-check/Unhealthy/Interval.tsx b/web/src/components/Upstream/components/active-check/Unhealthy/Interval.tsx new file mode 100644 index 0000000000..8052808ed9 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Unhealthy/Interval.tsx @@ -0,0 +1,54 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +import TimeUnit from '../../TimeUnit' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Unhealthy/Timeouts.tsx b/web/src/components/Upstream/components/active-check/Unhealthy/Timeouts.tsx new file mode 100644 index 0000000000..2f5af5fb4f --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Unhealthy/Timeouts.tsx @@ -0,0 +1,38 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => ( + + + + + +) + +export default Component diff --git a/web/src/components/Upstream/components/active-check/Unhealthy/index.ts b/web/src/components/Upstream/components/active-check/Unhealthy/index.ts new file mode 100644 index 0000000000..bb9b86951a --- /dev/null +++ b/web/src/components/Upstream/components/active-check/Unhealthy/index.ts @@ -0,0 +1,27 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import Timeouts from './Timeouts' +import Interval from './Interval' +import HttpStatuses from './HttpStatuses' +import HttpFailures from './HttpFailures' + +export default { + Timeouts, + Interval, + HttpStatuses, + HttpFailures +} diff --git a/web/src/components/Upstream/components/active-check/index.ts b/web/src/components/Upstream/components/active-check/index.ts new file mode 100644 index 0000000000..efc3046091 --- /dev/null +++ b/web/src/components/Upstream/components/active-check/index.ts @@ -0,0 +1,36 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import Unhealthy from './Unhealthy' +import Healthy from './Healthy' + +import Timeout from './Timeout' +import Type from './Type' +import ReqHeaders from './ReqHeaders' +import Host from './Host' +import Port from './Port' +import HttpPath from './HttpPath' + +export default { + Unhealthy, + Healthy, + Timeout, + Type, + ReqHeaders, + Host, + Port, + HttpPath +} diff --git a/web/src/components/Upstream/components/passive-check/Healthy/HttpStatuses.tsx b/web/src/components/Upstream/components/passive-check/Healthy/HttpStatuses.tsx new file mode 100644 index 0000000000..f1b06d2105 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Healthy/HttpStatuses.tsx @@ -0,0 +1,76 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Row, Col, InputNumber, Button } from 'antd' +import { useIntl } from 'umi' +import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons' + +import { removeBtnStyle } from '@/components/Upstream/constant' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + {(fields, { add, remove }) => ( + <> + + {fields.map((field, index) => ( + + + + + + + + {!readonly && ( + { + remove(field.name); + }} + /> + )} + + + ))} + + {!readonly && ( + + + + )} + + )} + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Healthy/Successes.tsx b/web/src/components/Upstream/components/passive-check/Healthy/Successes.tsx new file mode 100644 index 0000000000..2ee3590fab --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Healthy/Successes.tsx @@ -0,0 +1,49 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Healthy/index.ts b/web/src/components/Upstream/components/passive-check/Healthy/index.ts new file mode 100644 index 0000000000..737fbf4e9e --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Healthy/index.ts @@ -0,0 +1,23 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import HttpStatuses from './HttpStatuses' +import Successes from './Successes' + +export default { + HttpStatuses, + Successes +} diff --git a/web/src/components/Upstream/components/passive-check/Type.tsx b/web/src/components/Upstream/components/passive-check/Type.tsx new file mode 100644 index 0000000000..d3401eeb2c --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Type.tsx @@ -0,0 +1,57 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Select } from 'antd' + +type Props = { + readonly?: boolean +} + +const PassiveCheckTypeComponent: React.FC = ({ readonly }) => { + const options = [ + { + label: "HTTP", + value: "http" + }, { + label: "HTTPs", + value: "https" + }, { + label: "TCP", + value: "tcp" + } + ] + + return ( + + + + ) +} + +export default PassiveCheckTypeComponent diff --git a/web/src/components/Upstream/components/passive-check/Unhealthy/HttpFailures.tsx b/web/src/components/Upstream/components/passive-check/Unhealthy/HttpFailures.tsx new file mode 100644 index 0000000000..3ba6154f39 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Unhealthy/HttpFailures.tsx @@ -0,0 +1,52 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Unhealthy/HttpStatuses.tsx b/web/src/components/Upstream/components/passive-check/Unhealthy/HttpStatuses.tsx new file mode 100644 index 0000000000..ba9ba75e3a --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Unhealthy/HttpStatuses.tsx @@ -0,0 +1,75 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, Row, Col, InputNumber, Button } from 'antd' +import { useIntl } from 'umi' +import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons' + +import { removeBtnStyle } from '@/components/Upstream/constant' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + {(fields, { add, remove }) => ( + <> + + {fields.map((field, index) => ( + + + + + + + + {!readonly && fields.length > 1 && ( + { + remove(field.name); + }} + /> + )} + + + ))} + + {!readonly && ( + + + + )} + + )} + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Unhealthy/TcpFailures.tsx b/web/src/components/Upstream/components/passive-check/Unhealthy/TcpFailures.tsx new file mode 100644 index 0000000000..175d22f776 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Unhealthy/TcpFailures.tsx @@ -0,0 +1,51 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' +import { useIntl } from 'umi' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => { + const { formatMessage } = useIntl() + return ( + + + + + + ) +} + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Unhealthy/Timeouts.tsx b/web/src/components/Upstream/components/passive-check/Unhealthy/Timeouts.tsx new file mode 100644 index 0000000000..91b7b4fe62 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Unhealthy/Timeouts.tsx @@ -0,0 +1,38 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react' +import { Form, InputNumber } from 'antd' + +type Props = { + readonly?: boolean +} + +const Component: React.FC = ({ readonly }) => ( + + + + + +) + +export default Component diff --git a/web/src/components/Upstream/components/passive-check/Unhealthy/index.ts b/web/src/components/Upstream/components/passive-check/Unhealthy/index.ts new file mode 100644 index 0000000000..88ab9c2275 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/Unhealthy/index.ts @@ -0,0 +1,27 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import Timeouts from './Timeouts' +import HttpFailures from './HttpFailures' +import TcpFailures from './TcpFailures' +import HttpStatuses from './HttpStatuses' + +export default { + Timeouts, + HttpFailures, + TcpFailures, + HttpStatuses +} diff --git a/web/src/components/Upstream/components/passive-check/index.ts b/web/src/components/Upstream/components/passive-check/index.ts new file mode 100644 index 0000000000..f0637fd910 --- /dev/null +++ b/web/src/components/Upstream/components/passive-check/index.ts @@ -0,0 +1,25 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import Healthy from './Healthy' +import Unhealthy from './Unhealthy' +import Type from './Type' + +export default { + Healthy, + Unhealthy, + Type +} diff --git a/web/src/components/Upstream/constant.ts b/web/src/components/Upstream/constant.ts index 58d8ed52d5..d4f243bbe3 100644 --- a/web/src/components/Upstream/constant.ts +++ b/web/src/components/Upstream/constant.ts @@ -16,6 +16,8 @@ */ export const DEFAULT_UPSTREAM = { upstream_id: '', + // NOTE: the following fields are the default configurations + // https://github.com/apache/apisix/blob/master/apisix/schema_def.lua#L325 nodes: [ { host: '', @@ -23,42 +25,66 @@ export const DEFAULT_UPSTREAM = { weight: 1 } ], - type: 'roundrobin', + retries: 0, timeout: { connect: 6, send: 6, read: 6, }, - retries: 1 + type: 'roundrobin', + checks: {}, + scheme: "http", + pass_host: "pass", + name: "", + desc: "" }; // NOTE: checks.active +// https://github.com/apache/apisix/blob/master/apisix/schema_def.lua#L40 export const DEFAULT_HEALTH_CHECK_ACTIVE = { - timeout: 0, - http_path: '/', - host: '', + type: "http", + timeout: 1, + concurrency: 10, + host: "", port: 80, + http_path: "", + https_verify_certificate: true, healthy: { interval: 1, - successes: 1 + http_statuses: [200, 302], + successes: 2 }, unhealthy: { interval: 1, - http_failures: 1, - req_headers: [] - } + http_statuses: [429, 404, 500, 501, 502, 503, 504, 505], + http_failures: 5, + tcp_failures: 2, + timeouts: 3 + }, + req_headers: [] } // NOTE: checks.passive export const DEFAULT_HEALTH_CHECK_PASSIVE = { + type: "http", healthy: { - http_statuses: [], - successes: 1 + http_statuses: [ + 200, 201, 202, 203, 204, 205, 206, 207, + 208, 226, 300, 301, 302, 303, 304, 305, + 306, 307, 308 + ], + successes: 5 }, unhealthy: { - http_statuses: [], - tcp_failures: 1, - timeouts: 1, - http_failures: 1 + http_statuses: [429, 500, 503], + tcp_failures: 2, + timeouts: 7, + http_failures: 5 } } + +export const removeBtnStyle = { + marginLeft: 20, + display: 'flex', + alignItems: 'center', +}; diff --git a/web/src/locales/en-US.ts b/web/src/locales/en-US.ts index c1cbcb7484..19c348a53d 100644 --- a/web/src/locales/en-US.ts +++ b/web/src/locales/en-US.ts @@ -22,6 +22,7 @@ import menu from './en-US/menu'; import pwa from './en-US/pwa'; import settingDrawer from './en-US/settingDrawer'; import settings from './en-US/setting'; +import other from './en-US/other' import PluginOrchestration from '../components/PluginOrchestration/locales/en-US'; import Plugin from '../components/Plugin/locales/en-US'; import RawDataEditor from '../components/RawDataEditor/locales/en-US'; @@ -38,6 +39,7 @@ export default { ...settings, ...pwa, ...component, + ...other, ...ActionBarEnUS, ...PluginOrchestration, ...Plugin, diff --git a/web/src/locales/en-US/component.ts b/web/src/locales/en-US/component.ts index 06027ad2e9..d3095bd918 100644 --- a/web/src/locales/en-US/component.ts +++ b/web/src/locales/en-US/component.ts @@ -76,4 +76,5 @@ export default { 'component.label-manager': 'Label Manager', 'component.global.noConfigurationRequired': 'No configuration required', + 'component.global.copy': 'Copy' }; diff --git a/web/src/locales/en-US/other.ts b/web/src/locales/en-US/other.ts new file mode 100644 index 0000000000..07942ead53 --- /dev/null +++ b/web/src/locales/en-US/other.ts @@ -0,0 +1,19 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export default { + 'other.global': 'Global', +} diff --git a/web/src/locales/zh-CN.ts b/web/src/locales/zh-CN.ts index 9fc9c8dc64..0c8037533d 100644 --- a/web/src/locales/zh-CN.ts +++ b/web/src/locales/zh-CN.ts @@ -20,6 +20,7 @@ import component from './zh-CN/component'; import globalHeader from './zh-CN/globalHeader'; import menu from './zh-CN/menu'; import pwa from './zh-CN/pwa'; +import other from './zh-CN/other' import settingDrawer from './zh-CN/settingDrawer'; import settings from './zh-CN/setting'; import PluginOrchestration from '../components/PluginOrchestration/locales/zh-CN'; @@ -38,6 +39,7 @@ export default { ...settings, ...pwa, ...component, + ...other, ...ActionBarZhCN, ...PluginOrchestration, ...Plugin, diff --git a/web/src/locales/zh-CN/component.ts b/web/src/locales/zh-CN/component.ts index 0319cd12bc..e5f95ce36b 100644 --- a/web/src/locales/zh-CN/component.ts +++ b/web/src/locales/zh-CN/component.ts @@ -72,4 +72,5 @@ export default { 'component.label-manager': '标签管理器', 'component.global.noConfigurationRequired': '无需配置', + 'component.global.copy': '复制' }; diff --git a/web/src/locales/zh-CN/other.ts b/web/src/locales/zh-CN/other.ts new file mode 100644 index 0000000000..145cb0c8a9 --- /dev/null +++ b/web/src/locales/zh-CN/other.ts @@ -0,0 +1,19 @@ +/* + * Licensed to the Apache Software Foundation (ASF) under one or more + * contributor license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright ownership. + * The ASF licenses this file to You under the Apache License, Version 2.0 + * (the "License"); you may not use this file except in compliance with + * the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +export default { + 'other.global': '全局', +} diff --git a/web/src/pages/Route/locales/zh-CN.ts b/web/src/pages/Route/locales/zh-CN.ts index ca97132d45..5d8adda1ba 100644 --- a/web/src/pages/Route/locales/zh-CN.ts +++ b/web/src/pages/Route/locales/zh-CN.ts @@ -36,7 +36,7 @@ export default { 'page.route.status': '状态', 'page.route.groupName': '分组名称', 'page.route.offline': '下线', - 'page.route.publish': '是否发布', + 'page.route.publish': '发布', 'page.route.published': '已发布', 'page.route.unpublished': '未发布', 'page.route.onlineDebug': '在线调试', diff --git a/web/src/pages/Upstream/locales/en-US.ts b/web/src/pages/Upstream/locales/en-US.ts index a78a16260a..bc078e2450 100644 --- a/web/src/pages/Upstream/locales/en-US.ts +++ b/web/src/pages/Upstream/locales/en-US.ts @@ -32,7 +32,6 @@ export default { 'page.upstream.step.description': 'Description', 'page.upstream.step.input.description': 'Please enter upstream\'s description', 'page.upstream.step.type': 'Algorithm', - 'page.upstream.step.create.node': 'Add Target', 'page.upstream.step.pass-host': 'Hostname', 'page.upstream.step.pass-host.pass': 'Keep the same Host from client request', 'page.upstream.step.pass-host.node': 'Use the domain or IP from Node List', @@ -65,12 +64,10 @@ export default { 'page.upstream.step.healthyCheck.successes': 'Successes', 'page.upstream.step.input.healthyCheck.successes': 'Please enter successes', 'page.upstream.step.healthyCheck.http_failures': 'HTTP Failures', - 'page.upstream.step.healthyCheck.active.create.req_headers': 'Add Request Headers', 'page.upstream.step.input.healthyCheck.http_failures': 'Please enter http failures', 'page.upstream.step.healthyCheck.active.req_headers': 'Request Headers', 'page.upstream.step.input.healthyCheck.active.req_headers': 'Please enter request headers', 'page.upstream.step.healthyCheck.passive': 'Passive', - 'page.upstream.step.healthyCheck.passive.create.http_statuses': 'Add HTTP Status', 'page.upstream.step.healthyCheck.passive.http_statuses': 'HTTP Status', 'page.upstream.step.input.healthyCheck.passive.http_statuses': 'Please enter http status', 'page.upstream.step.healthyCheck.passive.tcp_failures': 'TCP Failures', @@ -120,5 +117,6 @@ export default { 'page.upstream.checks.passive.healthy.successes.description': 'Number of successes to consider a target healthy', 'page.upstream.checks.passive.unhealthy.http_statuses.description': 'Which HTTP statuses to consider a success', 'page.upstream.checks.passive.unhealthy.http_failures.description': 'Number of HTTP failures to consider a target unhealthy', - 'page.upstream.checks.passive.unhealthy.tcp_failures.description': 'Number of TCP failures to consider a target unhealthy' + 'page.upstream.checks.passive.unhealthy.tcp_failures.description': 'Number of TCP failures to consider a target unhealthy', + 'page.upstream.scheme': 'Scheme' }; diff --git a/web/src/pages/Upstream/locales/zh-CN.ts b/web/src/pages/Upstream/locales/zh-CN.ts index 3049b97cac..58620ba6bf 100644 --- a/web/src/pages/Upstream/locales/zh-CN.ts +++ b/web/src/pages/Upstream/locales/zh-CN.ts @@ -32,8 +32,7 @@ export default { 'page.upstream.step.description': '描述', 'page.upstream.step.input.description': '请输入上游服务的描述', 'page.upstream.step.type': '负载均衡算法', - 'page.upstream.step.create.node': '增加目标节点', - 'page.upstream.step.pass-host': 'Host 转换', + 'page.upstream.step.pass-host': 'Host 请求头', 'page.upstream.step.pass-host.pass': '保持与客户端请求一致的 Host 请求头', 'page.upstream.step.pass-host.node': '使用上游节点列表中的域名或 IP', 'page.upstream.step.pass-host.rewrite': '自定义 Host 请求头（即将废弃）', @@ -65,12 +64,10 @@ export default { 'page.upstream.step.healthyCheck.successes': '成功次数', 'page.upstream.step.input.healthyCheck.successes': '请输入成功次数', 'page.upstream.step.healthyCheck.http_failures': '失败次数', - 'page.upstream.step.healthyCheck.active.create.req_headers': '增加请求头', 'page.upstream.step.input.healthyCheck.http_failures': '请输入失败次数', 'page.upstream.step.healthyCheck.active.req_headers': '请求头', 'page.upstream.step.input.healthyCheck.active.req_headers': '请输入请求头', 'page.upstream.step.healthyCheck.passive': '被动检查', - 'page.upstream.step.healthyCheck.passive.create.http_statuses': '增加状态码', 'page.upstream.step.healthyCheck.passive.http_statuses': '状态码', 'page.upstream.step.input.healthyCheck.passive.http_statuses': '请输入状态码', 'page.upstream.step.healthyCheck.passive.tcp_failures': 'TCP 失败次数', @@ -120,5 +117,6 @@ export default { 'page.upstream.checks.passive.healthy.successes.description': '通过被动健康检查观察到的正常代理流量的成功次数。如果达到该值，上游服务目标节点将被视为健康。', 'page.upstream.checks.passive.unhealthy.http_statuses.description': '当被动健康检查的探针返回值是 HTTP 状态码列表的某一个值时，代表不健康状态是由代理流量产生的。', 'page.upstream.checks.passive.unhealthy.http_failures.description': '由被动健康检查所观察，代理流量中 HTTP 失败的次数。如果达到此值，则认为上游服务目标节点是不健康的。', - 'page.upstream.checks.passive.unhealthy.tcp_failures.description': '被动健康检查所观察到的代理流量中 TCP 失败的次数。如果达到此值，则认为上游服务目标节点是不健康的。' + 'page.upstream.checks.passive.unhealthy.tcp_failures.description': '被动健康检查所观察到的代理流量中 TCP 失败的次数。如果达到此值，则认为上游服务目标节点是不健康的。', + 'page.upstream.scheme': '协议' };