random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2024-11-25 15:06:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix initial container loading in Fabric (#1771)

Browse Source 
* Fix initial container loading in Fabric

There is a rendering issue where the documents table doesn't resize properly if explorer is loaded in the beackground (invisible).
To workaround this, track DE visibility from Fabric RPC and open the first container only once DE becomes visible. If DE has been already shown, open the container right away.

* Preserve glitchy behavior if Fabric UX doesn't send isVisible

* Preserve Fabric visibility in global status
and fix a race condition where visibility might change during initialization.
This commit is contained in:
Vsevolod Kukol 2024-03-26 17:22:15 +01:00 committed by GitHub
parent e09930d9d0
commit 0df68c4967
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 20 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/Contracts/FabricMessagesContract.ts
View File

@ -53,6 +53,7 @@ export type FabricMessageV2 =
id: string; id: string;
message: { message: {
connectionId: string; connectionId: string;
isVisible: boolean;
}; };
} }
| { | {
@ -72,7 +73,7 @@ export type FabricMessageV2 =
}; };
} }
| { | {
type: "setToolbarStatus"; type: "explorerVisible";
message: { message: {
visible: boolean; visible: boolean;
}; };

1
src/UserContext.ts
View File

@ -51,6 +51,7 @@ interface FabricContext {
connectionId: string; connectionId: string;
databaseConnectionInfo: FabricDatabaseConnectionInfo | undefined; databaseConnectionInfo: FabricDatabaseConnectionInfo | undefined;
isReadOnly: boolean; isReadOnly: boolean;
isVisible: boolean;
} }
export type AdminFeedbackControlPolicy = export type AdminFeedbackControlPolicy =

22
src/hooks/useKnockoutExplorer.ts
View File

@ -2,7 +2,6 @@ import { createUri } from "Common/UrlUtility";
import { DATA_EXPLORER_RPC_VERSION } from "Contracts/DataExplorerMessagesContract"; import { DATA_EXPLORER_RPC_VERSION } from "Contracts/DataExplorerMessagesContract";
import { FABRIC_RPC_VERSION, FabricMessageV2 } from "Contracts/FabricMessagesContract"; import { FABRIC_RPC_VERSION, FabricMessageV2 } from "Contracts/FabricMessagesContract";
import Explorer from "Explorer/Explorer"; import Explorer from "Explorer/Explorer";
import { useCommandBar } from "Explorer/Menus/CommandBar/CommandBarComponentAdapter";
import { useSelectedNode } from "Explorer/useSelectedNode"; import { useSelectedNode } from "Explorer/useSelectedNode";
import { scheduleRefreshDatabaseResourceToken } from "Platform/Fabric/FabricUtil"; import { scheduleRefreshDatabaseResourceToken } from "Platform/Fabric/FabricUtil";
import { getNetworkSettingsWarningMessage } from "Utils/NetworkUtility"; import { getNetworkSettingsWarningMessage } from "Utils/NetworkUtility";
@ -90,6 +89,7 @@ async function configureFabric(): Promise<Explorer> {
// These are the versions of Fabric that Data Explorer supports. // These are the versions of Fabric that Data Explorer supports.
const SUPPORTED_FABRIC_VERSIONS = [FABRIC_RPC_VERSION]; const SUPPORTED_FABRIC_VERSIONS = [FABRIC_RPC_VERSION];
let firstContainerOpened = false;
let explorer: Explorer; let explorer: Explorer;
return new Promise<Explorer>((resolve) => { return new Promise<Explorer>((resolve) => {
window.addEventListener( window.addEventListener(
@ -121,7 +121,10 @@ async function configureFabric(): Promise<Explorer> {
await scheduleRefreshDatabaseResourceToken(true); await scheduleRefreshDatabaseResourceToken(true);
resolve(explorer); resolve(explorer);
await explorer.refreshAllDatabases(); await explorer.refreshAllDatabases();
openFirstContainer(explorer, userContext.fabricContext.databaseConnectionInfo.databaseId); if (userContext.fabricContext.isVisible && !firstContainerOpened) {
firstContainerOpened = true;
openFirstContainer(explorer, userContext.fabricContext.databaseConnectionInfo.databaseId);
}
break; break;
} }
case "newContainer": case "newContainer":
@ -132,8 +135,16 @@ async function configureFabric(): Promise<Explorer> {
handleCachedDataMessage(data); handleCachedDataMessage(data);
break; break;
} }
case "setToolbarStatus": { case "explorerVisible": {
useCommandBar.getState().setIsHidden(data.message.visible === false); userContext.fabricContext.isVisible = data.message.visible;
if (
userContext.fabricContext.isVisible &&
!firstContainerOpened &&
userContext?.fabricContext?.databaseConnectionInfo?.databaseId !== undefined
) {
firstContainerOpened = true;
openFirstContainer(explorer, userContext.fabricContext.databaseConnectionInfo.databaseId);
}
break; break;
} }
default: default:
@ -327,12 +338,13 @@ function configureHostedWithResourceToken(config: ResourceToken): Explorer {
return explorer; return explorer;
} }
function createExplorerFabric(params: { connectionId: string }): Explorer { function createExplorerFabric(params: { connectionId: string; isVisible: boolean }): Explorer {
updateUserContext({ updateUserContext({
fabricContext: { fabricContext: {
connectionId: params.connectionId, connectionId: params.connectionId,
databaseConnectionInfo: undefined, databaseConnectionInfo: undefined,
isReadOnly: true, isReadOnly: true,
isVisible: params.isVisible ?? true,
}, },
authType: AuthType.ConnectionString, authType: AuthType.ConnectionString,
databaseAccount: { databaseAccount: {