fix: Users can create a Consumer in Dashboard without enabling the pl…

…ugin (#2442)
apache · Jun 6, 2022 · a2fe71d · a2fe71d
1 parent 8f67daf
commit a2fe71d
Show file tree

Hide file tree

Showing 8 changed files with 34 additions and 53 deletions.
diff --git a/web/cypress/integration/consumer/create_and_delete_consumer.spec.js b/web/cypress/integration/consumer/create_and_delete_consumer.spec.js
@@ -34,6 +34,7 @@ context('Create and Delete Consumer', () => {
 
   const data = {
     consumerName: 'test_consumer',
+    noPluginsConsumerName: 'no_plugins_consumer',
     description: 'desc_by_autotest',
     createConsumerSuccess: 'Create Consumer Successfully',
     deleteConsumerSuccess: 'Delete Consumer Successfully',
@@ -47,6 +48,27 @@ context('Create and Delete Consumer', () => {
     cy.fixture('data.json').as('data');
   });
 
+  it('creates consumer without plugins', function () {
+    cy.visit('/consumer/list');
+    cy.contains('Create').click();
+    // basic information
+    cy.get(selector.username).type(data.noPluginsConsumerName);
+    cy.get(selector.description).type(data.description);
+    cy.contains('Next').click();
+
+    cy.contains('button', 'Next').click();
+    cy.contains('button', 'Submit').click();
+    cy.get(selector.notification).should('contain', data.createConsumerSuccess);
+
+    cy.contains(data.noPluginsConsumerName)
+      .should('be.visible')
+      .siblings()
+      .contains('Delete')
+      .click();
+    cy.contains('button', 'Confirm').click();
+    cy.get(selector.notification).should('contain', data.deleteConsumerSuccess);
+  });
+
   it('creates consumer with key-auth', function () {
     cy.visit('/');
     cy.contains('Consumer').click();
@@ -57,13 +79,6 @@ context('Create and Delete Consumer', () => {
     cy.get(selector.description).type(data.description);
     cy.contains('Next').click();
 
-    cy.contains('Next').click();
-    cy.get(selector.notification).should(
-      'contain',
-      'Please enable at least one of the following authentication plugin: basic-auth, hmac-auth, jwt-auth, key-auth, ldap-auth, wolf-rbac',
-    );
-    cy.get(selector.notificationCloseIcon).click().should('not.exist');
-
     // plugin config
     cy.contains(selector.pluginCard, 'key-auth').within(() => {
       cy.contains('Enable').click({

diff --git a/web/cypress/integration/route/create-edit-duplicate-delete-route.spec.js b/web/cypress/integration/route/create-edit-duplicate-delete-route.spec.js
@@ -315,9 +315,9 @@ context('Create and Delete Route', () => {
         .within(() => {
           cy.contains('OK').click();
         });
-      cy.get(selector.deleteAlert).within(()=>{
+      cy.get(selector.deleteAlert).within(() => {
         cy.get('.ant-btn-loading-icon').should('be.visible');
-      })
+      });
       cy.get(selector.notification).should('contain', data.deleteRouteSuccess);
       cy.get(selector.notificationCloseIcon).click();
     });

diff --git a/web/src/components/RawDataEditor/RawDataEditor.tsx b/web/src/components/RawDataEditor/RawDataEditor.tsx
@@ -172,6 +172,7 @@ const RawDataEditor: React.FC<Props> = ({
           title=""
           extra={[
             <Select
+              key={'monaco-language'}
               defaultValue={monacoLanguageList.JSON}
               value={monacoLanguage}
               options={modeOptions}
@@ -181,6 +182,7 @@ const RawDataEditor: React.FC<Props> = ({
               data-cy="monaco-language"
             />,
             <CopyToClipboard
+              key={'copy'}
               text={content}
               onCopy={(_: string, result: boolean) => {
                 if (!result) {
@@ -204,7 +206,7 @@ const RawDataEditor: React.FC<Props> = ({
               onClick={() => {
                 window.open(`https://apisix.apache.org/docs/apisix/admin-api#${type}`);
               }}
-              key={1}
+              key={'document'}
             >
               {formatMessage({ id: 'component.global.document' })}
             </Button>,

diff --git a/web/src/pages/Consumer/Create.tsx b/web/src/pages/Consumer/Create.tsx
@@ -24,13 +24,11 @@ import PluginPage from '@/components/Plugin';
 
 import Step1 from './components/Step1';
 import Preview from './components/Preview';
-import { fetchItem, create, update, fetchPlugList } from './service';
+import { fetchItem, create, update } from './service';
 
 const Page: React.FC = (props) => {
   const [step, setStep] = useState(1);
   const [plugins, setPlugins] = useState<PluginComponent.Data>({});
-  const [pluginList, setPluginList] = useState<PluginComponent.Meta[]>([]);
-  const [authPluginList, setAuthPluginList] = useState<string[]>([]);
   const [form1] = Form.useForm();
   const { formatMessage } = useIntl();
 
@@ -43,15 +41,6 @@ const Page: React.FC = (props) => {
         setPlugins(rest.plugins);
       });
     }
-
-    fetchPlugList().then((data) => {
-      setPluginList(data);
-      const authList = data
-        .filter((item) => item.type === 'auth')
-        .map((item) => item.name)
-        .sort();
-      setAuthPluginList(authList);
-    });
   }, []);
 
   const onSubmit = () => {
@@ -79,21 +68,6 @@ const Page: React.FC = (props) => {
         setStep(nextStep);
       });
     } else if (nextStep === 3) {
-      // TRICK: waiting for https://github.com/apache/apisix-dashboard/issues/532
-      if (
-        !Object.keys(plugins).filter(
-          (name) =>
-            pluginList.find((item) => item.name === name)!.type === 'auth' &&
-            !plugins[name].disable,
-        ).length
-      ) {
-        notification.warning({
-          message: `${formatMessage({
-            id: 'page.consumer.notification.warning.enableAuthenticationPlugin',
-          })} ${authPluginList.join(', ')}`,
-        });
-        return;
-      }
       setStep(3);
     } else if (nextStep === 4) {
       onSubmit();

diff --git a/web/src/pages/Consumer/List.tsx b/web/src/pages/Consumer/List.tsx
@@ -59,7 +59,8 @@ const Page: React.FC = () => {
       title: formatMessage({ id: 'menu.plugin' }),
       dataIndex: 'plugins',
       hideInSearch: true,
-      render: (_, record) => Object.keys(record.plugins || []).join(','),
+      render: (_, record) =>
+        Object.keys(record.plugins || {}).length > 0 ? Object.keys(record.plugins).join(',') : '-',
     },
     {
       title: formatMessage({ id: 'component.global.operation' }),
@@ -116,7 +117,7 @@ const Page: React.FC = () => {
       <ProTable<ConsumerModule.ResEntity>
         actionRef={ref}
         columns={columns}
-        rowKey="id"
+        rowKey="username"
         request={fetchList}
         pagination={{
           onChange: (page, pageSize?) => savePageList(page, pageSize),

diff --git a/web/src/pages/Consumer/locales/en-US.ts b/web/src/pages/Consumer/locales/en-US.ts
@@ -18,14 +18,12 @@ export default {
   'page.consumer.form.itemRuleMessage.username':
     'Maximum length is 100, only letters, numbers and _ are supported.',
   'page.consumer.form.itemExtraMessage.username': 'Name should be unique',
-  'page.consumer.notification.warning.enableAuthenticationPlugin':
-    'Please enable at least one of the following authentication plugin:',
   'page.consumer.username': 'Name',
   'page.consumer.username.required': "Please enter the Consumer's name",
   'page.consumer.updateTime': 'Update Time',
   'page.consumer.list': 'Consumer List',
   'page.consumer.description':
-    'Consumers are the consumers of Routes, e.g developers, end users, API calls, etc. When creating a consumer, you need to bind at least one Authentication plugin.',
+    'Consumers are the consumers of Routes, e.g developers, end users, API calls, etc.',
   'page.consumer.create': 'Create Consumer',
   'page.consumer.configure': 'Configure Consumer',
 };
diff --git a/web/src/pages/Consumer/locales/zh-CN.ts b/web/src/pages/Consumer/locales/zh-CN.ts
@@ -15,16 +15,13 @@
  * limitations under the License.
  */
 export default {
-  'page.consumer.form.itemRuleMessage.username':
-    '最大长度100，仅支持字母、数字和 _ 。',
+  'page.consumer.form.itemRuleMessage.username': '最大长度100，仅支持字母、数字和 _ 。',
   'page.consumer.form.itemExtraMessage.username': '名称需唯一',
-  'page.consumer.notification.warning.enableAuthenticationPlugin': '请至少启用如下一种认证类插件：',
   'page.consumer.username': '名称',
   'page.consumer.username.required': '请输入消费者名称',
   'page.consumer.updateTime': '更新时间',
   'page.consumer.list': '消费者列表',
-  'page.consumer.description':
-    '消费者是路由的消费方，形式包括开发者、最终用户、API 调用等。创建消费者时，需绑定至少一个认证类插件。',
+  'page.consumer.description': '消费者是路由的消费方，形式包括开发者、最终用户、API 调用等。',
   'page.consumer.create': '创建消费者',
   'page.consumer.configure': '配置消费者',
 };
diff --git a/web/src/pages/Consumer/service.ts b/web/src/pages/Consumer/service.ts
@@ -44,9 +44,3 @@ export const update = (username: string, data: ConsumerModule.Entity) =>
   });
 
 export const remove = (username: string) => request(`/consumers/${username}`, { method: 'DELETE' });
-
-export const fetchPlugList = () => {
-  return request<Res<PluginComponent.Meta[]>>('/plugins?all=true').then((data) => {
-    return data.data;
-  });
-};