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;
   }