diff --git a/webapp/packages/core-connections/src/ConnectionsManagerService.ts b/webapp/packages/core-connections/src/ConnectionsManagerService.ts
index 7cb53f8ab2..2a5a010a51 100644
--- a/webapp/packages/core-connections/src/ConnectionsManagerService.ts
+++ b/webapp/packages/core-connections/src/ConnectionsManagerService.ts
@@ -85,9 +85,9 @@ export class ConnectionsManagerService {
 
   hasAnyConnection(connected?: boolean): boolean {
     if (connected) {
-      return Array.from(this.connectionInfo.data.values()).some(connection => connection.connected);
+      return this.connectionInfo.values.some(connection => connection.connected);
     }
-    return !!Array.from(this.connectionInfo.data.values()).length;
+    return !!this.connectionInfo.values.length;
   }
 
   private connectionContext() {
@@ -103,7 +103,7 @@ export class ConnectionsManagerService {
       if (!this.hasAnyConnection()) {
         return;
       }
-      connectionId = Array.from(this.connectionInfo.data.values())[0].id;
+      connectionId = this.connectionInfo.values[0].id;
     }
 
     try {
@@ -135,7 +135,7 @@ export class ConnectionsManagerService {
     const { controller, notification } = this.notificationService.processNotification(() => ProcessSnackbar, {}, { title: 'Disconnecting...' });
 
     try {
-      for (const connection of this.connectionInfo.data.values()) {
+      for (const connection of this.connectionInfo.values) {
         await this._closeConnectionAsync(connection);
       }
       notification.close();
diff --git a/webapp/packages/core-connections/src/useConnectionInfo.ts b/webapp/packages/core-connections/src/useConnectionInfo.ts
index 9317cba37c..331d20934e 100644
--- a/webapp/packages/core-connections/src/useConnectionInfo.ts
+++ b/webapp/packages/core-connections/src/useConnectionInfo.ts
@@ -15,18 +15,19 @@ import { ConnectionsManagerService } from './ConnectionsManagerService';
 
 export function useConnectionInfo(connectionId: string) {
   const manager = useService(ConnectionsManagerService);
-  const service = useService(ConnectionInfoResource);
+  const resource = useService(ConnectionInfoResource);
 
-  const connectionInfo = service.get(connectionId);
-  const load = useCallback(() => service.load(connectionId), [service, connectionId]);
-  const refresh = useCallback(() => service.refresh(connectionId), [service, connectionId]);
-  const isLoading = useCallback(() => service.isDataLoading(connectionId), [service, connectionId]);
-  const isLoaded = useCallback(() => service.isLoaded(connectionId), [service, connectionId]);
-  const isOutdated = useCallback(() => service.isOutdated(connectionId), [service, connectionId]);
+  const connectionInfo = resource.get(connectionId);
+  const load = useCallback(() => resource.load(connectionId), [resource, connectionId]);
+  const refresh = useCallback(() => resource.refresh(connectionId), [resource, connectionId]);
+  const isLoading = useCallback(() => resource.isDataLoading(connectionId), [resource, connectionId]);
+  const isLoaded = useCallback(() => resource.isLoaded(connectionId), [resource, connectionId]);
+  const isOutdated = useCallback(() => resource.isOutdated(connectionId), [resource, connectionId]);
   const connect = useCallback(() => manager.requireConnection(connectionId), [manager, connectionId]);
 
   return {
     connectionInfo,
+    resource,
     isLoading,
     isLoaded,
     isOutdated,
diff --git a/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx b/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
index 92eb461e27..426d066b3c 100644
--- a/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
+++ b/webapp/packages/plugin-object-viewer/src/ObjectViewerPanel.tsx
@@ -7,7 +7,7 @@
  */
 
 import { observer } from 'mobx-react-lite';
-import { useCallback } from 'react';
+import { useCallback, useState } from 'react';
 import styled, { css } from 'reshadow';
 
 import { useChildren, TabHandlerPanelProps } from '@cloudbeaver/core-app';
@@ -43,6 +43,7 @@ export const ObjectViewerPanel = observer(function ObjectViewerPanel({
   tab,
 }: TabHandlerPanelProps<IObjectViewerTabState>) {
   const translate = useTranslate();
+  const [connecting, setConnecting] = useState(false);
   const connection = useConnectionInfo(tab.handlerState.connectionId || '');
   const style = useStyles(styles);
   const {
@@ -52,21 +53,24 @@ export const ObjectViewerPanel = observer(function ObjectViewerPanel({
   const pages = dbObjectPagesService.orderedPages;
 
   const handleConnect = useCallback(async () => {
-    await connection.connect();
+    setConnecting(true);
+    try {
+      await connection.connect();
+    } finally {
+      setConnecting(false);
+    }
   }, [connection]);
 
-  if (connection.connectionInfo) {
-    if (connection.isLoading() && !isLoaded()) {
+  if (connection.connectionInfo && !connection.connectionInfo.connected) {
+    if (connecting || connection.isLoading()) {
       return <Loader />;
     }
 
-    if (!connection.connectionInfo.connected) {
-      return (
-        <TextPlaceholder>
-          <Button type="button" mod={['unelevated']} onClick={handleConnect}>{translate('connections_connection_connect')}</Button>
-        </TextPlaceholder>
-      );
-    }
+    return (
+      <TextPlaceholder>
+        <Button type="button" mod={['unelevated']} onClick={handleConnect}>{translate('connections_connection_connect')}</Button>
+      </TextPlaceholder>
+    );
   }
 
   if (tab.handlerState.error) {