fix: only auth type plugin need to configure

web/cypress/integration/plugin/create-delete-in-drawer-plugin.spec.js

@@ -70,6 +70,23 @@ context('Delete Plugin List with the Drawer', () => {
     }).should('not.exist');
   });
 
+  it('should verify openid-connect and authz-keycloak plugin need to configure', function () {
+    cy.visit('/');
+    cy.contains('Plugin').click();
+    cy.contains('Enable').click();
+    ['openid-connect', 'authz-keycloak'].forEach((plugin) => {
+      cy.contains(plugin).parents(selector.pluginCardBordered).within(() => {
+        cy.get('button').click({
+          force: true
+        });
+      });
+      cy.get(selector.drawer).should('be.visible').within(() => {
+        cy.contains('.ant-alert-warning', 'Doesn\'t need configuration').should('not.exist');
+        cy.contains('button', 'Cancel').click();
+      });
+    })
+  })
+
   it('should delete the plugin with the drawer', function () {
     cy.visit('/plugin/list');
     cy.get(selector.refresh).click();

web/src/components/Plugin/PluginDetail.tsx

@@ -43,7 +43,6 @@ import type {languages} from "monaco-editor";
 import { fetchSchema } from './service';
 import { json2yaml, yaml2json } from '../../helpers';
 import { PluginForm, PLUGIN_UI_LIST } from './UI';
-import { PluginType } from './data';
 
 type Props = {
   name: string;
@@ -107,7 +106,7 @@ const PluginDetail: React.FC<Props> = ({
   const [form] = Form.useForm();
   const [UIForm] = Form.useForm();
   const data = initialData[name] || {};
-  const pluginType = pluginList.find((item) => item.name === name)?.type;
+  const pluginType = pluginList.find((item) => item.name === name)?.originType;
   const [content, setContent] = useState<string>(JSON.stringify(data, null, 2));
   const [monacoMode, setMonacoMode] = useState<PluginComponent.MonacoLanguage>(monacoModeList.JSON);
   const modeOptions: { label: string; value: string }[] = [
@@ -281,7 +280,7 @@ const PluginDetail: React.FC<Props> = ({
     setMonacoMode(value);
   };
 
-  const isNoConfigurationRequired = pluginType === PluginType.authentication && schemaType !== 'consumer' && (monacoMode !== monacoModeList.UIForm);
+  const isNoConfigurationRequired = pluginType === 'auth' && schemaType !== 'consumer' && (monacoMode !== monacoModeList.UIForm);
 
   return (
     <Drawer
@@ -412,7 +411,7 @@ const PluginDetail: React.FC<Props> = ({
           </Button>
         ]}
       />
-      {Boolean(monacoMode === monacoModeList.UIForm) && <PluginForm name={name} form={UIForm} renderForm={!(pluginType === PluginType.authentication && schemaType !== 'consumer')} />}
+      {Boolean(monacoMode === monacoModeList.UIForm) && <PluginForm name={name} form={UIForm} renderForm={!(pluginType === 'auth' && schemaType !== 'consumer')} />}
       <div style={{ display: monacoMode === monacoModeList.UIForm ? 'none' : 'unset' }}>
         <Editor
           value={content}

web/src/components/Plugin/service.ts

@@ -34,6 +34,7 @@ export const fetchList = () => {
     const typedData = data.data.map(item => ({
       ...item,
       type: PLUGIN_LIST[item.name]?.type || "other",
+      originType: item.type,
       hidden: PLUGIN_LIST[item.name]?.hidden || false
     }));
 

web/src/components/Plugin/typing.d.ts

@@ -24,6 +24,7 @@ declare namespace PluginComponent {
     priority: number;
     schema: Record<string, any>;
     type: string;
+    originType: string,
     version: number;
     consumer_schema?: Record<string, any>;
     hidden?: boolean;