Merge remote-tracking branch 'origin/develop' into rav/edited_events

matrix-org · Dec 20, 2022 · ad7c002 · ad7c002
2 parents dc29317 + 910aa0b
commit ad7c002
Show file tree

Hide file tree

Showing 62 changed files with 558 additions and 223 deletions.
diff --git a/.github/workflows/cypress.yaml b/.github/workflows/cypress.yaml
@@ -111,7 +111,7 @@ jobs:
                   path: webapp
 
             - name: Run Cypress tests
-              uses: cypress-io/github-action@v4.2.2
+              uses: cypress-io/github-action@v5.0.2
               with:
                   # The built-in Electron runner seems to grind to a halt trying
                   # to run the tests, so use chrome.

diff --git a/__mocks__/maplibre-gl.js b/__mocks__/maplibre-gl.js
@@ -28,6 +28,7 @@ class MockMap extends EventEmitter {
 }
 const MockMapInstance = new MockMap();
 
+class MockAttributionControl {}
 class MockGeolocateControl extends EventEmitter {
     trigger = jest.fn();
 }
@@ -43,5 +44,5 @@ module.exports = {
     LngLat,
     LngLatBounds,
     NavigationControl,
-    AttributionControl,
+    AttributionControl: MockAttributionControl,
 };
diff --git a/cypress/e2e/crypto/crypto.spec.ts b/cypress/e2e/crypto/crypto.spec.ts
@@ -158,8 +158,8 @@ describe("Cryptography", function () {
         cy.startSynapse("default")
             .as("synapse")
             .then((synapse: SynapseInstance) => {
-                cy.initTestUser(synapse, "Alice");
-                cy.getBot(synapse, { displayName: "Bob", autoAcceptInvites: false }).as("bob");
+                cy.initTestUser(synapse, "Alice", undefined, "alice_");
+                cy.getBot(synapse, { displayName: "Bob", autoAcceptInvites: false, userIdPrefix: "bob_" }).as("bob");
             });
     });
 

