feat: add search capability to cluster selector dropdown

Enable showSearch on the header cluster selector so users can quickly
filter clusters by name, pool, connection type or description.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
taylanbakircioglu
2026-02-16 16:49:37 +03:00
parent 4c7a6d79f3
commit e6142a9a9c
@@ -87,6 +87,7 @@ const ClusterSelector = () => {
<CloudServerOutlined style={{ color: '#1890ff', flexShrink: 0 }} />
<Select
value={selectedCluster?.id}
showSearch
style={{
width: getSelectWidth(),
minWidth: 180,
@@ -99,6 +100,18 @@ const ClusterSelector = () => {
selectCluster(cluster);
}
}}
filterOption={(input, option) => {
if (!input) return true;
const cluster = clusters.find(c => c.id === option?.value);
if (!cluster) return false;
const search = input.toLowerCase();
return (
(cluster.name || '').toLowerCase().includes(search) ||
(cluster.pool_name || '').toLowerCase().includes(search) ||
(cluster.connection_type || '').toLowerCase().includes(search) ||
(cluster.description || '').toLowerCase().includes(search)
);
}}
optionLabelProp="label"
size="middle"
>