random-mirrors/cosmos-explorer
1
0
Fork 0
mirror of https://github.com/Azure/cosmos-explorer.git synced 2025-03-27 12:10:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update PanelContainerComponent.tsx

Browse Source
This commit is contained in:
MokireddySampath 2023-07-26 20:36:12 +05:30 committed by GitHub
parent 19cf52353c
commit 4766b69799
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/Explorer/Panes/PanelContainerComponent.tsx
View File

@ -1,4 +1,5 @@
import { IPanelProps, IRenderFunction, Panel, PanelType } from "@fluentui/react"; import { IPanelProps, IRenderFunction, Panel, PanelType } from "@fluentui/react";
import { useSelectedNode } from "Explorer/useSelectedNode";
import * as React from "react"; import * as React from "react";
import { useNotificationConsole } from "../../hooks/useNotificationConsole"; import { useNotificationConsole } from "../../hooks/useNotificationConsole";
import { useSidePanel } from "../../hooks/useSidePanel"; import { useSidePanel } from "../../hooks/useSidePanel";
@ -58,7 +59,7 @@ export class PanelContainerComponent extends React.Component<PanelContainerProps
onDismiss={this.onDissmiss} onDismiss={this.onDissmiss}
isLightDismiss isLightDismiss
type={PanelType.custom} type={PanelType.custom}
closeButtonAriaLabel="Closes" closeButtonAriaLabel="Close"
customWidth={this.props.panelWidth ? this.props.panelWidth : "440px"} customWidth={this.props.panelWidth ? this.props.panelWidth : "440px"}
headerClassName="panelHeader" headerClassName="panelHeader"
onRenderNavigationContent={this.props.onRenderNavigationContent} onRenderNavigationContent={this.props.onRenderNavigationContent}
@ -77,11 +78,19 @@ export class PanelContainerComponent extends React.Component<PanelContainerProps
} }
private onDissmiss = (ev?: KeyboardEvent | React.SyntheticEvent<HTMLElement>): void => { private onDissmiss = (ev?: KeyboardEvent | React.SyntheticEvent<HTMLElement>): void => {
const targetElementDataTest: string | undefined = useSelectedNode.getState().findSelectedCollection().id();
const targetElement: HTMLElement | null = document.querySelector(`[data-test="${targetElementDataTest}"]`);
if (ev && (ev.target as HTMLElement).id === "notificationConsoleHeader") { if (ev && (ev.target as HTMLElement).id === "notificationConsoleHeader") {
ev.preventDefault(); ev.preventDefault();
} else { } else {
useSidePanel.getState().closeSidePanel(); useSidePanel.getState().closeSidePanel();
} }
if (targetElement) {
const moreButton: HTMLElement | null = targetElement.querySelector('[name="More"]');
if (moreButton) {
moreButton.focus();
}
}
}; };
private getPanelHeight = (): string => { private getPanelHeight = (): string => {