feat(webview): use new connection form, remove old form VSCODE-491

.depcheckrc

@@ -5,7 +5,6 @@ ignores:
  - "@types/jest"
  - "buffer"
  - "eslint-config-mongodb-js"
- - "electron"
  - "mocha-junit-reporter"
  - "mocha-multi"
  - "mongodb-client-encryption"

.github/workflows/actions/test-and-build/action.yaml

@@ -76,7 +76,7 @@ runs:
 
     - name: Build .vsix
       env:
-        NODE_OPTIONS: "--require ./scripts/no-npm-list-fail.js --max_old_space_size=4096"
+        NODE_OPTIONS: "--require ./scripts/no-npm-list-fail.js"
       # NOTE: --githubBranch is "The GitHub branch used to infer relative links in README.md."
       run: |
         npx vsce package --githubBranch main

package.json

@@ -978,13 +978,9 @@
   "dependencies": {
     "@babel/parser": "^7.22.6",
     "@babel/traverse": "^7.23.2",
-    "@fortawesome/fontawesome-svg-core": "^6.4.0",
-    "@fortawesome/free-solid-svg-icons": "^6.4.0",
-    "@fortawesome/react-fontawesome": "^0.2.0",
-    "@iconify-icons/codicon": "^1.2.25",
-    "@iconify/react": "^1.1.4",
     "@mongodb-js/compass-components": "^1.20.0",
     "@mongodb-js/connection-form": "^1.20.4",
+    "@mongodb-js/connection-info": "^0.1.1",
     "@mongodb-js/mongodb-constants": "^0.7.1",
     "@mongosh/browser-runtime-electron": "^2.0.2",
     "@mongosh/i18n": "^2.0.2",
@@ -993,7 +989,6 @@
     "@segment/analytics-node": "^1.1.4",
     "bson": "^6.1.0",
     "bson-transpilers": "^2.0.4",
-    "classnames": "^2.3.2",
     "debug": "^4.3.4",
     "dotenv": "^16.3.1",
     "lodash": "^4.17.21",
@@ -1003,15 +998,12 @@
     "mongodb-cloud-info": "^2.1.0",
     "mongodb-connection-string-url": "^2.6.0",
     "mongodb-data-service": "^22.17.0",
-    "mongodb-data-service-legacy": "npm:[email protected]",
     "mongodb-log-writer": "^1.4.0",
     "mongodb-query-parser": "^3.1.3",
     "mongodb-schema": "^11.2.2",
     "numeral": "^2.0.6",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "react-redux": "^8.1.1",
-    "redux": "^4.2.1",
     "resolve-mongodb-srv": "^1.1.2",
     "ts-log": "^2.2.5",
     "uuid": "^8.3.2",
@@ -1030,7 +1022,6 @@
     "@types/babel__traverse": "^7.20.1",
     "@types/chai": "^4.3.5",
     "@types/debug": "^4.1.8",
-    "@types/enzyme": "^3.10.13",
     "@types/glob": "^7.2.0",
     "@types/jest": "^26.0.24",
     "@types/micromatch": "^4.0.2",
@@ -1056,7 +1047,6 @@
     "css-loader": "^6.8.1",
     "depcheck": "^1.4.3",
     "duplicate-package-checker-webpack-plugin": "^3.0.0",
-    "electron": "^23.3.9",
     "enzyme": "^3.11.0",
     "eslint": "^8.44.0",
     "eslint-config-mongodb-js": "^5.0.3",
@@ -1096,11 +1086,6 @@
     "webpack-merge": "^5.9.0",
     "xvfb-maybe": "^0.2.1"
   },
-  "overrides": {
-    "mongodb-connection-model": {
-      "@mongodb-js/compass-utils": "0.3.4"
-    }
-  },
   "precommit": [
     "check"
   ]

scripts/check-vsix-size.ts

@@ -12,7 +12,7 @@ const vsixFileName = path.resolve(
 );
 const size = fs.statSync(vsixFileName).size;
 