diff --git a/cypress/e2e/settings/device-management.spec.ts b/cypress/e2e/settings/device-management.spec.ts
@@ -104,7 +104,7 @@ describe("Device manager", () => {
                 cy.get(".mx_Spinner").should("not.exist");
 
                 // session name updated in details
-                cy.get(".mx_DeviceDetailHeading h3").should("have.text", sessionName);
+                cy.get(".mx_DeviceDetailHeading h4").should("have.text", sessionName);
                 // and main list item
                 cy.get(".mx_DeviceTile h4").should("have.text", sessionName);
 

diff --git a/cypress/support/bot.ts b/cypress/support/bot.ts
@@ -22,6 +22,10 @@ import { Credentials } from "./synapse";
 import Chainable = Cypress.Chainable;
 
 interface CreateBotOpts {
+    /**
+     * A prefix to use for the userid. If unspecified, "bot_" will be used.
+     */
+    userIdPrefix?: string;
     /**
      * Whether the bot should automatically accept all invites.
      */
@@ -41,6 +45,7 @@ interface CreateBotOpts {
 }
 
 const defaultCreateBotOptions = {
+    userIdPrefix: "bot_",
     autoAcceptInvites: true,
     startClient: true,
     bootstrapCrossSigning: true,
@@ -157,7 +162,7 @@ function setupBotClient(
 
 Cypress.Commands.add("getBot", (synapse: SynapseInstance, opts: CreateBotOpts): Chainable<CypressBot> => {
     opts = Object.assign({}, defaultCreateBotOptions, opts);
-    const username = Cypress._.uniqueId("userId_");
+    const username = Cypress._.uniqueId(opts.userIdPrefix);
     const password = Cypress._.uniqueId("password_");
     return cy
         .registerUser(synapse, username, password, opts.displayName)

diff --git a/cypress/support/login.ts b/cypress/support/login.ts
@@ -37,11 +37,14 @@ declare global {
              * @param synapse the synapse returned by startSynapse
              * @param displayName the displayName to give the test user
              * @param prelaunchFn optional function to run before the app is visited
+             * @param userIdPrefix optional prefix to use for the generated user id. If unspecified, `user_` will be
+             *     useed.
              */
             initTestUser(
                 synapse: SynapseInstance,
                 displayName: string,
                 prelaunchFn?: () => void,
+                userIdPrefix?: string,
             ): Chainable<UserCredentials>;
             /**
              * Logs into synapse with the given username/password
@@ -91,7 +94,12 @@ Cypress.Commands.add(
 // eslint-disable-next-line max-len
 Cypress.Commands.add(
     "initTestUser",
-    (synapse: SynapseInstance, displayName: string, prelaunchFn?: () => void): Chainable<UserCredentials> => {
+    (
+        synapse: SynapseInstance,
+        displayName: string,
+        prelaunchFn?: () => void,
+        userIdPrefix = "user_",
+    ): Chainable<UserCredentials> => {
         // XXX: work around Cypress not clearing IDB between tests
         cy.window({ log: false }).then((win) => {
             win.indexedDB.databases()?.then((databases) => {
@@ -101,7 +109,7 @@ Cypress.Commands.add(
             });
         });
 
-        const username = Cypress._.uniqueId("userId_");
+        const username = Cypress._.uniqueId(userIdPrefix);
         const password = Cypress._.uniqueId("password_");
         return cy
             .registerUser(synapse, username, password, displayName)

diff --git a/package.json b/package.json
@@ -89,7 +89,7 @@
         "linkify-string": "4.0.0-beta.4",
         "linkifyjs": "4.0.0-beta.4",
         "lodash": "^4.17.20",
-        "maplibre-gl": "^1.15.2",
+        "maplibre-gl": "^2.0.0",
         "matrix-encrypt-attachment": "^1.0.3",
         "matrix-events-sdk": "0.0.1",
         "matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop",

diff --git a/res/css/components/views/elements/_FilterDropdown.pcss b/res/css/components/views/elements/_FilterDropdown.pcss
@@ -20,24 +20,29 @@ limitations under the License.
         left: unset;
         right: -$spacing-12;
         width: 232px;
+        padding: $spacing-12;
 
         border: 1px solid $quinary-content;
         border-radius: 8px;
         box-shadow: 0px 1px 3px rgba(23, 25, 28, 0.05);
 
+        background-color: $system;
+
         .mx_Dropdown_option_highlight {
-            background-color: $system;
+            background-color: transparent;
         }
     }
 
     .mx_Dropdown_input {
         height: 24px;
-        background-color: $quinary-content;
-        border-color: $quinary-content;
+        background-color: transparent;
+        border-color: transparent;
         color: $secondary-content;
         border-radius: 4px;
 
-        &:focus {
+        &:focus,
+        &:hover {
+            background-color: $quinary-content;
             border-color: $quinary-content;
         }
     }

diff --git a/res/css/components/views/settings/devices/_DeviceDetails.pcss b/res/css/components/views/settings/devices/_DeviceDetails.pcss
@@ -22,18 +22,18 @@ limitations under the License.
     width: 100%;
 
     margin-top: $spacing-16;
-    padding: $spacing-16;
+    padding: $spacing-24;
     border-radius: 8px;
     border: 1px solid $quinary-content;
 }
 
 .mx_DeviceDetails_section {
-    padding-bottom: $spacing-16;
-    margin-bottom: $spacing-16;
+    padding-bottom: $spacing-20;
+    margin-bottom: $spacing-20;
     border-bottom: 1px solid $quinary-content;
 
     display: grid;
-    grid-gap: $spacing-16;
+    grid-gap: $spacing-24;
     justify-content: left;
     grid-template-columns: 100%;
 
@@ -52,6 +52,7 @@ limitations under the License.
         font-size: $font-12px;
         color: $secondary-content;
         line-height: $font-14px;
+        margin-top: $spacing-4;
     }
 }
 

diff --git a/res/css/components/views/settings/devices/_DeviceExpandDetailsButton.pcss b/res/css/components/views/settings/devices/_DeviceExpandDetailsButton.pcss
@@ -23,17 +23,25 @@ limitations under the License.
     color: $secondary-content;
 
     --icon-transform: rotate(-90deg);
+
+    &:hover {
+        background: $quinary-content;
+    }
 }
 
 .mx_DeviceExpandDetailsButton.mx_DeviceExpandDetailsButton_expanded {
     --icon-transform: rotate(0deg);
 
     background: $system;
+
+    &:hover {
+        background: $quinary-content;
+    }
 }
 
 .mx_DeviceExpandDetailsButton_icon {
-    height: 12px;
-    width: 12px;
+    height: 16px;
+    width: 16px;
 
     transition: all 0.3s;
     transform: var(--icon-transform);

diff --git a/res/css/components/views/settings/devices/_DeviceTypeIcon.pcss b/res/css/components/views/settings/devices/_DeviceTypeIcon.pcss
@@ -55,7 +55,7 @@ limitations under the License.
     box-sizing: border-box;
     padding: $spacing-4;
 
-    border: 1px solid $system;
+    border: 1px solid $quinary-content;
     border-radius: 50%;
     background-color: $background;
 

diff --git a/res/css/components/views/settings/shared/_SettingsSubsection.pcss b/res/css/components/views/settings/shared/_SettingsSubsection.pcss
@@ -23,7 +23,7 @@ limitations under the License.
     width: 100%;
     box-sizing: inherit;
     line-height: $font-24px;
-    margin-bottom: $spacing-32;
+    margin-bottom: $spacing-24;
     color: $secondary-content;
 }
 

diff --git a/res/css/structures/_ToastContainer.pcss b/res/css/structures/_ToastContainer.pcss
@@ -77,7 +77,7 @@ limitations under the License.
 
                 &::after {
                     mask-image: url("$(res)/img/e2e/warning.svg");
-                    background-color: $alert;
+                    background-color: $e2e-warning-color;
                 }
             }
 

diff --git a/res/css/views/messages/_common_CryptoEvent.pcss b/res/css/views/messages/_common_CryptoEvent.pcss
@@ -38,7 +38,7 @@ limitations under the License.
 
     &.mx_cryptoEvent_icon_warning::after {
         mask-image: url("$(res)/img/e2e/warning.svg");
-        background-color: $alert;
+        background-color: $e2e-warning-color;
     }
 
     .mx_cryptoEvent_state,

diff --git a/res/css/views/right_panel/_RoomSummaryCard.pcss b/res/css/views/right_panel/_RoomSummaryCard.pcss
@@ -75,14 +75,14 @@ limitations under the License.
             }
 
             .mx_RoomSummaryCard_e2ee_verified {
-                background-color: #0dbd8b;
+                background-color: #$e2e-verified-color;
                 &::before {
                     mask-image: url("$(res)/img/e2e/verified.svg");
                 }
             }
 
             .mx_RoomSummaryCard_e2ee_warning {
-                background-color: #ff5b55;
+                background-color: $e2e-warning-color;
                 &::before {
                     mask-image: url("$(res)/img/e2e/warning.svg");
                 }

diff --git a/res/css/views/rooms/_DecryptionFailureBar.pcss b/res/css/views/rooms/_DecryptionFailureBar.pcss
@@ -29,7 +29,7 @@ limitations under the License.
     width: 24px;
     height: 24px;
     mask-image: url("$(res)/img/e2e/decryption-failure.svg");
-    background-color: $alert;
+    background-color: $e2e-warning-color;
     mask-repeat: no-repeat;
     mask-position: center;
     mask-size: contain;

diff --git a/res/css/views/rooms/_E2EIcon.pcss b/res/css/views/rooms/_E2EIcon.pcss
@@ -66,7 +66,7 @@ limitations under the License.
 
 .mx_E2EIcon_warning::after {
     mask-image: url("$(res)/img/e2e/warning.svg");
-    background-color: $alert;
+    background-color: $e2e-warning-color;
 }
 
 .mx_E2EIcon_normal::after {
@@ -76,5 +76,5 @@ limitations under the License.
 
 .mx_E2EIcon_verified::after {
     mask-image: url("$(res)/img/e2e/verified.svg");
-    background-color: $accent;
+    background-color: $e2e-verified-color;
 }
diff --git a/res/css/views/rooms/_EventTile.pcss b/res/css/views/rooms/_EventTile.pcss
@@ -678,7 +678,7 @@ $left-gutter: 64px;
 
     &.mx_EventTile_e2eIcon_warning::after {
         mask-image: url("$(res)/img/e2e/warning.svg");
-        background-color: $alert;
+        background-color: $e2e-warning-color;
     }
 
     &.mx_EventTile_e2eIcon_normal::after {

diff --git a/res/themes/legacy-light/css/_legacy-light.pcss b/res/themes/legacy-light/css/_legacy-light.pcss
@@ -215,10 +215,10 @@ $event-timestamp-color: #acacac;
 $copy-button-url: "$(res)/img/element-icons/copy.svg";
 
 /* e2e */
-$e2e-verified-color: #76cfa5; /* N.B. *NOT* the same as $accent */
+$e2e-verified-color: #0dbd8b;
 $e2e-unknown-color: #e8bf37;
 $e2e-unverified-color: #e8bf37;
-$e2e-warning-color: #ba6363;
+$e2e-warning-color: #ff5b55;
 $e2e-verified-color-light: rgba($e2e-verified-color, 0.06);
 $e2e-warning-color-light: rgba($e2e-warning-color, 0.06);
 

diff --git a/res/themes/light/css/_light.pcss b/res/themes/light/css/_light.pcss
@@ -183,10 +183,10 @@ $roomtile-default-badge-bg-color: $muted-fg-color;
 
 /* e2e */
 /* ******************** */
-$e2e-verified-color: #76cfa5; /* N.B. *NOT* the same as $accent */
+$e2e-verified-color: #0dbd8b;
 $e2e-unknown-color: #e8bf37;
 $e2e-unverified-color: #e8bf37;
-$e2e-warning-color: #ba6363;
+$e2e-warning-color: #ff5b55;
 $e2e-verified-color-light: rgba($e2e-verified-color, 0.06);
 $e2e-warning-color-light: rgba($e2e-warning-color, 0.06);
 /* ******************** */

diff --git a/src/IConfigOptions.ts b/src/IConfigOptions.ts
@@ -191,8 +191,6 @@ export interface IConfigOptions {
         description: string;
         show_once?: boolean;
     };
-
-    use_rust_crypto_sdk?: boolean;
 }
 
 export interface ISsoRedirectOptions {

diff --git a/src/LegacyCallHandler.tsx b/src/LegacyCallHandler.tsx
@@ -63,6 +63,8 @@ import { OpenInviteDialogPayload } from "./dispatcher/payloads/OpenInviteDialogP
 import { findDMForUser } from "./utils/dm/findDMForUser";
 import { getJoinedNonFunctionalMembers } from "./utils/room/getJoinedNonFunctionalMembers";
 import { localNotificationsAreSilenced } from "./utils/notifications";
+import { SdkContextClass } from "./contexts/SDKContext";
+import { showCantStartACallDialog } from "./voice-broadcast/utils/showCantStartACallDialog";
 
 export const PROTOCOL_PSTN = "m.protocol.pstn";
 export const PROTOCOL_PSTN_PREFIXED = "im.vector.protocol.pstn";
@@ -932,6 +934,15 @@ export default class LegacyCallHandler extends EventEmitter {
     }
 
     public async placeCall(roomId: string, type?: CallType, transferee?: MatrixCall): Promise<void> {
+        // Pause current broadcast, if any
+        SdkContextClass.instance.voiceBroadcastPlaybacksStore.getCurrent()?.pause();
+
+        if (SdkContextClass.instance.voiceBroadcastRecordingsStore.getCurrent()) {
+            // Do not start a call, if recording a broadcast
+            showCantStartACallDialog();
+            return;
+        }
+
         // We might be using managed hybrid widgets
         if (isManagedHybridWidgetEnabled()) {
             await addManagedHybridWidget(roomId);

diff --git a/src/components/views/beacon/BeaconMarker.tsx b/src/components/views/beacon/BeaconMarker.tsx
@@ -15,7 +15,7 @@ limitations under the License.
 */
 
 import React, { ReactNode, useContext } from "react";
-import maplibregl from "maplibre-gl";
+import * as maplibregl from "maplibre-gl";
 import { Beacon, BeaconEvent } from "matrix-js-sdk/src/matrix";
 import { LocationAssetType } from "matrix-js-sdk/src/@types/location";
 

diff --git a/src/components/views/beacon/BeaconViewDialog.tsx b/src/components/views/beacon/BeaconViewDialog.tsx
@@ -17,7 +17,7 @@ limitations under the License.
 import React, { useState, useEffect } from "react";
 import { MatrixClient } from "matrix-js-sdk/src/client";
 import { Beacon, Room } from "matrix-js-sdk/src/matrix";
-import maplibregl from "maplibre-gl";
+import * as maplibregl from "maplibre-gl";
 
 import { Icon as LiveLocationIcon } from "../../../../res/img/location/live-location.svg";
 import { useLiveBeacons } from "../../../utils/beacon/useLiveBeacons";

diff --git a/src/components/views/location/LocationPicker.tsx b/src/components/views/location/LocationPicker.tsx
@@ -137,7 +137,7 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
 
     private addMarkerToMap = () => {
         this.marker = new maplibregl.Marker({
-            element: document.getElementById(this.getMarkerId()),
+            element: document.getElementById(this.getMarkerId()) ?? undefined,
             anchor: "bottom",
             offset: [0, -1],
         })

diff --git a/src/components/views/location/Map.tsx b/src/components/views/location/Map.tsx
@@ -16,7 +16,7 @@ limitations under the License.
 
 import React, { ReactNode, useContext, useEffect } from "react";
 import classNames from "classnames";
-import maplibregl from "maplibre-gl";
+import * as maplibregl from "maplibre-gl";
 import { ClientEvent, IClientWellKnown } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";