CB-6119 await promise (#3235)

* CB-6119 await promise

* CB-6119 move loading logic to the parent component

---------

Co-authored-by: Daria Marutkina <125263541+dariamarutkina@users.noreply.github.com>

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/User.tsx

@@ -8,22 +8,11 @@
 import { observer } from 'mobx-react-lite';
 
 import { type AdminUser, UsersResource } from '@cloudbeaver/core-authentication';
-import {
-  Checkbox,
-  Link,
-  Loader,
-  Placeholder,
-  TableColumnValue,
-  TableItem,
-  TableItemSelect,
-  useAutoLoad,
-  useTranslate,
-} from '@cloudbeaver/core-blocks';
+import { Checkbox, Link, Loader, Placeholder, TableColumnValue, TableItem, TableItemSelect, useTranslate } from '@cloudbeaver/core-blocks';
 import { useService } from '@cloudbeaver/core-di';
 import { NotificationService } from '@cloudbeaver/core-events';
 import { clsx } from '@cloudbeaver/core-utils';
 
-import { AdministrationUsersManagementService } from '../../../AdministrationUsersManagementService.js';
 import { UsersAdministrationService } from '../UsersAdministrationService.js';
 import style from './User.module.css';
 import { UsersTableOptionsPanelService } from './UsersTableOptionsPanelService.js';
@@ -31,19 +20,17 @@ import { UsersTableOptionsPanelService } from './UsersTableOptionsPanelService.j
 interface Props {
   user: AdminUser;
   displayAuthRole: boolean;
+  isManageable: boolean;
   selectable?: boolean;
 }
 
-export const User = observer<Props>(function User({ user, displayAuthRole, selectable }) {
+export const User = observer<Props>(function User({ user, displayAuthRole, isManageable, selectable }) {
   const usersAdministrationService = useService(UsersAdministrationService);
   const usersService = useService(UsersResource);
   const notificationService = useService(NotificationService);
-  const administrationUsersManagementService = useService(AdministrationUsersManagementService);
   const usersTableOptionsPanelService = useService(UsersTableOptionsPanelService);
   const translate = useTranslate();
 
-  useAutoLoad(User, administrationUsersManagementService.loaders);
-
   async function handleEnabledCheckboxChange(enabled: boolean) {
     try {
       await usersService.enableUser(user.userId, enabled);
@@ -56,7 +43,6 @@ export const User = observer<Props>(function User({ user, displayAuthRole, selec
     ? translate('administration_teams_team_granted_users_permission_denied')
     : undefined;
 
-  const userManagementDisabled = administrationUsersManagementService.externalUserProviderEnabled;
   const teams = user.grantedTeams.join(', ');
 
   return (
@@ -80,7 +66,7 @@ export const User = observer<Props>(function User({ user, displayAuthRole, selec
       <TableColumnValue>
         <Checkbox
           checked={user.enabled}
-          disabled={usersService.isActiveUser(user.userId) || userManagementDisabled}
+          disabled={usersService.isActiveUser(user.userId) || !isManageable}
           title={enabledCheckboxTitle}
           onChange={handleEnabledCheckboxChange}
         />

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersPage.tsx

@@ -36,7 +36,7 @@ export const UsersPage = observer<Props>(function UsersPage({ param }) {
   const create = param === 'create';
   const displayAuthRole = authRolesResource.data.length > 0;
   const loading = authRolesResource.isLoading() || table.loadableState.isLoading();
-  const userManagementDisabled = administrationUsersManagementService.externalUserProviderEnabled;
+  const isManageable = !administrationUsersManagementService.externalUserProviderEnabled;
 
   return (
     <ColoredContainer vertical wrap gap parent maximum>
@@ -49,7 +49,7 @@ export const UsersPage = observer<Props>(function UsersPage({ param }) {
       </Group>
 
       <Container overflow gap maximum>
-        {create && createUserService.state && !userManagementDisabled && (
+        {create && createUserService.state && isManageable && (
           <CreateUser state={createUserService.state} onCancel={createUserService.cancelCreate} />
         )}
 
@@ -63,6 +63,7 @@ export const UsersPage = observer<Props>(function UsersPage({ param }) {
             displayAuthRole={displayAuthRole}
             loading={loading}
             hasMore={table.hasMore}
+            isManageable={isManageable}
             onLoadMore={table.loadMore}
           />
         </Group>

webapp/packages/plugin-authentication-administration/src/Administration/Users/UsersTable/UsersTable.tsx

@@ -33,6 +33,7 @@ interface Props {
   displayAuthRole: boolean;
   loading?: boolean;
   hasMore: boolean;
+  isManageable: boolean;
   onLoadMore?: () => void;
 }
 
@@ -43,6 +44,7 @@ export const UsersTable = observer<Props>(function UsersTable({
   displayAuthRole,
   loading,
   hasMore,
+  isManageable,
   onLoadMore,
 }) {
   const translate = useTranslate();
@@ -66,7 +68,7 @@ export const UsersTable = observer<Props>(function UsersTable({
       </TableHeader>
       <TableBody>
         {users.map(user => (
-          <User key={user.userId} user={user} displayAuthRole={displayAuthRole} />
+          <User key={user.userId} user={user} displayAuthRole={displayAuthRole} isManageable={isManageable} />
         ))}
         {(loading || users.length === 0) && (
           <TableItem item="empty">