Merge branch 'develop' into jaywink/hosting-provider-iframe-minimize-wip

src/components/views/elements/PersistedElement.js

@@ -23,6 +23,7 @@ import ResizeObserver from 'resize-observer-polyfill';
 import dis from '../../../dispatcher/dispatcher';
 import MatrixClientContext from "../../../contexts/MatrixClientContext";
 import {MatrixClientPeg} from "../../../MatrixClientPeg";
+import {isNullOrUndefined} from "matrix-js-sdk/src/utils";
 
 // Shamelessly ripped off Modal.js.  There's probably a better way
 // of doing reusable widgets like dialog boxes & menus where we go and
@@ -61,6 +62,9 @@ export default class PersistedElement extends React.Component {
         // Any PersistedElements with the same persistKey will use
         // the same DOM container.
         persistKey: PropTypes.string.isRequired,
+
+        // z-index for the element. Defaults to 9.
+        zIndex: PropTypes.number,
     };
 
     constructor() {
@@ -165,7 +169,7 @@ export default class PersistedElement extends React.Component {
 
         const parentRect = parent.getBoundingClientRect();
         Object.assign(child.style, {
-            zIndex: 9,
+            zIndex: isNullOrUndefined(this.props.zIndex) ? 9 : this.props.zIndex,
             position: 'absolute',
             top: parentRect.top + 'px',
             left: parentRect.left + 'px',

src/components/views/right_panel/BaseCard.tsx

@@ -33,6 +33,7 @@ interface IProps {
     previousPhase?: RightPanelPhases;
     closeLabel?: string;
     onClose?(): void;
+    refireParams?;
 }
 
 interface IGroupProps {
@@ -56,6 +57,7 @@ const BaseCard: React.FC<IProps> = ({
     withoutScrollContainer,
     previousPhase,
     children,
+    refireParams,
 }) => {
     let backButton;
     if (previousPhase) {
@@ -63,6 +65,7 @@ const BaseCard: React.FC<IProps> = ({
             defaultDispatcher.dispatch<SetRightPanelPhasePayload>({
                 action: Action.SetRightPanelPhase,
                 phase: previousPhase,
+                refireParams: refireParams,
             });
         };
         backButton = <AccessibleButton className="mx_BaseCard_back" onClick={onBackClick} title={_t("Back")} />;

src/components/views/right_panel/UserInfo.tsx

@@ -60,6 +60,7 @@ import QuestionDialog from "../dialogs/QuestionDialog";
 import ConfirmUserActionDialog from "../dialogs/ConfirmUserActionDialog";
 import InfoDialog from "../dialogs/InfoDialog";
 import { EventType } from "matrix-js-sdk/src/@types/event";
+import {SetRightPanelPhasePayload} from "../../../dispatcher/payloads/SetRightPanelPhasePayload";
 
 interface IDevice {
     deviceId: string;
@@ -1534,6 +1535,24 @@ const UserInfo: React.FC<Props> = ({
 
     const classes = ["mx_UserInfo"];
 
+    let refireParams;
+    let previousPhase: RightPanelPhases;
+    // We have no previousPhase for when viewing a UserInfo from a Group or without a Room at this time
+    if (room && phase === RightPanelPhases.EncryptionPanel) {
+        previousPhase = RightPanelPhases.RoomMemberInfo;
+        refireParams = {member: member};
+    } else if (room) {
+        previousPhase = RightPanelPhases.RoomMemberList;
+    }
+
+    const onEncryptionPanelClose = () => {
+        dis.dispatch<SetRightPanelPhasePayload>({
+            action: Action.SetRightPanelPhase,
+            phase: previousPhase,
+            refireParams: refireParams,
+        });
+    }
+
     let content;
     switch (phase) {
         case RightPanelPhases.RoomMemberInfo:
@@ -1553,19 +1572,13 @@ const UserInfo: React.FC<Props> = ({
                 <EncryptionPanel
                     {...props as React.ComponentProps<typeof EncryptionPanel>}
                     member={member}
-                    onClose={onClose}
+                    onClose={onEncryptionPanelClose}
                     isRoomEncrypted={isRoomEncrypted}
                 />
             );
             break;
     }
 
-    let previousPhase: RightPanelPhases;
-    // We have no previousPhase for when viewing a UserInfo from a Group or without a Room at this time
-    if (room) {
-        previousPhase = RightPanelPhases.RoomMemberList;
-    }
-
     let closeLabel = undefined;
     if (phase === RightPanelPhases.EncryptionPanel) {
         const verificationRequest = (props as React.ComponentProps<typeof EncryptionPanel>).verificationRequest;
@@ -1581,6 +1594,7 @@ const UserInfo: React.FC<Props> = ({
         onClose={onClose}
         closeLabel={closeLabel}
         previousPhase={previousPhase}
+        refireParams={refireParams}
     >
         { content }
     </BaseCard>;

src/components/views/rooms/Stickerpicker.js

@@ -264,7 +264,7 @@ export default class Stickerpicker extends React.Component {
                             width: this.popoverWidth,
                         }}
                     >
-                    <PersistedElement persistKey={PERSISTED_ELEMENT_KEY} style={{zIndex: STICKERPICKER_Z_INDEX}}>
+                    <PersistedElement persistKey={PERSISTED_ELEMENT_KEY} zIndex={STICKERPICKER_Z_INDEX}>
                         <AppTile
                             app={stickerApp}
                             room={this.props.room}