Merge branch 'main' into 1.29-releases

Author: mcasimir

THIRD-PARTY-NOTICES.md

@@ -1,5 +1,5 @@
 The following third-party software is used by and included in **compass**.
-This document was automatically generated on Tue Oct 26 2021.
+This document was automatically generated on Wed Oct 27 2021.
 
 ## List of dependencies
 

package-lock.json

@@ -36,17 +36,19 @@
   "dependencies": {
     "@leafygreen-ui/badge": "^4.0.4",
     "@leafygreen-ui/banner": "^3.0.8",
-    "@leafygreen-ui/button": "^12.0.3",
+    "@leafygreen-ui/button": "^12.0.5",
     "@leafygreen-ui/card": "^5.1.3",
     "@leafygreen-ui/checkbox": "^6.0.5",
     "@leafygreen-ui/confirmation-modal": "^2.2.1",
     "@leafygreen-ui/icon": "^11.4.0",
     "@leafygreen-ui/icon-button": "^9.1.5",
     "@leafygreen-ui/leafygreen-provider": "^2.1.2",
-    "@leafygreen-ui/logo": "^5.0.0",
+    "@leafygreen-ui/logo": "^6.1.0",
+    "@leafygreen-ui/palette": "^3.2.2",
     "@leafygreen-ui/portal": "^3.1.3",
     "@leafygreen-ui/select": "^3.0.4",
     "@leafygreen-ui/tabs": "^5.1.3",
+    "@leafygreen-ui/text-area": "^4.0.3",
     "@leafygreen-ui/text-input": "^6.0.3",
     "@leafygreen-ui/toggle": "^7.0.4",
     "@leafygreen-ui/tokens": "^0.5.3",

packages/compass-components/package.json

@@ -19,14 +19,20 @@ export { default as Checkbox } from '@leafygreen-ui/checkbox';
 export { default as Icon } from '@leafygreen-ui/icon';
 export { default as IconButton } from '@leafygreen-ui/icon-button';
 export { default as LeafyGreenProvider } from '@leafygreen-ui/leafygreen-provider';
-export { AtlasLogoMark, LogoMark } from '@leafygreen-ui/logo';
+export {
+  AtlasLogoMark,
+  MongoDBLogoMark,
+  MongoDBLogo,
+} from '@leafygreen-ui/logo';
+export { uiColors } from '@leafygreen-ui/palette';
 export { default as Portal } from '@leafygreen-ui/portal';
 export { Select, Option, Size as SelectSize } from '@leafygreen-ui/select';
 export { Tabs, Tab } from '@leafygreen-ui/tabs';
+export { default as TextArea } from '@leafygreen-ui/text-area';
 export { default as TextInput } from '@leafygreen-ui/text-input';
 export { default as Toggle } from '@leafygreen-ui/toggle';
 export { spacing } from '@leafygreen-ui/tokens';
 export { default as Tooltip } from '@leafygreen-ui/tooltip';
-export { H2, Link } from '@leafygreen-ui/typography';
+export { H3, Link, Description, Label } from '@leafygreen-ui/typography';
 
 export { CancelLoader, ConfirmationModal, ResizeHandle, ResizeDirection };

packages/compass-components/src/index.ts

@@ -4,6 +4,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Link } from '@mongodb-js/compass-components';
 import ConnectForm from '@mongodb-js/connect-form';
+import { convertConnectionModelToInfo } from 'mongodb-data-service';
 
 import Actions from '../actions';
 import Sidebar from './sidebar';
@@ -145,13 +146,15 @@ class Connect extends React.Component {
           className={classnames(styles.page, styles.connect)}
         >
           <Sidebar {...this.props} />
-          <div className={classnames(styles['form-container'])}>
+          <div className={styles['form-container']}>
             {showNewConnectForm && <ConnectForm
+              key={this.props.connectionModel._id}
+              initialConnectionInfo={convertConnectionModelToInfo(this.props.connectionModel)}
               onConnectClicked={() => Actions.onConnectClicked()}
             />}
             {!showNewConnectForm && (
               <div
-                className={classnames(styles['connect-container'])}
+                className={styles['connect-container']}
                 onMouseMove={this.handleMouseMove.bind(this)}
               >
                 {this.renderHeader()}

packages/compass-connect/src/components/connect.jsx

@@ -11,21 +11,6 @@
 }
 
 .connect {
-  form {
-    display: block;
-    margin-top: 0em;
-    background-color: white;
-    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.075);
-    padding: 15px 0;
-  }
-
-  label {
-    display: inline-block;
-    max-width: 100%;
-    margin-bottom: 5px;
-    font-weight: bold;
-  }
-
   &-atlas {
     background: @compass-sidebar-atlas-background-color;
     display: flex;
@@ -103,6 +88,21 @@
       min-width: 360px;
       max-width: 800px;
 
+      form {
+        display: block;
+        margin-top: 0em;
+        background-color: white;
+        box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.075);
+        padding: 15px 0;
+      }
+  
+      label {
+        display: inline-block;
+        max-width: 100%;
+        margin-bottom: 5px;
+        font-weight: bold;
+      }
+
       .connect-string {
         margin: 10px;
 

packages/compass-connect/src/components/connect.module.less

@@ -46,7 +46,6 @@ class Toolbar extends React.Component {
    */
   switchDocumentView(view) {
     this.props.viewSwitchHandler(view);
-    this.props.refreshDocuments();
   }
 
   _loadedMessage() {

packages/compass-crud/src/components/toolbar.jsx

@@ -464,7 +464,8 @@ describe('store', function() {
       it('updates the document in the list', (done) => {
         const unsubscribe = store.listen((state) => {
           expect(state.docs[0]).to.not.equal(hadronDoc);
-          expect(state.docs[0].elements.at(2).key === 'new field');
+          expect(state.docs[0]).to.have.property('elements');
+          expect(state.docs[0].elements.at(2).key).to.equal('new field');
           unsubscribe();
           // Ensure we have enough time for update-blocked or update-error to be called.
           setTimeout(() => done(), 100);

packages/compass-crud/src/stores/crud-store.spec.js

@@ -32,4 +32,5 @@ exports.addCommands = function (app) {
   add('setValidation', './set-validation');
   add('waitForAnimations', './wait-for-animations');
   add('setOrClearValue', './set-or-clear-value');
+  add('listenForTelemetryEvents', './listen-for-telemetry-events');
 };

packages/compass-e2e-tests/helpers/commands/index.js

@@ -0,0 +1,29 @@
+module.exports = function (app) {
+  return async function (telemetry) {
+    const existingEventCount = telemetry.events().length;
+    const { client } = app;
+
+    function lookupNewEvent(eventName) {
+      const newEvents = telemetry.events().slice(existingEventCount);
+      return newEvents.find((entry) => entry.event === eventName);
+    }
+
+    return async (eventName) => {
+      await client.waitUntil(
+        async () => {
+          await client.execute(() => {
+            const { ipcRenderer } = require('electron');
+            ipcRenderer.send('compass:usage:flush');
+          });
+          return !!lookupNewEvent(eventName);
+        },
+        { timeout: 20000 }
+      );
+
+      const ev = lookupNewEvent(eventName);
+      const properties = { ...ev.properties };
+      delete properties.compass_version;
+      return properties;
+    };
+  };
+};