You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by ju...@apache.org on 2020/05/31 15:00:56 UTC
[incubator-apisix-dashboard] 01/01: feat: update naming
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch feat-update-route
in repository https://gitbox.apache.org/repos/asf/incubator-apisix-dashboard.git
commit 18ff83ed907fd5d841ef6b933d85d95f0f89bac0
Author: juzhiyuan <jj...@gmail.com>
AuthorDate: Sun May 31 23:00:35 2020 +0800
feat: update naming
---
src/pages/Routes/Create.tsx | 8 ++++----
src/pages/Routes/components/CreateStep3/CreateStep3.tsx | 11 ++++++++---
src/pages/Routes/components/Step1/index.tsx | 10 +++++-----
src/pages/Routes/typing.d.ts | 8 ++++----
4 files changed, 21 insertions(+), 16 deletions(-)
diff --git a/src/pages/Routes/Create.tsx b/src/pages/Routes/Create.tsx
index 28e2b89..ac9127c 100644
--- a/src/pages/Routes/Create.tsx
+++ b/src/pages/Routes/Create.tsx
@@ -8,7 +8,7 @@ import CreateStep3 from './components/CreateStep3';
const { Step } = Steps;
const Create: React.FC = () => {
- const [step1Data, setStep1Data] = useState<RoutesModule.Step1DataProps>({
+ const [step1Data, setStep1Data] = useState<RouteModule.Step1Data>({
name: '',
protocol: [],
hosts: [''],
@@ -23,7 +23,7 @@ const Create: React.FC = () => {
step1Data,
};
- const handleChange = (step: number, params: RoutesModule.Step1DataProps) => {
+ const handleChange = (step: number, params: RouteModule.Step1Data) => {
switch (step) {
case 0:
setStep1Data({ ...step1Data, ...params });
@@ -38,11 +38,11 @@ const Create: React.FC = () => {
return (
<Step1
data={data}
- onChange={(params: RoutesModule.Step1DataProps) => handleChange(currentStep, params)}
+ onChange={(params: RouteModule.Step1Data) => handleChange(currentStep, params)}
/>
);
case 2:
- return <CreateStep3 />;
+ return <CreateStep3 data={data} onChange={() => {}} />;
default:
return null;
}
diff --git a/src/pages/Routes/components/CreateStep3/CreateStep3.tsx b/src/pages/Routes/components/CreateStep3/CreateStep3.tsx
index 8526b34..4e9a30a 100644
--- a/src/pages/Routes/components/CreateStep3/CreateStep3.tsx
+++ b/src/pages/Routes/components/CreateStep3/CreateStep3.tsx
@@ -7,6 +7,8 @@ import PanelSection from '../PanelSection';
import PluginDrawer from './PluginDrawer';
import PluginCard from './PluginCard';
+interface Props extends RouteModule.Data {}
+
const sectionStyle = {
display: 'grid',
gridTemplateColumns: 'repeat(3, 33.333%)',
@@ -14,10 +16,13 @@ const sectionStyle = {
gridColumnGap: 10,
};
-const CreateStep3: React.FC = () => {
+const CreateStep3: React.FC<Props> = () => {
const [currentPlugin, setCurrentPlugin] = useState<string | undefined>();
- // TODO: 设置插件黑名单(不展示的插件)
+ // NOTE: Plugin in blacklist WILL NOT be shown on Step3.
+ const pluginBlackList = ['redirect'];
+ const list = pluginList.filter(({ name }) => !pluginBlackList.includes(name));
+
// TODO: 获取 Route 已启用插件
// TODO: 拆分已启用、未启用插件
@@ -32,7 +37,7 @@ const CreateStep3: React.FC = () => {
</Card>
</PanelSection>
<PanelSection title="未启用" style={sectionStyle}>
- {pluginList.map(({ name }) => (
+ {list.map(({ name }) => (
<PluginCard
name={name}
actions={[
diff --git a/src/pages/Routes/components/Step1/index.tsx b/src/pages/Routes/components/Step1/index.tsx
index 3b42dec..5b06b8f 100644
--- a/src/pages/Routes/components/Step1/index.tsx
+++ b/src/pages/Routes/components/Step1/index.tsx
@@ -16,12 +16,12 @@ const formItemLayout = {
},
};
-const Step1: React.FC<RoutesModule.StepProps> = ({ data, onChange }) => {
+const Step1: React.FC<RouteModule.Data> = ({ data, onChange }) => {
const { step1Data } = data;
const { hosts, paths, advancedMatchingRules } = step1Data;
const [form] = Form.useForm();
const [modalVisible, setModalVisible] = useState(false);
- const [editModalData, setEditModalData] = useState<RoutesModule.MatchingRule>({
+ const [editModalData, setEditModalData] = useState<RouteModule.MatchingRule>({
paramsLocation: 'query',
paramsName: '',
paramsExpresstion: '==',
@@ -33,7 +33,7 @@ const Step1: React.FC<RoutesModule.StepProps> = ({ data, onChange }) => {
setModalVisible(true);
};
- const handleEdit = (record: RoutesModule.MatchingRule) => {
+ const handleEdit = (record: RouteModule.MatchingRule) => {
setEditModalData(record);
requestAnimationFrame(() => {
setModalVisible(true);
@@ -69,7 +69,7 @@ const Step1: React.FC<RoutesModule.StepProps> = ({ data, onChange }) => {
{
title: '操作',
key: 'action',
- render: (_: any, record: RoutesModule.MatchingRule) => (
+ render: (_: any, record: RouteModule.MatchingRule) => (
<Space size="middle">
<a onClick={() => handleEdit(record)}>编辑</a>
<a onClick={() => handleRemove(record.key)}>移除</a>
@@ -218,7 +218,7 @@ const Step1: React.FC<RoutesModule.StepProps> = ({ data, onChange }) => {
modalForm.validateFields().then((value) => {
onChange({
advancedMatchingRules: advancedMatchingRules.concat({
- ...(value as RoutesModule.MatchingRule),
+ ...(value as RouteModule.MatchingRule),
key: Math.random().toString(36).slice(2),
}),
});
diff --git a/src/pages/Routes/typing.d.ts b/src/pages/Routes/typing.d.ts
index 0f26e6b..b313f36 100644
--- a/src/pages/Routes/typing.d.ts
+++ b/src/pages/Routes/typing.d.ts
@@ -1,4 +1,4 @@
-declare namespace RoutesModule {
+declare namespace RouteModule {
interface MatchingRule {
paramsLocation: 'query' | 'params' | 'header' | 'cookie';
paramsName: string;
@@ -7,7 +7,7 @@ declare namespace RoutesModule {
key: string;
}
- interface Step1DataProps {
+ interface Step1Data {
name: string;
protocol: [];
hosts: string[];
@@ -16,9 +16,9 @@ declare namespace RoutesModule {
advancedMatchingRules: MatchingRule[];
}
- interface StepProps {
+ interface Data {
data: {
- step1Data: Step1DataProps;
+ step1Data: Step1Data;
};
onChange(data: T): void;
}