Merge branch 'develop' into TimelineCard

Author: luixxiul

.eslintrc.js

@@ -86,6 +86,8 @@ module.exports = {
         "jsx-a11y/no-static-element-interactions": "off",
         "jsx-a11y/role-supports-aria-props": "off",
         "jsx-a11y/tabindex-no-positive": "off",
+
+        "matrix-org/require-copyright-header": "error",
     },
     overrides: [
         {

package.json

@@ -173,7 +173,7 @@
     "eslint-config-google": "^0.14.0",
     "eslint-plugin-import": "^2.25.4",
     "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-matrix-org": "^0.4.0",
+    "eslint-plugin-matrix-org": "^0.5.2",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
     "fs-extra": "^10.0.1",

res/css/_components.scss

@@ -126,7 +126,6 @@
 @import "./views/dialogs/_SpacePreferencesDialog.scss";
 @import "./views/dialogs/_SpaceSettingsDialog.scss";
 @import "./views/dialogs/_SpotlightDialog.scss";
-@import "./views/dialogs/_TabbedIntegrationManagerDialog.scss";
 @import "./views/dialogs/_TermsDialog.scss";
 @import "./views/dialogs/_UntrustedDeviceDialog.scss";
 @import "./views/dialogs/_UploadConfirmDialog.scss";

res/css/views/dialogs/_TabbedIntegrationManagerDialog.scss

@@ -58,7 +58,6 @@ limitations under the License.
         text-overflow: ellipsis;
         white-space: nowrap;
         overflow: hidden;
-        max-width: calc(100% - 1ch);
         text-decoration: none !important; // To override .markdown-body
     }
 }

res/css/views/elements/_Pill.scss

@@ -35,3 +35,10 @@
 .mx_Markdown_STRIKETHROUGH {
     text-decoration: line-through;
 }
+
+.mx_Emoji {
+    // Should be 1.8rem for our default message bodies, and scale with the
+    // surrounding text
+    font-size: max($font-18px, 1em);
+    vertical-align: bottom;
+}

res/css/views/elements/_RichText.scss

