diff --git a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx index 3ee59bd30..2c5009282 100644 --- a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx +++ b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx @@ -23,10 +23,12 @@ import { RightPaneForm, RightPaneFormProps } from "../RightPaneForm/RightPaneFor export interface AddDatabasePaneProps { explorer: Explorer; + buttonElement?: HTMLElement; } export const AddDatabasePanel: FunctionComponent = ({ explorer: container, + buttonElement, }: AddDatabasePaneProps) => { const closeSidePanel = useSidePanel((state) => state.closeSidePanel); let throughput: number; @@ -77,6 +79,7 @@ export const AddDatabasePanel: FunctionComponent = ({ dataExplorerArea: Constants.Areas.ContextualPane, }; TelemetryProcessor.trace(Action.CreateDatabase, ActionModifiers.Open, addDatabasePaneOpenMessage); + buttonElement.focus(); }, []); const onSubmit = () => { diff --git a/src/Explorer/SplashScreen/SplashScreen.tsx b/src/Explorer/SplashScreen/SplashScreen.tsx index b52593707..d13644bd7 100644 --- a/src/Explorer/SplashScreen/SplashScreen.tsx +++ b/src/Explorer/SplashScreen/SplashScreen.tsx @@ -307,16 +307,23 @@ export class SplashScreen extends React.Component { iconSrc: AddDatabaseIcon, title: "New " + getDatabaseName(), description: undefined, - onClick: () => - useSidePanel - .getState() - .openSidePanel("New " + getDatabaseName(), ), + onClick: () => this.openAddDatabasePanel(), }); } return items; } + private openAddDatabasePanel() { + const newDatabaseButton = document.activeElement as HTMLElement; + useSidePanel + .getState() + .openSidePanel( + "New " + getDatabaseName(), + + ); + } + private decorateOpenCollectionActivity({ databaseId, collectionId }: MostRecentActivity.OpenCollectionItem) { return { iconSrc: NotebookIcon,