-const maxSize = 8_500_000; // 8.5 MB
+const maxSize = 8_000_000;
 
 if (size >= maxSize) {
   throw new Error(

src/connectionController.ts

@@ -3,28 +3,20 @@ import { connect, createConnectionAttempt } from 'mongodb-data-service';
 import type {
   DataService,
   ConnectionAttempt,
-  ConnectionOptions as ConnectionOptionsFromCurrentDS,
+  ConnectionOptions,
 } from 'mongodb-data-service';
 import ConnectionString from 'mongodb-connection-string-url';
 import { EventEmitter } from 'events';
 import type { MongoClientOptions } from 'mongodb';
 import { v4 as uuidv4 } from 'uuid';
 import { cloneDeep, merge } from 'lodash';
 import { mongoLogId } from 'mongodb-log-writer';
-import type {
-  ConnectionInfo as ConnectionInfoFromLegacyDS,
-  ConnectionOptions as ConnectionOptionsFromLegacyDS,
-} from 'mongodb-data-service-legacy';
-import {
-  extractSecrets,
-  convertConnectionModelToInfo,
-} from 'mongodb-data-service-legacy';
+import { extractSecrets } from '@mongodb-js/connection-info';
 import { adjustConnectionOptionsBeforeConnect } from '@mongodb-js/connection-form';
 
 import { CONNECTION_STATUS } from './views/webview-app/extension-app-message-constants';
 import { createLogger } from './logging';
 import formatError from './utils/formatError';
-import type LegacyConnectionModel from './views/webview-app/legacy/connection-model/legacy-connection-model';
 import type { StorageController } from './storage';
 import type { StatusView } from './views';
 import type TelemetryService from './telemetry/telemetryService';
@@ -74,13 +66,6 @@ type RecursivePartial<T> = {
     : T[P];
 };
 
-export function launderConnectionOptionTypeFromLegacyToCurrent(
-  opts: ConnectionOptionsFromLegacyDS
-): ConnectionOptionsFromCurrentDS {
-  // Ensure that, at most, the types for OIDC mismatch here.
-  return opts as Omit<typeof opts, 'oidc'>;
-}
-
 export default class ConnectionController {
   // This is a map of connection ids to their configurations.
   // These connections can be saved on the session (runtime),
@@ -243,25 +228,19 @@ export default class ConnectionController {
     );
   }
 
-  parseNewConnection(
-    rawConnectionModel: LegacyConnectionModel
-  ): ConnectionInfoFromLegacyDS {
-    return convertConnectionModelToInfo({
-      ...rawConnectionModel,
-      appname: `${packageJSON.name} ${packageJSON.version}`, // Override the default connection appname.
-    });
-  }
-
   async saveNewConnectionAndConnect(
-    originalConnectionInfo: ConnectionInfoFromLegacyDS,
+    connection: {
+      connectionOptions: ConnectionOptions;
+      id: string;
+    },
     connectionType: ConnectionTypes
   ): Promise<ConnectionAttemptResult> {
     const savedConnectionWithoutSecrets =
-      await this._connectionStorage.saveNewConnection(originalConnectionInfo);
+      await this._connectionStorage.saveNewConnection(connection);
 
     this._connections[savedConnectionWithoutSecrets.id] = {
       ...savedConnectionWithoutSecrets,
-      connectionOptions: originalConnectionInfo.connectionOptions, // The connection options with secrets.
+      connectionOptions: connection.connectionOptions, // The connection options with secrets.
     };
 
     log.info(
@@ -325,9 +304,7 @@ export default class ConnectionController {
     let dataService;
     try {
       const connectionOptions = adjustConnectionOptionsBeforeConnect({
-        connectionOptions: launderConnectionOptionTypeFromLegacyToCurrent(
-          connectionInfo.connectionOptions
-        ),
+        connectionOptions: connectionInfo.connectionOptions,
         defaultAppName: packageJSON.name,
         notifyDeviceFlow: undefined,
         preferences: {

src/storage/connectionStorage.ts

@@ -1,13 +1,10 @@
 import * as vscode from 'vscode';
-import type {
-  ConnectionInfo as ConnectionInfoFromLegacyDS,
-  ConnectionOptions as ConnectionOptionsFromLegacyDS,
-} from 'mongodb-data-service-legacy';
 import {
   getConnectionTitle,
   extractSecrets,
   mergeSecrets,
-} from 'mongodb-data-service-legacy';
+} from '@mongodb-js/connection-info';
+import type { ConnectionOptions } from 'mongodb-data-service';
 
 import { createLogger } from '../logging';
 import type StorageController from './storageController';
@@ -26,7 +23,7 @@ export interface StoreConnectionInfo {
   name: string; // Possibly user given name, not unique.
   storageLocation: StorageLocation;
   secretStorageLocation?: SecretStorageLocationType;
-  connectionOptions?: ConnectionOptionsFromLegacyDS;
+  connectionOptions?: ConnectionOptions;
 }
 
 type StoreConnectionInfoWithConnectionOptions = StoreConnectionInfo &
@@ -46,16 +43,19 @@ export class ConnectionStorage {
   }
 
   // Returns the saved connection (without secrets).
-  async saveNewConnection(originalConnectionInfo: ConnectionInfoFromLegacyDS) {
-    const name = getConnectionTitle(originalConnectionInfo);
+  async saveNewConnection(connection: {
+    connectionOptions: ConnectionOptions;
+    id: string;
+  }): Promise<LoadedConnection> {
+    const name = getConnectionTitle(connection);
     const newConnectionInfo = {
-      id: originalConnectionInfo.id,
+      id: connection.id,
       name,
       // To begin we just store it on the session, the storage controller
       // handles changing this based on user preference.
       storageLocation: StorageLocation.NONE,
       secretStorageLocation: SecretStorageLocation.SecretStorage,
-      connectionOptions: originalConnectionInfo.connectionOptions,
+      connectionOptions: connection.connectionOptions,
     };
 
     return await this.saveConnectionWithSecrets(newConnectionInfo);
@@ -147,7 +147,7 @@ export class ConnectionStorage {
   ): Promise<LoadedConnection> {
     // We don't want to store secrets to disc.
     const { connectionInfo: safeConnectionInfo, secrets } = extractSecrets(
-      newStoreConnectionInfoWithSecrets as ConnectionInfoFromLegacyDS
+      newStoreConnectionInfoWithSecrets
     );
     const savedConnectionInfo = await this.saveConnection({
       ...newStoreConnectionInfoWithSecrets,

src/test/suite/connectionController.test.ts

@@ -6,10 +6,8 @@ import { afterEach, beforeEach } from 'mocha';
 import assert from 'assert';
 import * as mongodbDataService from 'mongodb-data-service';
 
-import AUTH_STRATEGY_VALUES from '../../views/webview-app/legacy/connection-model/constants/auth-strategies';
 import ConnectionController, {
   DataServiceEventTypes,
-  launderConnectionOptionTypeFromLegacyToCurrent,
 } from '../../connectionController';
 import formatError from '../../utils/formatError';
 import { StorageController, StorageVariables } from '../../storage';
@@ -18,9 +16,6 @@ import {
   DefaultSavingLocations,
   SecretStorageLocation,
 } from '../../storage/storageController';
-import READ_PREFERENCES from '../../views/webview-app/legacy/connection-model/constants/read-preferences';
-import SSH_TUNNEL_TYPES from '../../views/webview-app/legacy/connection-model/constants/ssh-tunnel-types';
-import SSL_METHODS from '../../views/webview-app/legacy/connection-model/constants/ssl-methods';
 import { StatusView } from '../../views';
 import TelemetryService from '../../telemetry/telemetryService';
 import { ExtensionContextStub } from './stubs';
@@ -762,9 +757,7 @@ suite('Connection Controller Test Suite', function () {
         await sleep(50);
 
         return mongodbDataService.connect({
-          connectionOptions: launderConnectionOptionTypeFromLegacyToCurrent(
-            connectionOptions.connectionOptions
-          ),
+          connectionOptions: connectionOptions.connectionOptions,
         });
       }
     );
@@ -868,39 +861,6 @@ suite('Connection Controller Test Suite', function () {
     );
   });
 
-  test('parseNewConnection converts a connection model to a connection info and overrides a default appname', () => {
-    const connectionInfo = testConnectionController.parseNewConnection({
-      _id: 'c4871b21-92c4-40e2-a2c2-fdd551cff114',
-      isFavorite: false,
-      name: 'Local',
-      isSrvRecord: true,
-      hostname: 'host.u88dd.test.test',
-      port: 27017,
-      hosts: [
-        { host: 'host-shard-00-00.u88dd.test.test', port: 27017 },
-        { host: 'host-shard-00-01.u88dd.test.test', port: 27017 },
-        { host: 'host-shard-00-02.u88dd.test.test', port: 27017 },
-      ],
-      extraOptions: {},
-      readPreference: READ_PREFERENCES.PRIMARY,
-      authStrategy: AUTH_STRATEGY_VALUES.MONGODB,
-      kerberosCanonicalizeHostname: false,
-      sslMethod: SSL_METHODS.SYSTEMCA,
-      sshTunnel: SSH_TUNNEL_TYPES.NONE,
-      sshTunnelPort: 22,
-      mongodbUsername: 'username',
-      mongodbPassword: 'somepassword',
-      mongodbDatabaseName: 'admin',
-    });
-
-    assert.deepStrictEqual(connectionInfo, {
-      id: 'c4871b21-92c4-40e2-a2c2-fdd551cff114',
-      connectionOptions: {
-        connectionString: `mongodb+srv://username:[email protected]/?authSource=admin&readPreference=primary&appname=mongodb-vscode+${version}&ssl=true`,
-      },
-    });
-  });
-
   test('getMongoClientConnectionOptions returns url and options properties', async () => {
     await testConnectionController.addNewConnectionStringAndConnect(
       TEST_DATABASE_URI

src/test/suite/language/mongoDBService.test.ts

@@ -21,7 +21,6 @@ import MongoDBService, {
 } from '../../../language/mongoDBService';
 import { mdbTestExtension } from '../stubbableMdbExtension';
 import { StreamStub } from '../stubs';
-import READ_PREFERENCES from '../../../views/webview-app/legacy/connection-model/constants/read-preferences';
 import DIAGNOSTIC_CODES from '../../../language/diagnosticCodes';
 import { ServerCommands } from '../../../language/serverCommands';
 import LINKS from '../../../utils/links';
@@ -35,7 +34,6 @@ suite('MongoDBService Test Suite', () => {
     connectionId: 'pineapple',
     connectionString: 'mongodb://localhost:27088',
     connectionOptions: {
-      readPreference: READ_PREFERENCES.PRIMARY,
       productDocsLink: LINKS.extensionDocs(),
       productName: 'MongoDB for VS Code',
     },
@@ -2565,7 +2563,7 @@ suite('MongoDBService Test Suite', () => {
     this.timeout(INCREASED_TEST_TIMEOUT);
 
     const mongoClient = new MongoClient(params.connectionString, {
-      readPreference: params.connectionOptions.readPreference,
+      readPreference: 'primary',
     });
     const up = new StreamStub();
     const down = new StreamStub();

src/test/suite/storage/connectionStorage.test.ts

@@ -3,16 +3,12 @@ import * as vscode from 'vscode';
 import { afterEach, beforeEach } from 'mocha';
 import { expect } from 'chai';
 
-import AUTH_STRATEGY_VALUES from '../../../views/webview-app/legacy/connection-model/constants/auth-strategies';
 import { StorageController, StorageVariables } from '../../../storage';
 import {
   StorageLocation,
   DefaultSavingLocations,
   SecretStorageLocation,
 } from '../../../storage/storageController';
-import READ_PREFERENCES from '../../../views/webview-app/legacy/connection-model/constants/read-preferences';
-import SSH_TUNNEL_TYPES from '../../../views/webview-app/legacy/connection-model/constants/ssh-tunnel-types';
-import SSL_METHODS from '../../../views/webview-app/legacy/connection-model/constants/ssl-methods';
 import { ExtensionContextStub } from '../stubs';
 import {
   TEST_DATABASE_URI,
@@ -260,11 +256,11 @@ suite('Connection Storage Test Suite', function () {
         hosts: [{ host: 'localhost', port: 27017 }],
         extraOptions: {},
         connectionType: 'NODE_DRIVER',
-        authStrategy: AUTH_STRATEGY_VALUES.NONE,
-        readPreference: READ_PREFERENCES.PRIMARY,
+        authStrategy: 'NONE',
+        readPreference: 'primary',
         kerberosCanonicalizeHostname: false,
-        sslMethod: SSL_METHODS.NONE,
-        sshTunnel: SSH_TUNNEL_TYPES.NONE,
+        sslMethod: 'NONE',
+        sshTunnel: 'NONE',
         sshTunnelPort: 22,
       },
     };

src/test/suite/views/webview-app/jest-setup.js

@@ -9,9 +9,6 @@ const { TextEncoder, TextDecoder } = require('util');
 chai.use(require('sinon-chai'));
 Enzyme.configure({ adapter: new Adapter() });
 
-// eslint-disable-next-line no-undef
-jest.mock('@iconify-icons/codicon/book', () => {});
-
 // Note applied with js dom so we do manually. (Required by node_modules/mongodb-connection-string-url/node_modules/whatwg-url/lib/encoding.js)
 Object.assign(global, { TextDecoder, TextEncoder });