@@ -15,7 +15,10 @@ limitations under the License.
 */
 
 .mx_MLocationBody {
+    max-width: 100%;
+
     .mx_MLocationBody_map {
+        max-width: 100%;
         width: 450px;
         height: 300px;
         z-index: 0; // keeps the entire map under the message action bar
@@ -27,15 +30,11 @@ limitations under the License.
 
 /* In the timeline, we fit the width of the container */
 .mx_EventTile_line .mx_MLocationBody .mx_MLocationBody_map {
-    width: 100%;
     max-width: 450px;
+    width: 100%;
 }
 
-.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MLocationBody {
+.mx_EventTile[data-layout="bubble"] .mx_EventTile_line .mx_MLocationBody .mx_MLocationBody_map {
     max-width: 100%;
-
-    .mx_MLocationBody_map {
-        max-width: 100%;
-        width: 450px;
-    }
+    width: 450px;
 }

res/css/views/messages/_MLocationBody.scss

@@ -704,7 +704,7 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss
 
 .mx_MessagePanel_narrow .mx_ThreadSummary {
     min-width: initial;
-    max-width: initial;
+    max-width: 100%; // prevent overflow
     width: initial;
 }
 

res/css/views/rooms/_EventTile.scss

@@ -25,30 +25,31 @@ limitations under the License.
 
     .mx_ReplyPreview_section {
         border-bottom: 1px solid $primary-hairline-color;
+        display: flex;
+        flex-flow: column;
+        row-gap: $spacing-8;
+        padding: $spacing-8 $spacing-8 0 $spacing-8;
 
         .mx_ReplyPreview_header {
-            margin: 8px;
+            display: flex;
+            justify-content: space-between;
+            column-gap: 8px;
+
             color: $primary-content;
             font-weight: 400;
             opacity: 0.4;
-        }
-
-        .mx_ReplyPreview_tile {
-            margin: 0 8px;
-        }
-
-        .mx_ReplyPreview_title {
-            float: left;
-        }
-
-        .mx_ReplyPreview_cancel {
-            float: right;
-            cursor: pointer;
-            display: flex;
-        }
 
-        .mx_ReplyPreview_clear {
-            clear: both;
+            .mx_ReplyPreview_header_cancel {
+                background-color: $primary-content;
+                mask: url('$(res)/img/cancel.svg');
+                mask-repeat: no-repeat;
+                mask-position: center;
+                mask-size: 18px;
+                width: 18px;
+                height: 18px;
+                min-width: 18px;
+                min-height: 18px;
+            }
         }
     }
 }

res/css/views/rooms/_ReplyPreview.scss

@@ -1,3 +1,19 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
 import React from "react";
 import ReactDom from "react-dom";
 

src/NodeAnimator.tsx

@@ -408,10 +408,6 @@ export const Notifier = {
                 // don't bother notifying as user was recently active in this room
                 return;
             }
-            if (SettingsStore.getValue("doNotDisturb")) {
-                // Don't bother the user if they didn't ask to be bothered
-                return;
-            }
 
             if (this.isEnabled()) {
                 this._displayPopupNotification(ev, room);

src/Notifier.ts

@@ -129,7 +129,6 @@ import { DoAfterSyncPreparedPayload } from '../../dispatcher/payloads/DoAfterSyn
 import { ViewStartChatOrReusePayload } from '../../dispatcher/payloads/ViewStartChatOrReusePayload';
 import { IConfigOptions } from "../../IConfigOptions";
 import { SnakedObject } from "../../utils/SnakedObject";
-import InfoDialog from '../views/dialogs/InfoDialog';
 import { leaveRoomBehaviour } from "../../utils/leave-behaviour";
 import VideoChannelStore from "../../stores/VideoChannelStore";
 
@@ -1412,36 +1411,6 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
                 showNotificationsToast(false);
             }
 
-            if (!localStorage.getItem("mx_seen_feature_thread_experimental")) {
-                setTimeout(() => {
-                    if (SettingsStore.getValue("feature_thread") && SdkConfig.get("show_labs_settings")) {
-                        Modal.createDialog(InfoDialog, {
-                            title: _t("Threads Approaching Beta 🎉"),
-                            description: <>
-                                <p>
-                                    { _t("We're getting closer to releasing a public Beta for Threads.") }
-                                </p>
-                                <p>
-                                    { _t("As we prepare for it, we need to make some changes: threads created "
-                                       + "before this point will be <strong>displayed as regular replies</strong>.",
-                                    {}, {
-                                        "strong": sub => <strong>{ sub }</strong>,
-                                    }) }
-                                </p>
-                                <p>
-                                    { _t("This will be a one-off transition, as threads are now part "
-                                       + "of the Matrix specification.") }
-                                </p>
-                            </>,
-                            button: _t("Got it"),
-                            onFinished: () => {
-                                localStorage.setItem("mx_seen_feature_thread_experimental", "true");
-                            },
-                        });
-                    }
-                }, 1 * 60 * 1000); // show after 1 minute to not overload user on launch
-            }
-
             if (!localStorage.getItem("mx_seen_feature_spotlight_toast")) {
                 setTimeout(() => {
                     // Skip the toast if the beta is already enabled or the user has changed the setting from default

src/components/structures/MatrixChat.tsx

@@ -23,6 +23,7 @@ import { MatrixEvent } from 'matrix-js-sdk/src/models/event';
 import { Relations } from "matrix-js-sdk/src/models/relations";
 import { logger } from 'matrix-js-sdk/src/logger';
 import { RoomStateEvent } from "matrix-js-sdk/src/models/room-state";
+import { ReceiptType } from "matrix-js-sdk/src/@types/read_receipts";
 import { M_BEACON_INFO } from 'matrix-js-sdk/src/@types/beacon';
 
 import shouldHideEvent from '../../shouldHideEvent';
@@ -847,7 +848,7 @@ export default class MessagePanel extends React.Component<IProps, IState> {
         }
         const receipts: IReadReceiptProps[] = [];
         room.getReceiptsForEvent(event).forEach((r) => {
-            if (!r.userId || r.type !== "m.read" || r.userId === myUserId) {
+            if (!r.userId || ![ReceiptType.Read, ReceiptType.ReadPrivate].includes(r.type) || r.userId === myUserId) {
                 return; // ignore non-read receipts and receipts from self.
             }
             if (MatrixClientPeg.get().isUserIgnored(r.userId)) {

src/components/structures/MessagePanel.tsx

@@ -17,14 +17,13 @@ limitations under the License.
 import React, { createRef, CSSProperties, ReactNode, KeyboardEvent } from "react";
 import { logger } from "matrix-js-sdk/src/logger";
 
+import SettingsStore from '../../settings/SettingsStore';
 import Timer from '../../utils/Timer';
 import AutoHideScrollbar from "./AutoHideScrollbar";
 import { getKeyBindingsManager } from "../../KeyBindingsManager";
 import ResizeNotifier from "../../utils/ResizeNotifier";
 import { KeyBindingAction } from "../../accessibility/KeyboardShortcuts";
 
-const DEBUG_SCROLL = false;
-
 // The amount of extra scroll distance to allow prior to unfilling.
 // See getExcessHeight.
 const UNPAGINATION_PADDING = 6000;
@@ -36,13 +35,11 @@ const UNFILL_REQUEST_DEBOUNCE_MS = 200;
 // much while the content loads.
 const PAGE_SIZE = 400;
 
-let debuglog;
-if (DEBUG_SCROLL) {
-    // using bind means that we get to keep useful line numbers in the console
-    debuglog = logger.log.bind(console, "ScrollPanel debuglog:");
-} else {
-    debuglog = function() {};
-}
+const debuglog = (...args: any[]) => {
+    if (SettingsStore.getValue("debug_scroll_panel")) {
+        logger.log.call(console, "ScrollPanel debuglog:", ...args);
+    }
+};
 
 interface IProps {
     /* stickyBottom: if set to true, then once the user hits the bottom of

src/components/structures/ScrollPanel.tsx

@@ -28,6 +28,7 @@ import { debounce } from 'lodash';
 import { logger } from "matrix-js-sdk/src/logger";
 import { ClientEvent } from "matrix-js-sdk/src/client";
 import { Thread } from 'matrix-js-sdk/src/models/thread';
+import { ReceiptType } from "matrix-js-sdk/src/@types/read_receipts";
 
 import SettingsStore from "../../settings/SettingsStore";
 import { Layout } from "../../settings/enums/Layout";
@@ -61,13 +62,11 @@ const READ_RECEIPT_INTERVAL_MS = 500;
 
 const READ_MARKER_DEBOUNCE_MS = 100;
 
-const DEBUG = false;
-
-let debuglog = function(...s: any[]) {};
-if (DEBUG) {
-    // using bind means that we get to keep useful line numbers in the console
-    debuglog = logger.log.bind(console, "TimelinePanel debuglog:");
-}
+const debuglog = (...args: any[]) => {
+    if (SettingsStore.getValue("debug_timeline_panel")) {
+        logger.log.call(console, "TimelinePanel debuglog:", ...args);
+    }
+};
 
 interface IProps {
     // The js-sdk EventTimelineSet object for the timeline sequence we are
@@ -864,14 +863,14 @@ class TimelinePanel extends React.Component<IProps, IState> {
             MatrixClientPeg.get().setRoomReadMarkers(
                 roomId,
                 this.state.readMarkerEventId,
-                lastReadEvent, // Could be null, in which case no RR is sent
-                { hidden: hiddenRR },
+                hiddenRR ? null : lastReadEvent, // Could be null, in which case no RR is sent
+                lastReadEvent, // Could be null, in which case no private RR is sent
             ).catch((e) => {
                 // /read_markers API is not implemented on this HS, fallback to just RR
                 if (e.errcode === 'M_UNRECOGNIZED' && lastReadEvent) {
                     return MatrixClientPeg.get().sendReadReceipt(
                         lastReadEvent,
-                        {},
+                        hiddenRR ? ReceiptType.ReadPrivate : ReceiptType.Read,
                     ).catch((e) => {
                         logger.error(e);
                         this.lastRRSentEventId = undefined;