(inlong) branch master updated: [INLONG-11449][Dashboard] Add clear and search functions to some drop-down boxes (#11450)

[dockerzhang]

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

dockerzhang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/inlong.git


The following commit(s) were added to refs/heads/master by this push:
     new 075723bbf2 [INLONG-11449][Dashboard] Add clear and search functions to 
some drop-down boxes (#11450)
075723bbf2 is described below

commit 075723bbf25dc297b9842d3fcb85a5ca2548242e
Author: kamianlaida <165994047+wohainilao...@users.noreply.github.com>
AuthorDate: Sun Nov 3 10:46:31 2024 +0800

    [INLONG-11449][Dashboard] Add clear and search functions to some drop-down 
boxes (#11450)
---
 inlong-dashboard/src/plugins/sources/common/SourceDefaultInfo.ts | 3 +--
 inlong-dashboard/src/ui/pages/ConsumeDashboard/index.tsx         | 8 ++++++++
 inlong-dashboard/src/ui/pages/GroupDashboard/index.tsx           | 4 ++++
 inlong-dashboard/src/ui/pages/GroupDetail/DataStream/config.tsx  | 4 ++++
 inlong-dashboard/src/ui/pages/SynchronizeDashboard/index.tsx     | 4 ++++
 5 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/inlong-dashboard/src/plugins/sources/common/SourceDefaultInfo.ts 
b/inlong-dashboard/src/plugins/sources/common/SourceDefaultInfo.ts
index 0c1383af0a..b89a77ada9 100644
--- a/inlong-dashboard/src/plugins/sources/common/SourceDefaultInfo.ts
+++ b/inlong-dashboard/src/plugins/sources/common/SourceDefaultInfo.ts
@@ -100,10 +100,9 @@ export class SourceDefaultInfo implements DataWithBackend, 
RenderRow, RenderList
     type: 'select',
     hidden: true,
   })
-  @ColumnDecorator()
   @IngestionField()
   @I18n('meta.Sources.File.ClusterName')
-  clusterTag: string;
+  readonly clusterTag: string;
 
   @FieldDecorator({
     type: 'input',
diff --git a/inlong-dashboard/src/ui/pages/ConsumeDashboard/index.tsx 
b/inlong-dashboard/src/ui/pages/ConsumeDashboard/index.tsx
index b03d9d4687..664e0c3f76 100644
--- a/inlong-dashboard/src/ui/pages/ConsumeDashboard/index.tsx
+++ b/inlong-dashboard/src/ui/pages/ConsumeDashboard/index.tsx
@@ -135,6 +135,10 @@ const Comp: React.FC = () => {
           allowClear: true,
           options: lastConsumerStatusList,
           dropdownMatchSelectWidth: false,
+          showSearch: true,
+          filterOption: (keyword: string, option: { label: any }) => {
+            return (option?.label ?? 
'').toLowerCase().includes(keyword.toLowerCase());
+          },
         },
       },
       {
@@ -146,6 +150,10 @@ const Comp: React.FC = () => {
           allowClear: true,
           options: consumes.filter(x => x.value),
           dropdownMatchSelectWidth: false,
+          showSearch: true,
+          filterOption: (keyword: string, option: { label: any }) => {
+            return (option?.label ?? 
'').toLowerCase().includes(keyword.toLowerCase());
+          },
         },
       },
     ],
diff --git a/inlong-dashboard/src/ui/pages/GroupDashboard/index.tsx 
b/inlong-dashboard/src/ui/pages/GroupDashboard/index.tsx
index 4e602b44ba..10913a199d 100644
--- a/inlong-dashboard/src/ui/pages/GroupDashboard/index.tsx
+++ b/inlong-dashboard/src/ui/pages/GroupDashboard/index.tsx
@@ -172,6 +172,10 @@ const Comp: React.FC = () => {
           allowClear: true,
           options: statusList,
           dropdownMatchSelectWidth: false,
+          showSearch: true,
+          filterOption: (keyword: string, option: { label: any }) => {
+            return (option?.label ?? 
'').toLowerCase().includes(keyword.toLowerCase());
+          },
         },
       },
       {
diff --git a/inlong-dashboard/src/ui/pages/GroupDetail/DataStream/config.tsx 
b/inlong-dashboard/src/ui/pages/GroupDetail/DataStream/config.tsx
index b906633e43..05499d5bee 100644
--- a/inlong-dashboard/src/ui/pages/GroupDetail/DataStream/config.tsx
+++ b/inlong-dashboard/src/ui/pages/GroupDetail/DataStream/config.tsx
@@ -35,6 +35,10 @@ export const getFilterFormContent = (defaultValues = {} as 
any) => [
       allowClear: true,
       options: statusList,
       dropdownMatchSelectWidth: false,
+      showSearch: true,
+      filterOption: (keyword: string, option: { label: any }) => {
+        return (option?.label ?? 
'').toLowerCase().includes(keyword.toLowerCase());
+      },
     },
   },
 ];
diff --git a/inlong-dashboard/src/ui/pages/SynchronizeDashboard/index.tsx 
b/inlong-dashboard/src/ui/pages/SynchronizeDashboard/index.tsx
index b096f9957f..33fc2202c6 100644
--- a/inlong-dashboard/src/ui/pages/SynchronizeDashboard/index.tsx
+++ b/inlong-dashboard/src/ui/pages/SynchronizeDashboard/index.tsx
@@ -170,6 +170,10 @@ const Comp: React.FC = () => {
           allowClear: true,
           options: statusList,
           dropdownMatchSelectWidth: false,
+          showSearch: true,
+          filterOption: (keyword: string, option: { label: any }) => {
+            return (option?.label ?? 
'').toLowerCase().includes(keyword.toLowerCase());
+          },
         },
       },
       {