Merge branch 'develop' into madlittlemods/translatable-slash-command-errors

Conflicts:
	src/SlashCommands.tsx

Author: MadLittleMods

res/css/_components.scss

@@ -298,6 +298,7 @@
 @import "./views/toasts/_AnalyticsToast.scss";
 @import "./views/toasts/_IncomingCallToast.scss";
 @import "./views/toasts/_NonUrgentEchoFailureToast.scss";
+@import "./views/typography/_Heading.scss";
 @import "./views/verification/_VerificationShowSas.scss";
 @import "./views/voip/CallView/_CallViewButtons.scss";
 @import "./views/voip/_CallContainer.scss";

res/css/views/rooms/_Autocomplete.scss

@@ -22,6 +22,7 @@
 .mx_Autocomplete_Completion_block {
     min-height: 34px;
     display: flex;
+    flex-wrap: wrap;
     padding: 0 12px;
     user-select: none;
     cursor: pointer;
@@ -57,6 +58,7 @@
 
 .mx_Autocomplete_Completion_description {
     color: gray;
+    min-width: 150px;
 }
 
 .mx_Autocomplete_Completion_container_pill {

res/css/views/typography/_Heading.scss

@@ -0,0 +1,39 @@
+/*
+Copyright 2021 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.
+*/
+
+.mx_Heading_h1 {
+    font-size: $font-32px;
+    font-weight: $font-semi-bold;
+    line-height: $font-39px;
+    margin-inline: unset;
+    margin-block: unset;
+}
+
+.mx_Heading_h2 {
+    font-size: $font-24px;
+    font-weight: $font-semi-bold;
+    line-height: $font-29px;
+    margin-inline: unset;
+    margin-block: unset;
+}
+
+.mx_Heading_h3 {
+    font-size: $font-18px;
+    font-weight: $font-semi-bold;
+    line-height: $font-22px;
+    margin-inline: unset;
+    margin-block: unset;
+}

src/BasePlatform.ts

@@ -170,7 +170,36 @@ export default abstract class BasePlatform {
      */
     abstract requestNotificationPermission(): Promise<string>;
 
-    abstract displayNotification(title: string, msg: string, avatarUrl: string, room: Room);
+    public displayNotification(
+        title: string,
+        msg: string,
+        avatarUrl: string,
+        room: Room,
+        ev?: MatrixEvent,
+    ): Notification {
+        const notifBody = {
+            body: msg,
+            silent: true, // we play our own sounds
+        };
+        if (avatarUrl) notifBody['icon'] = avatarUrl;
+        const notification = new window.Notification(title, notifBody);
+
+        notification.onclick = () => {
+            const payload: ActionPayload = {
+                action: Action.ViewRoom,
+                room_id: room.roomId,
+            };
+
+            if (ev.getThread()) {
+                payload.event_id = ev.getId();
+            }
+
+            dis.dispatch(payload);
+            window.focus();
+        };
+
+        return notification;
+    }
 
     loudNotification(ev: MatrixEvent, room: Room) {
     }

src/Notifier.ts

@@ -122,7 +122,7 @@ export const Notifier = {
             avatarUrl = Avatar.avatarUrlForMember(ev.sender, 40, 40, 'crop');
         }
 
-        const notif = plaf.displayNotification(title, msg, avatarUrl, room);
+        const notif = plaf.displayNotification(title, msg, avatarUrl, room, ev);
 
         // if displayNotification returns non-null,  the platform supports
         // clearing notifications later, so keep track of this.
@@ -381,7 +381,7 @@ export const Notifier = {
     _evaluateEvent: function(ev: MatrixEvent) {
         const room = MatrixClientPeg.get().getRoom(ev.getRoomId());
         const actions = MatrixClientPeg.get().getPushActionsForEvent(ev);
-        if (actions && actions.notify) {
+        if (actions?.notify) {
             if (RoomViewStore.getRoomId() === room.roomId &&
                 UserActivity.sharedInstance().userActiveRecently() &&
                 !Modal.hasDialogs()

src/components/structures/AutoHideScrollbar.tsx

@@ -27,7 +27,7 @@ interface IProps extends Omit<HTMLAttributes<HTMLDivElement>, "onScroll"> {
 }
 
 export default class AutoHideScrollbar extends React.Component<IProps> {
-    private containerRef: React.RefObject<HTMLDivElement> = React.createRef();
+    public readonly containerRef: React.RefObject<HTMLDivElement> = React.createRef();
 
     public componentDidMount() {
         if (this.containerRef.current && this.props.onScroll) {

src/components/views/context_menus/RoomContextMenu.tsx

@@ -213,7 +213,7 @@ const RoomContextMenu = ({ room, onFinished, ...props }: IProps) => {
                 });
                 onFinished();
             }}
-            label={_t("Copy link")}
+            label={_t("Copy room link")}
             iconClassName="mx_RoomTile_iconCopyLink"
         />;
     }