parent
3adbda791c
commit
51bdf67cf2
|
@ -27,6 +27,7 @@ const useStyles = makeStyles()(theme => {
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
alignItems: 'flex-start',
|
alignItems: 'flex-start',
|
||||||
|
zIndex: 301,
|
||||||
animation: `${keyframes`
|
animation: `${keyframes`
|
||||||
0% {
|
0% {
|
||||||
opacity: 0.4;
|
opacity: 0.4;
|
||||||
|
|
|
@ -3,6 +3,10 @@ import React, { Component, ComponentType } from 'react';
|
||||||
|
|
||||||
import { IReduxState } from '../../../../app/types';
|
import { IReduxState } from '../../../../app/types';
|
||||||
import { IReactionEmojiProps } from '../../../../reactions/constants';
|
import { IReactionEmojiProps } from '../../../../reactions/constants';
|
||||||
|
// eslint-disable-next-line lines-around-comment
|
||||||
|
// @ts-ignore
|
||||||
|
import { JitsiPortal } from '../../../../toolbox/components/web';
|
||||||
|
import { showOverflowDrawer } from '../../../../toolbox/functions.web';
|
||||||
import { connect } from '../../../redux/functions';
|
import { connect } from '../../../redux/functions';
|
||||||
|
|
||||||
import DialogTransition from './DialogTransition';
|
import DialogTransition from './DialogTransition';
|
||||||
|
@ -24,6 +28,11 @@ interface IProps {
|
||||||
*/
|
*/
|
||||||
_isNewDialog: boolean;
|
_isNewDialog: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Whether the overflow drawer should be used.
|
||||||
|
*/
|
||||||
|
_overflowDrawer: boolean;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Array of reactions to be displayed.
|
* Array of reactions to be displayed.
|
||||||
*/
|
*/
|
||||||
|
@ -69,7 +78,9 @@ class DialogContainer extends Component<IProps> {
|
||||||
render() {
|
render() {
|
||||||
return this.props._isNewDialog ? (
|
return this.props._isNewDialog ? (
|
||||||
<DialogTransition>
|
<DialogTransition>
|
||||||
{this._renderDialogContent()}
|
{this.props._overflowDrawer
|
||||||
|
? <JitsiPortal>{this._renderDialogContent()}</JitsiPortal>
|
||||||
|
: this._renderDialogContent() }
|
||||||
</DialogTransition>
|
</DialogTransition>
|
||||||
) : (
|
) : (
|
||||||
<ModalTransition>
|
<ModalTransition>
|
||||||
|
@ -90,11 +101,13 @@ class DialogContainer extends Component<IProps> {
|
||||||
function mapStateToProps(state: IReduxState) {
|
function mapStateToProps(state: IReduxState) {
|
||||||
const stateFeaturesBaseDialog = state['features/base/dialog'];
|
const stateFeaturesBaseDialog = state['features/base/dialog'];
|
||||||
const { reducedUI } = state['features/base/responsive-ui'];
|
const { reducedUI } = state['features/base/responsive-ui'];
|
||||||
|
const overflowDrawer = showOverflowDrawer(state);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
_component: stateFeaturesBaseDialog.component,
|
_component: stateFeaturesBaseDialog.component,
|
||||||
_componentProps: stateFeaturesBaseDialog.componentProps,
|
_componentProps: stateFeaturesBaseDialog.componentProps,
|
||||||
_isNewDialog: stateFeaturesBaseDialog.isNewDialog,
|
_isNewDialog: stateFeaturesBaseDialog.isNewDialog,
|
||||||
|
_overflowDrawer: overflowDrawer,
|
||||||
_reducedUI: reducedUI
|
_reducedUI: reducedUI
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue