Merge tag 'v2.3.1' into AMP.chat

[Full Changelog](matrix-org/matrix-react-sdk@v2.3.0...v2.3.1)
* Fix jitsi popout URL
[\matrix-org#4327](matrix-org#4327)
* Remove underscore from Jitsi conference names
[\matrix-org#4324](matrix-org#4324)
* Fix popout support for jitsi widgets
[\matrix-org#4322](matrix-org#4322)

Change-Id: I7e1aa18ccac13d107d4c72400ee91932c37cbef4

Author: awesome-michael

CHANGELOG.md

@@ -1,3 +1,14 @@
+Changes in [2.3.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.3.1) (2020-04-01)
+===================================================================================================
+[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.3.0...v2.3.1)
+
+ * Fix jitsi popout URL
+   [\#4327](https://github.com/matrix-org/matrix-react-sdk/pull/4327)
+ * Remove underscore from Jitsi conference names
+   [\#4324](https://github.com/matrix-org/matrix-react-sdk/pull/4324)
+ * Fix popout support for jitsi widgets
+   [\#4322](https://github.com/matrix-org/matrix-react-sdk/pull/4322)
+
 Changes in [2.3.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.3.0) (2020-03-30)
 ===================================================================================================
 [Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.3.0-rc.1...v2.3.0)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "matrix-react-sdk",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "description": "SDK for matrix.org using React",
   "author": "matrix.org",
   "repository": {

src/CallHandler.js

@@ -430,7 +430,7 @@ async function _startCallApp(roomId, type) {
         return;
     }
 
-    const confId = `JitsiConference_${generateHumanReadableId()}`;
+    const confId = `JitsiConference${generateHumanReadableId()}`;
     const jitsiDomain = SdkConfig.get()['jitsi']['preferredDomain'];
 
     let widgetUrl = WidgetUtils.getLocalJitsiWrapperUrl();

src/FromWidgetPostMessageApi.js

@@ -24,8 +24,7 @@ import {MatrixClientPeg} from "./MatrixClientPeg";
 import RoomViewStore from "./stores/RoomViewStore";
 import {IntegrationManagers} from "./integrations/IntegrationManagers";
 import SettingsStore from "./settings/SettingsStore";
-import {Capability, KnownWidgetActions} from "./widgets/WidgetApi";
-import SdkConfig from "./SdkConfig";
+import {Capability} from "./widgets/WidgetApi";
 
 const WIDGET_API_VERSION = '0.0.2'; // Current API version
 const SUPPORTED_WIDGET_API_VERSIONS = [
@@ -220,13 +219,6 @@ export default class FromWidgetPostMessageApi {
             }
         } else if (action === 'get_openid') {
             // Handled by caller
-        } else if (action === KnownWidgetActions.GetRiotWebConfig) {
-            if (ActiveWidgetStore.widgetHasCapability(widgetId, Capability.GetRiotWebConfig)) {
-                this.sendResponse(event, {
-                    api: INBOUND_API_NAME,
-                    config: SdkConfig.get(),
-                });
-            }
         } else {
             console.warn('Widget postMessage event unhandled');
             this.sendError(event, {message: 'The postMessage was unhandled'});

src/SdkConfig.ts

@@ -30,8 +30,6 @@ export const DEFAULTS: ConfigOptions = {
     jitsi: {
         // Default conference domain
         preferredDomain: "jitsi.riot.im",
-        // Default Jitsi Meet API location
-        externalApiUrl: "https://jitsi.riot.im/libs/external_api.min.js",
     },
 };
 

src/components/views/elements/AppTile.js

@@ -1,6 +1,6 @@
 /*
 Copyright 2018 New Vector Ltd
-Copyright 2019 The Matrix.org Foundation C.I.C.
+Copyright 2019, 2020 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.
@@ -75,11 +75,7 @@ export default createReactClass({
                 const AppTile = sdk.getComponent('elements.AppTile');
                 return <AppTile
                     key={app.id}
-                    id={app.id}
-                    eventId={app.eventId}
-                    url={app.url}
-                    name={app.name}
-                    type={app.type}
+                    app={app}
                     fullWidth={true}
                     room={persistentWidgetInRoom}
                     userId={MatrixClientPeg.get().credentials.userId}

src/components/views/elements/PersistentApp.js

@@ -160,11 +160,7 @@ export default createReactClass({
 
             return (<AppTile
                 key={app.id}
-                id={app.id}
-                eventId={app.eventId}
-                url={app.url}
-                name={app.name}
-                type={app.type}
+                app={app}
                 fullWidth={arr.length<2 ? true : false}
                 room={this.props.room}
                 userId={this.props.userId}

src/components/views/rooms/AppsDrawer.js

@@ -240,6 +240,14 @@ export default class Stickerpicker extends React.Component {
             // Set default name
             stickerpickerWidget.content.name = stickerpickerWidget.name || _t("Stickerpack");
 
+            // FIXME: could this use the same code as other apps?
+            const stickerApp = {
+                id: stickerpickerWidget.id,
+                url: stickerpickerWidget.content.url,
+                name: stickerpickerWidget.content.name,
+                type: stickerpickerWidget.content.type,
+            };
+
             stickersContent = (
                 <div className='mx_Stickers_content_container'>
                     <div
@@ -253,11 +261,8 @@ export default class Stickerpicker extends React.Component {
                     >
                     <PersistedElement persistKey={PERSISTED_ELEMENT_KEY} style={{zIndex: STICKERPICKER_Z_INDEX}}>
                         <AppTile
-                            id={stickerpickerWidget.id}
-                            url={stickerpickerWidget.content.url}
-                            name={stickerpickerWidget.content.name}
+                            app={stickerApp}
                             room={this.props.room}
-                            type={stickerpickerWidget.content.type}
                             fullWidth={true}
                             userId={MatrixClientPeg.get().credentials.userId}
                             creatorUserId={stickerpickerWidget.sender || MatrixClientPeg.get().credentials.userId}

src/components/views/rooms/Stickerpicker.js

@@ -30,26 +30,6 @@ import ActiveWidgetStore from "../stores/ActiveWidgetStore";
 import {IntegrationManagers} from "../integrations/IntegrationManagers";
 import {Capability} from "../widgets/WidgetApi";
 
-/**
- * Encodes a URI according to a set of template variables. Variables will be
- * passed through encodeURIComponent.
- * @param {string} pathTemplate The path with template variables e.g. '/foo/$bar'.
- * @param {Object} variables The key/value pairs to replace the template
- * variables with. E.g. { '$bar': 'baz' }.
- * @return {string} The result of replacing all template variables e.g. '/foo/baz'.
- */
-function encodeUri(pathTemplate, variables) {
-    for (const key in variables) {
-        if (!variables.hasOwnProperty(key)) {
-            continue;
-        }
-        pathTemplate = pathTemplate.replace(
-            key, encodeURIComponent(variables[key]),
-        );
-    }
-    return pathTemplate;
-}
-
 export default class WidgetUtils {
     /* Returns true if user is able to send state events to modify widgets in this room
      * (Does not apply to non-room-based / user widgets)
@@ -402,18 +382,6 @@ export default class WidgetUtils {
     }
 
     static makeAppConfig(appId, app, senderUserId, roomId, eventId) {
-        const myUserId = MatrixClientPeg.get().credentials.userId;
-        const user = MatrixClientPeg.get().getUser(myUserId);
-        const params = {
-            '$matrix_user_id': myUserId,
-            '$matrix_room_id': roomId,
-            '$matrix_display_name': user ? user.displayName : myUserId,
-            '$matrix_avatar_url': user ? MatrixClientPeg.get().mxcUrlToHttp(user.avatarUrl) : '',
-
-            // TODO: Namespace themes through some standard
-            '$theme': SettingsStore.getValue("theme"),
-        };
-
         if (!senderUserId) {
             throw new Error("Widgets must be created by someone - provide a senderUserId");
         }
@@ -423,32 +391,6 @@ export default class WidgetUtils {
         app.eventId = eventId;
         app.name = app.name || app.type;
 
-        if (app.type === 'jitsi') {
-            console.log("Replacing Jitsi widget URL with local wrapper");
-            if (!app.data || !app.data.conferenceId) {
-                // Assumed to be a v1 widget: add a data object for visibility on the wrapper
-                // TODO: Remove this once mobile supports v2 widgets
-                console.log("Replacing v1 Jitsi widget with v2 equivalent");
-                const parsed = new URL(app.url);
-                app.data = {
-                    conferenceId: parsed.searchParams.get("confId"),
-                    domain: "jitsi.riot.im", // v1 widgets have this hardcoded
-                };
-            }
-
-            app.url = WidgetUtils.getLocalJitsiWrapperUrl({forLocalRender: true});
-        }
-
-        if (app.data) {
-            Object.keys(app.data).forEach((key) => {
-                params['$' + key] = app.data[key];
-            });
-
-            app.waitForIframeLoad = (app.data.waitForIframeLoad === 'false' ? false : true);
-        }
-
-        app.url = encodeUri(app.url, params);
-
         return app;
     }
 
@@ -462,7 +404,6 @@ export default class WidgetUtils {
         // widgets from at all, but it probably makes sense for sanity.
         if (appType === 'jitsi') {
             capWhitelist.push(Capability.AlwaysOnScreen);
-            capWhitelist.push(Capability.GetRiotWebConfig);
         }
 
         return capWhitelist;