feat: added new plugin dependency (#475)

* feat: added new plugin dependency * feat: omit shadow var * feat: omit shadow var
apache · Sep 16, 2020 · c81f0b9 · c81f0b9
1 parent cf9d5ec
commit c81f0b9
Show file tree

Hide file tree

Showing 6 changed files with 59 additions and 42 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "apisix-dashboard",
-  "version": "1.5.3",
+  "version": "1.5.4",
   "private": true,
   "description": "Dashboard for Apache APISIX",
   "scripts": {
@@ -54,9 +54,9 @@
     "@ant-design/icons": "^4.0.0",
     "@ant-design/pro-layout": "^6.0.0",
     "@ant-design/pro-table": "2.6.3",
-    "@api7-dashboard/plugin": "^1.0.3",
-    "@api7-dashboard/pluginchart": "^1.0.9",
-    "@api7-dashboard/ui": "^1.0.0",
+    "@api7-dashboard/plugin": "^1.0.4",
+    "@api7-dashboard/pluginchart": "^1.0.11",
+    "@api7-dashboard/ui": "^1.0.3",
     "@rjsf/antd": "2.2.0",
     "@rjsf/core": "2.2.0",
     "antd": "^4.4.0",

diff --git a/src/pages/Route/Create.tsx b/src/pages/Route/Create.tsx
@@ -187,15 +187,10 @@ const Page: React.FC<Props> = (props) => {
     if (step === 3) {
       return (
         <Step3
-          readonly={false}
-          data={routeData.step3Data}
-          onChange={({ mode, data }) => {
-            if (mode === 'NORMAL') {
-              setStep3Data({ plugins: data, script: {} });
-              setChart(INIT_CHART);
-            } else {
-              setChart(data);
-            }
+          data={step3Data}
+          onChange={({ plugins, script = INIT_CHART }) => {
+            setStep3Data({ plugins, script });
+            setChart(script);
           }}
         />
       );
@@ -234,7 +229,7 @@ const Page: React.FC<Props> = (props) => {
     };
 
     const savePlugins = () => {
-      if (Object.keys(chart.nodes).length) {
+      if (Object.keys(chart.nodes || {}).length) {
         const transformChart = chartTransformer(chart);
         setStep3Data({ script: { ...transformChart, chart }, plugins: {} });
       } else {

diff --git a/src/pages/Route/components/CreateStep4/CreateStep4.tsx b/src/pages/Route/components/CreateStep4/CreateStep4.tsx
@@ -47,7 +47,7 @@ const CreateStep4: React.FC<Props> = ({ form1, form2, redirect, ...rest }) => {
           <Step2 {...rest} form={form2} disabled />
           <h2 style={style}>{formatMessage({ id: 'route.create.plugin.configuration' })}</h2>
           {Boolean(Object.keys(plugins).length !== 0) && (
-            <PluginPage data={rest.data.step3Data.plugins} disabled />
+            <PluginPage initialData={rest.data.step3Data.plugins} readonly />
           )}
           {Boolean(Object.keys(script).length !== 0) && (
             <PluginOrchestration

diff --git a/src/pages/Route/components/Step1/index.tsx b/src/pages/Route/components/Step1/index.tsx
@@ -26,7 +26,7 @@ import MatchingRulesView from './MatchingRulesView';
 
 interface Props extends RouteModule.Data {
   form: FormInstance;
-  isEdit: boolean;
+  isEdit?: boolean;
 }
 
 const Step1: React.FC<Props> = (props) => {

diff --git a/src/pages/Route/components/Step3/index.tsx b/src/pages/Route/components/Step3/index.tsx
@@ -18,13 +18,17 @@ import React, { useState } from 'react';
 import { Radio, Tooltip } from 'antd';
 import { QuestionCircleOutlined } from '@ant-design/icons';
 import { isChrome } from 'react-device-detect';
+
 import { PluginPage, PluginPageType } from '@api7-dashboard/plugin';
 import PluginOrchestration from '@api7-dashboard/pluginchart';
 
 type Props = {
-  data: PluginPageType.PluginData;
-  onChange(data: PluginPageType.PluginData): void;
-  readonly: boolean;
+  data: {
+    plugins: PluginPageType.FinalData;
+    script: Record<string, any>;
+  };
+  onChange(data: { plugins: PluginPageType.FinalData; script: any }): void;
+  readonly?: boolean;
 };
 
 type Mode = 'NORMAL' | 'DRAW';
@@ -33,7 +37,7 @@ const Page: React.FC<Props> = ({ data, onChange, readonly = false }) => {
   const { plugins = {}, script = {} } = data;
 
   // NOTE: Currently only compatible with chrome
-  const type = Object.keys(script).length === 0 || !isChrome ? 'NORMAL' : 'DRAW';
+  const type = Object.keys(script || {}).length === 0 || !isChrome ? 'NORMAL' : 'DRAW';
   const [mode, setMode] = useState<Mode>(type);
 
   return (
@@ -44,6 +48,7 @@ const Page: React.FC<Props> = ({ data, onChange, readonly = false }) => {
           onChange={(e) => {
             setMode(e.target.value);
           }}
+          style={{ marginBottom: 10 }}
         >
           <Radio.Button value="NORMAL">普通模式</Radio.Button>
           <Radio.Button value="DRAW" disabled={!isChrome}>
@@ -59,13 +64,16 @@ const Page: React.FC<Props> = ({ data, onChange, readonly = false }) => {
         )}
       </div>
       {Boolean(mode === 'NORMAL') && (
-        <PluginPage data={plugins} onChange={(item) => onChange({ mode, data: item })} />
+        <PluginPage
+          initialData={plugins}
+          onChange={(pluginsData) => onChange({ plugins: pluginsData, script: {} })}
+        />
       )}
       {Boolean(mode === 'DRAW') && (
         <PluginOrchestration
-          data={script.chart}
+          data={script?.chart}
+          onChange={(scriptData) => onChange({ plugins: {}, script: scriptData })}
           readonly={readonly}
-          onChange={(item) => onChange({ mode, data: item })}
         />
       )}
     </>

diff --git a/yarn.lock b/yarn.lock
@@ -187,20 +187,21 @@
     lodash "^4.17.15"
     resize-observer-polyfill "^1.5.0"
 
-"@api7-dashboard/plugin@^1.0.3":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@api7-dashboard/plugin/-/plugin-1.0.3.tgz#de51d10abdb5e64eede1699586fca9b532c46c00"
-  integrity sha512-jSl/r0Rjo4ePIPUZfTvRqFxzsVUsfn9Kyx/9PdvxLxLDR2DYEsajfNBRU+s7mUuwzRJ9djkMIqeA+FnFxTHLyQ==
+"@api7-dashboard/plugin@^1.0.4":
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/@api7-dashboard/plugin/-/plugin-1.0.4.tgz#aaf945136398e61ef154b7cdd15319956854285b"
+  integrity sha512-hjwwhQCOWLR9ybIYeItSnTStU4A9ZcZMHsfrwXdLaWLGMVLLFhhopoBBtRUIszm5NHN1fCYNsLjGv4bNnCI/Qg==
   dependencies:
     "@rjsf/antd" "^2.3.0"
     "@rjsf/core" "^2.3.0"
+    "@uiw/react-codemirror" "^3.0.1"
     json-schema "^0.2.5"
     set-value "^3.0.2"
 
-"@api7-dashboard/pluginchart@^1.0.9":
-  version "1.0.9"
-  resolved "https://registry.yarnpkg.com/@api7-dashboard/pluginchart/-/pluginchart-1.0.9.tgz#306808dbe08f46ae02eca976d6495046830f8d3d"
-  integrity sha512-YCBQrwI/K2K2BFXWGy69BNbPiH+sxac0LpYDtiqhJFEGVZq1kR/OLh3eHeCRObpBuBGmGc+Bw3DGsrYd3v3c1Q==
+"@api7-dashboard/pluginchart@^1.0.11":
+  version "1.0.11"
+  resolved "https://registry.yarnpkg.com/@api7-dashboard/pluginchart/-/pluginchart-1.0.11.tgz#1269f541134423a723f8d2f9c59a6b3c4096ab8b"
+  integrity sha512-zGGdQFXhiFEKc9ZLN9WQf3kL4R9wwS/w15AJxbSfLdivyR9FgyBudgCMiCCQiJCuApDgFodG0i7RPbLdjxadyg==
   dependencies:
     "@ant-design/icons" "^4.2.2"
     "@mrblenny/react-flow-chart" "^0.0.14"
@@ -210,10 +211,10 @@
     lodash "^4.17.20"
     styled-components "^5.1.1"
 
-"@api7-dashboard/ui@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.npm.taobao.org/@api7-dashboard/ui/download/@api7-dashboard/ui-1.0.0.tgz#4517b8405d9a55dd8817c85c42733b47bda81893"
-  integrity sha1-RRe4QF2aVd2IF8hcQnM7R72oGJM=
+"@api7-dashboard/ui@^1.0.3":
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/@api7-dashboard/ui/-/ui-1.0.3.tgz#77011750bebee7bb6f6966ea0596c5576951e3ff"
+  integrity sha512-WSvcDBPcxmFb5b4nwUHlQ7J1IeA+buHs/if3wawSRU7imoUsuXb5BJ/39JPrOAoBmTjiuBOS6PChNGq4XUKCDg==
 
 "@babel/code-frame@7.0.0":
   version "7.0.0"
@@ -1389,20 +1390,20 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@7.11.2", "@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.1", "@babel/runtime@^7.10.2", "@babel/runtime@^7.10.4", "@babel/runtime@^7.11.1", "@babel/runtime@^7.11.2", "@babel/runtime@^7.4.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
+  version "7.11.2"
+  resolved "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.11.2.tgz?cache=0&sync_timestamp=1596637761107&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fruntime%2Fdownload%2F%40babel%2Fruntime-7.11.2.tgz#f549c13c754cc40b87644b9fa9f09a6a95fe0736"
+  integrity sha1-9UnBPHVMxAuHZEufqfCaapX+BzY=
+  dependencies:
+    regenerator-runtime "^0.13.4"
+
 "@babel/runtime@7.4.5":
   version "7.4.5"
   resolved "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.4.5.tgz?cache=0&sync_timestamp=1596637761107&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fruntime%2Fdownload%2F%40babel%2Fruntime-7.4.5.tgz#582bb531f5f9dc67d2fcb682979894f75e253f12"
   integrity sha1-WCu1MfX53GfS/LaCl5iU914lPxI=
   dependencies:
     regenerator-runtime "^0.13.2"
 
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.10.1", "@babel/runtime@^7.10.2", "@babel/runtime@^7.10.4", "@babel/runtime@^7.11.1", "@babel/runtime@^7.11.2", "@babel/runtime@^7.4.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.8.4", "@babel/runtime@^7.9.2":
-  version "7.11.2"
-  resolved "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.11.2.tgz?cache=0&sync_timestamp=1596637761107&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fruntime%2Fdownload%2F%40babel%2Fruntime-7.11.2.tgz#f549c13c754cc40b87644b9fa9f09a6a95fe0736"
-  integrity sha1-9UnBPHVMxAuHZEufqfCaapX+BzY=
-  dependencies:
-    regenerator-runtime "^0.13.4"
-
 "@babel/template@^7.10.4", "@babel/template@^7.3.3", "@babel/template@^7.4.0":
   version "7.10.4"
   resolved "https://registry.npm.taobao.org/@babel/template/download/@babel/template-7.10.4.tgz?cache=0&sync_timestamp=1593522831608&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Ftemplate%2Fdownload%2F%40babel%2Ftemplate-7.10.4.tgz#3251996c4200ebc71d1a8fc405fba940f36ba278"
@@ -2863,6 +2864,14 @@
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
+"@uiw/react-codemirror@^3.0.1":
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/@uiw/react-codemirror/-/react-codemirror-3.0.1.tgz#415096bba81be2d2398467f0bca23b80a1d64426"
+  integrity sha512-k4sc57i2jw15pwyT9io3boFDsr8I9jjC3cQg+pZFog7u8ZRrAsS+GzAz/1uzU1p9S2cfESwj/H0f2oqfIwqj6w==
+  dependencies:
+    "@babel/runtime" "7.11.2"
+    codemirror "5.57.0"
+
 "@umijs/ast@3.2.17":
   version "3.2.17"
   resolved "https://registry.npm.taobao.org/@umijs/ast/download/@umijs/ast-3.2.17.tgz#e557b27ea0f41785501f5bef8edf23fda0287597"
@@ -5234,6 +5243,11 @@ coa@^2.0.2:
     chalk "^2.4.1"
     q "^1.1.2"
 
+codemirror@5.57.0:
+  version "5.57.0"
+  resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.57.0.tgz#d26365b72f909f5d2dbb6b1209349ca1daeb2d50"
+  integrity sha512-WGc6UL7Hqt+8a6ZAsj/f1ApQl3NPvHY/UQSzG6fB6l4BjExgVdhFaxd7mRTw1UCiYe/6q86zHP+kfvBQcZGvUg==
+
 collapse-white-space@^1.0.2:
   version "1.0.6"
   resolved "https://registry.npm.taobao.org/collapse-white-space/download/collapse-white-space-1.0.6.tgz#e63629c0016665792060dbbeb79c42239d2c5287"