From 7272b18b81cffa4ebc8292977241c214848fed61 Mon Sep 17 00:00:00 2001
From: naumov <iamemptyhuh@gmail.com>
Date: Tue, 29 Oct 2024 15:43:57 +0100
Subject: [PATCH] CB-5819 keep loader mounted

---
 .../Users/UsersTable/UsersTable.module.css             | 10 ++++++++++
 .../src/Administration/Users/UsersTable/UsersTable.tsx |  6 +++++-
 2 files changed, 15 insertions(+), 1 deletion(-)
 create mode 100644 webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.module.css

diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.module.css b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.module.css
new file mode 100644
index 0000000000..b4bcb559d9
--- /dev/null
+++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.module.css
@@ -0,0 +1,10 @@
+/*
+ * CloudBeaver - Cloud Database Manager
+ * Copyright (C) 2020-2024 DBeaver Corp and others
+ *
+ * Licensed under the Apache License, Version 2.0.
+ * you may not use this file except in compliance with the License.
+ */
+.loader.hidden {
+  opacity: 0;
+}
diff --git a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.tsx b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.tsx
index 164450b0f7..b40ad9e71d 100644
--- a/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.tsx
+++ b/webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.tsx
@@ -11,17 +11,20 @@ import {
   Button,
   Flex,
   Loader,
+  s,
   Table,
   TableBody,
   TableColumnHeader,
   TableColumnValue,
   TableHeader,
   TableItem,
+  useS,
   useTranslate,
 } from '@cloudbeaver/core-blocks';
 import type { AdminUserInfoFragment } from '@cloudbeaver/core-sdk';
 
 import { User } from './User.js';
+import classes from './UsersTable.module.css';
 
 interface Props {
   users: AdminUserInfoFragment[];
@@ -45,6 +48,7 @@ export const UsersTable = observer<Props>(function UsersTable({
   const translate = useTranslate();
   const keys = users.map(user => user.userId);
   const colSpan = displayAuthRole ? 6 : 5;
+  const styles = useS(classes);
 
   return (
     <Table keys={keys} selectedItems={selectedItems} expandedItems={expandedItems} size="big">
@@ -52,7 +56,7 @@ export const UsersTable = observer<Props>(function UsersTable({
         <TableColumnHeader>
           <Flex align="center" gap="xs">
             {translate('authentication_user_name')}
-            <Loader loading={loading} small inline />
+            <Loader className={s(styles, { loader: true, hidden: !loading })} small inline />
           </Flex>
         </TableColumnHeader>
         {displayAuthRole && <TableColumnHeader>{translate('authentication_user_role')}</TableColumnHeader>}