Shell: Integrate Cloudshell to existing shells (#2098)

* first draft

* refactored code

* ux fix

* add custom header support and fix ui

* minor changes

* hide last command also

* remove logger

* bug fixes

* updated loick file

* fix tests

* moved files

* update readme

* documentation update

* fix compilationerror

* undefined check handle

* format fix

* format fix

* fix lints

* format fix

* fix unrelatred test

* code refator

* fix format

* ut fix

* cgmanifest

* Revert "cgmanifest"

This reverts commit 2e76a6926ee0d3d4e0510f2e04e03446c2ca8c47.

* fix snap

* test fix

* formatting code

* updated xterm

* include username in command

* cloudshell add exit

* fix test

* format fix

* tets fix

* fix multiple open cloudshell calls

* socket time out after 20 min

* remove unused code

* 120 min

* Addressed comments

src/Explorer/Tabs/ShellAdapters/BaseTerminalComponentAdapter.tsx

@@ -0,0 +1,62 @@
+import { Spinner, SpinnerSize } from "@fluentui/react";
+import { MessageTypes } from "Contracts/ExplorerContracts";
+import { QuickstartFirewallNotification } from "Explorer/Quickstart/QuickstartFirewallNotification";
+import { getShellNameForDisplay } from "Explorer/Tabs/CloudShellTab/Utils/CommonUtils";
+import * as React from "react";
+import FirewallRuleScreenshot from "../../../../images/firewallRule.png";
+import VcoreFirewallRuleScreenshot from "../../../../images/vcoreMongoFirewallRule.png";
+import { ReactAdapter } from "../../../Bindings/ReactBindingHandler";
+import * as DataModels from "../../../Contracts/DataModels";
+import * as ViewModels from "../../../Contracts/ViewModels";
+
+/**
+ * Base terminal component adapter
+ */
+export abstract class BaseTerminalComponentAdapter implements ReactAdapter {
+  // parameters: true: show, false: hide
+  public parameters: ko.Computed<boolean>;
+
+  constructor(
+    protected getDatabaseAccount: () => DataModels.DatabaseAccount,
+    protected getTabId: () => string,
+    protected getUsername: () => string,
+    protected isAllPublicIPAddressesEnabled: ko.Observable<boolean>,
+    protected kind: ViewModels.TerminalKind,
+  ) {}
+
+  public renderComponent(): JSX.Element {
+    if (!this.isAllPublicIPAddressesEnabled()) {
+      return (
+        <QuickstartFirewallNotification
+          messageType={this.getMessageType()}
+          screenshot={
+            this.kind === ViewModels.TerminalKind.Mongo || this.kind === ViewModels.TerminalKind.VCoreMongo
+              ? VcoreFirewallRuleScreenshot
+              : FirewallRuleScreenshot
+          }
+          shellName={getShellNameForDisplay(this.kind)}
+        />
+      );
+    }
+
+    return this.parameters() ? (
+      this.renderTerminalComponent()
+    ) : (
+      <Spinner styles={{ root: { marginTop: 10 } }} size={SpinnerSize.large}></Spinner>
+    );
+  }
+
+  private getMessageType(): MessageTypes {
+    switch (this.kind) {
+      case ViewModels.TerminalKind.Postgres:
+        return MessageTypes.OpenPostgresNetworkingBlade;
+      case ViewModels.TerminalKind.Mongo:
+      case ViewModels.TerminalKind.VCoreMongo:
+        return MessageTypes.OpenVCoreMongoNetworkingBlade;
+      default:
+        return MessageTypes.OpenPostgresNetworkingBlade;
+    }
+  }
+
+  protected abstract renderTerminalComponent(): JSX.Element;
+}

src/Explorer/Tabs/ShellAdapters/CloudShellTerminalComponentAdapter.tsx

@@ -0,0 +1,19 @@
+import { CloudShellTerminalComponent } from "Explorer/Tabs/CloudShellTab/CloudShellTerminalComponent";
+import * as React from "react";
+import { BaseTerminalComponentAdapter } from "./BaseTerminalComponentAdapter";
+
+/**
+ * CloudShell terminal tab
+ */
+export class CloudShellTerminalComponentAdapter extends BaseTerminalComponentAdapter {
+  protected renderTerminalComponent(): JSX.Element {
+    return (
+      <CloudShellTerminalComponent
+        databaseAccount={this.getDatabaseAccount()}
+        tabId={this.getTabId()}
+        shellType={this.kind}
+        username={this.getUsername()}
+      />
+    );
+  }
+}

src/Explorer/Tabs/ShellAdapters/NotebookTerminalComponentAdapter.tsx

@@ -0,0 +1,32 @@
+import { NotebookTerminalComponent } from "Explorer/Controls/Notebook/NotebookTerminalComponent";
+import * as React from "react";
+import * as DataModels from "../../../Contracts/DataModels";
+import * as ViewModels from "../../../Contracts/ViewModels";
+import { BaseTerminalComponentAdapter } from "./BaseTerminalComponentAdapter";
+
+/**
+ * Notebook terminal tab
+ */
+export class NotebookTerminalComponentAdapter extends BaseTerminalComponentAdapter {
+  constructor(
+    private getNotebookServerInfo: () => DataModels.NotebookWorkspaceConnectionInfo,
+    getDatabaseAccount: () => DataModels.DatabaseAccount,
+    getTabId: () => string,
+    getUsername: () => string,
+    isAllPublicIPAddressesEnabled: ko.Observable<boolean>,
+    kind: ViewModels.TerminalKind,
+  ) {
+    super(getDatabaseAccount, getTabId, getUsername, isAllPublicIPAddressesEnabled, kind);
+  }
+
+  protected renderTerminalComponent(): JSX.Element {
+    return (
+      <NotebookTerminalComponent
+        notebookServerInfo={this.getNotebookServerInfo()}
+        databaseAccount={this.getDatabaseAccount()}
+        tabId={this.getTabId()}
+        username={this.getUsername()}
+      />
+    );
+  }
+}