diff --git a/src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx b/src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx index 21b5602ef..a50ec41f5 100644 --- a/src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx +++ b/src/Explorer/Controls/Notebook/NotebookTerminalComponent.tsx @@ -3,7 +3,6 @@ */ import { AuthType } from "../../../AuthType"; -import { useTerminal } from "hooks/useTerminal"; import postRobot from "post-robot"; import * as React from "react"; import * as DataModels from "../../../Contracts/DataModels"; @@ -55,7 +54,6 @@ export class NotebookTerminalComponent extends React.Component): void { this.terminalWindow = (event.target as HTMLIFrameElement).contentWindow; - useTerminal.getState().setTerminal(this.terminalWindow); this.sendPropsToTerminalFrame(); } diff --git a/src/Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent.tsx b/src/Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent.tsx index 3408ccf21..c3eccd12f 100644 --- a/src/Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent.tsx +++ b/src/Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent.tsx @@ -1,3 +1,4 @@ +import { useTerminal } from "hooks/useTerminal"; import React, { useEffect, useRef } from "react"; import { Terminal } from "xterm"; import { FitAddon } from "xterm-addon-fit"; @@ -59,7 +60,14 @@ export const CloudShellTerminalComponent: React.FC { + const socket = await startCloudShellTerminal(terminal, props.shellType); + socketRef.current = socket; + if (socket) { + useTerminal.getState().setSocket(socket); + } + }; + initTerminal(); // Cleanup function to close WebSocket and dispose terminal return () => { @@ -73,6 +81,7 @@ export const CloudShellTerminalComponent: React.FC + ) : ( ); diff --git a/src/Explorer/Tabs/VCoreMongoQuickstartTab.tsx b/src/Explorer/Tabs/VCoreMongoQuickstartTab.tsx index 3956841ac..2bbdb8072 100644 --- a/src/Explorer/Tabs/VCoreMongoQuickstartTab.tsx +++ b/src/Explorer/Tabs/VCoreMongoQuickstartTab.tsx @@ -1,10 +1,8 @@ -import { Spinner, SpinnerSize, Stack, Text } from "@fluentui/react"; +import { Stack } from "@fluentui/react"; -import { NotebookWorkspaceConnectionInfo } from "Contracts/DataModels"; import { MessageTypes } from "Contracts/ExplorerContracts"; -import { NotebookTerminalComponent } from "Explorer/Controls/Notebook/NotebookTerminalComponent"; -import Explorer from "Explorer/Explorer"; -import { useNotebook } from "Explorer/Notebook/useNotebook"; +import { TerminalKind } from "Contracts/ViewModels"; +import { CloudShellTerminalComponent } from "Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent"; import { QuickstartFirewallNotification } from "Explorer/Quickstart/QuickstartFirewallNotification"; import { VcoreMongoQuickstartGuide } from "Explorer/Quickstart/VCoreMongoQuickstartGuide"; import { checkFirewallRules } from "Explorer/Tabs/Shared/CheckFirewallRules"; @@ -12,22 +10,9 @@ import { userContext } from "UserContext"; import React, { useEffect, useState } from "react"; import FirewallRuleScreenshot from "../../../images/vcoreMongoFirewallRule.png"; -interface VCoreMongoQuickstartTabProps { - explorer: Explorer; -} - -export const VcoreMongoQuickstartTab: React.FC = ({ - explorer, -}: VCoreMongoQuickstartTabProps): JSX.Element => { - const notebookServerInfo = useNotebook((state) => state.notebookServerInfo); +export const VcoreMongoQuickstartTab: React.FC = (): JSX.Element => { const [isAllPublicIPAddressEnabled, setIsAllPublicIPAddressEnabled] = useState(true); - const getNotebookServerInfo = (): NotebookWorkspaceConnectionInfo => ({ - authToken: notebookServerInfo.authToken, - notebookServerEndpoint: `${notebookServerInfo.notebookServerEndpoint?.replace(/\/+$/, "")}/mongovcore`, - forwardingId: notebookServerInfo.forwardingId, - }); - useEffect(() => { checkFirewallRules( "2023-03-01-preview", @@ -38,10 +23,6 @@ export const VcoreMongoQuickstartTab: React.FC = ( ); }); - useEffect(() => { - explorer.allocateContainer(); - }, []); - return ( @@ -55,25 +36,14 @@ export const VcoreMongoQuickstartTab: React.FC = ( shellName="MongoDB" /> )} - {isAllPublicIPAddressEnabled && notebookServerInfo?.notebookServerEndpoint && ( - )} - {isAllPublicIPAddressEnabled && !notebookServerInfo?.notebookServerEndpoint && ( - - - Connecting to the Mongo shell. - - - If the cluster was just created, this could take up to a minute. - - - - )} ); diff --git a/src/hooks/useTerminal.ts b/src/hooks/useTerminal.ts index f727d2d79..686bac67d 100644 --- a/src/hooks/useTerminal.ts +++ b/src/hooks/useTerminal.ts @@ -1,26 +1,20 @@ -import postRobot from "post-robot"; import create, { UseStore } from "zustand"; interface TerminalState { - terminalWindow: Window; - setTerminal: (terminalWindow: Window) => void; + socket: WebSocket | undefined; + setSocket: (socket: WebSocket) => void; sendMessage: (message: string) => void; } export const useTerminal: UseStore = create((set, get) => ({ - terminalWindow: undefined, - setTerminal: (terminalWindow: Window) => { - set({ terminalWindow }); + socket: undefined, + setSocket: (socket: WebSocket) => { + set({ socket }); }, sendMessage: (message: string) => { - const terminalWindow = get().terminalWindow; - postRobot.send( - terminalWindow, - "sendMessage", - { type: "stdin", content: [message] }, - { - domain: window.location.origin, - }, - ); + const socket = get().socket; + if (socket && socket.readyState === WebSocket.OPEN) { + socket.send(message + "\r"); + } }, }));