[apisix-dashboard] 03/05: feat: add tips when plugin type is auth and schemaType is not consumer (#1219)

[juzhiyuan]

This is an automated email from the ASF dual-hosted git repository.

juzhiyuan pushed a commit to branch v2.3-sync
in repository https://gitbox.apache.org/repos/asf/apisix-dashboard.git

commit fb017217ee1b2def60b116cdcab84a07a460b151
Author: litesun <su...@apache.org>
AuthorDate: Wed Jan 6 14:17:55 2021 +0800

    feat: add tips when plugin type is auth and schemaType is not consumer 
(#1219)
    
    Co-authored-by: 琚致远 <juzhiy...@apache.org>
---
 web/src/components/Plugin/PluginDetail.tsx | 17 +++++++++++------
 web/src/components/Plugin/PluginPage.tsx   |  1 +
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/web/src/components/Plugin/PluginDetail.tsx 
b/web/src/components/Plugin/PluginDetail.tsx
index 2ff336c..b154985 100644
--- a/web/src/components/Plugin/PluginDetail.tsx
+++ b/web/src/components/Plugin/PluginDetail.tsx
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 import React, { useEffect, useRef } from 'react';
-import { Button, notification, PageHeader, Switch, Form, Select, Divider, 
Drawer } from 'antd';
+import { Button, notification, PageHeader, Switch, Form, Select, Divider, 
Drawer, Alert } from 'antd';
 import { useIntl } from 'umi';
 import CodeMirror from '@uiw/react-codemirror';
 import { js_beautify } from 'js-beautify';
@@ -29,6 +29,7 @@ type Props = {
   type?: 'global' | 'scoped';
   schemaType: PluginComponent.Schema;
   initialData: object;
+  pluginList: PluginComponent.Meta[],
   readonly?: boolean;
   visible: boolean;
   onClose?: () => void;
@@ -65,15 +66,17 @@ const PluginDetail: React.FC<Props> = ({
   type = 'scoped',
   schemaType = 'route',
   visible,
+  pluginList = [],
   readonly = false,
   initialData = {},
-  onClose = () => {},
-  onChange = () => {},
+  onClose = () => { },
+  onChange = () => { },
 }) => {
   const { formatMessage } = useIntl();
   const [form] = Form.useForm();
   const ref = useRef<any>(null);
-  const data = initialData[name];
+  const data = initialData[name] || {};
+  const pluginType = pluginList.find(item => item.name === name)?.type
 
   useEffect(() => {
     form.setFieldsValue({ disable: initialData[name] && 
!initialData[name].disable });
@@ -149,7 +152,7 @@ const PluginDetail: React.FC<Props> = ({
         placement="right"
         closable={false}
         onClose={onClose}
-        width={600}
+        width={700}
         footer={
           <div style={{ display: 'flex', justifyContent: 'space-between' }}>
             {' '}
@@ -204,7 +207,9 @@ const PluginDetail: React.FC<Props> = ({
         <Divider orientation="left">Data Editor</Divider>
         <PageHeader
           title=""
-          subTitle={`Current Plugin: ${name}`}
+          subTitle={
+            (pluginType === 'auth' && schemaType !== 'consumer') ? <Alert 
message={`${name} does not require configuration`} type="warning" />
+              : <>Current plugin: {name}</>}
           ghost={false}
           extra={[
             <Button
diff --git a/web/src/components/Plugin/PluginPage.tsx 
b/web/src/components/Plugin/PluginPage.tsx
index cde2897..f6d45a4 100644
--- a/web/src/components/Plugin/PluginPage.tsx
+++ b/web/src/components/Plugin/PluginPage.tsx
@@ -140,6 +140,7 @@ const PluginPage: React.FC<Props> = ({
         visible={name !== NEVER_EXIST_PLUGIN_FLAG}
         schemaType={schemaType}
         initialData={initialData}
+        pluginList={pluginList}
         onClose={() => {
           setName(NEVER_EXIST_PLUGIN_FLAG);
         }}