From 4ff45220ee1aa6990736d67902d0d6699ee1bc67 Mon Sep 17 00:00:00 2001
From: Sychev Andrey <44414066+SychevAndrey@users.noreply.github.com>
Date: Tue, 19 Aug 2025 12:01:41 +0200
Subject: [PATCH] dbeaver/pro#6557 [CB] Dropdown for roles is too small (#3663)

* dbeaver/pro#6557 refactor: remove redundant width: 100%

There are a few reasons why we don't need this property:
0. It's already present in base Select styles
1. Select component is flex container by default, i.e. takes all available place
2. No evidences that it is needed

* dbeaver/pro#6557 fix: user filters selects

Simplifies layout and set min width for selects

---------

Co-authored-by: Daria Marutkina <125263541+dariamarutkina@users.noreply.github.com>
---
 .../packages/core-blocks/src/FormControls/Select.css   |  1 -
 .../UsersTable/Filters/UsersTableFiltersDetails.tsx    | 10 +++++-----
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/webapp/packages/core-blocks/src/FormControls/Select.css b/webapp/packages/core-blocks/src/FormControls/Select.css
index 2798201245..78a282d9d7 100644
--- a/webapp/packages/core-blocks/src/FormControls/Select.css
+++ b/webapp/packages/core-blocks/src/FormControls/Select.css
@@ -36,7 +36,6 @@
 
     --dbv-kit-select-border-radius: 3px;
     --dbv-kit-control-outline-offset: -2px;
-    width: 100%;
   }
 
   .dbv-kit-select {
diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/Filters/UsersTableFiltersDetails.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/Filters/UsersTableFiltersDetails.tsx
index 1df5443686..1d8c37e588 100644
--- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/Filters/UsersTableFiltersDetails.tsx
+++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/Filters/UsersTableFiltersDetails.tsx
@@ -8,7 +8,7 @@
 import { observer } from 'mobx-react-lite';
 
 import { AuthRolesResource } from '@cloudbeaver/core-authentication';
-import { Select, Group, useResource, useTranslate } from '@cloudbeaver/core-blocks';
+import { Select, useResource, useTranslate } from '@cloudbeaver/core-blocks';
 
 import { type IUserFilters, USER_ROLE_ALL, USER_STATUSES } from './useUsersTableFilters.js';
 
@@ -21,22 +21,22 @@ export const UsersTableFiltersDetails = observer<Props>(function UsersTableFilte
   const authRolesResource = useResource(UsersTableFiltersDetails, AuthRolesResource, undefined);
 
   return (
-    <Group box gap>
+    <div className="tw:flex tw:gap-4">
       <Select
         value={filters.status}
         items={USER_STATUSES}
         valueSelector={value => translate(value.label)}
         keySelector={value => value.value}
-        keepSize
+        className="tw:min-w-[172px]"
         onSelect={filters.setStatus}
       >
         {translate('authentication_user_status')}
       </Select>
       {!!authRolesResource.data.length && (
-        <Select items={[...authRolesResource.data, USER_ROLE_ALL]} value={filters.role} keepSize onSelect={filters.setRole}>
+        <Select items={[...authRolesResource.data, USER_ROLE_ALL]} value={filters.role} className="tw:min-w-[172px]" onSelect={filters.setRole}>
           {translate('authentication_user_role')}
         </Select>
       )}
-    </Group>
+    </div>
   );
 });