2022-09-29 13:26:34 +03:00
|
|
|
import React, { Component, ComponentType } from 'react';
|
2018-10-29 22:02:23 -07:00
|
|
|
|
2022-10-20 12:11:27 +03:00
|
|
|
import { IReduxState } from '../../../app/types';
|
|
|
|
|
import { IReactionEmojiProps } from '../../../reactions/constants';
|
2021-07-13 09:50:08 +03:00
|
|
|
|
2017-03-06 21:34:51 -06:00
|
|
|
/**
|
2018-10-29 22:02:23 -07:00
|
|
|
* The type of the React {@code Component} props of {@link DialogContainer}.
|
2017-03-06 21:34:51 -06:00
|
|
|
*/
|
2022-10-20 12:11:27 +03:00
|
|
|
interface IProps {
|
2018-10-29 22:02:23 -07:00
|
|
|
|
2017-03-06 21:34:51 -06:00
|
|
|
/**
|
2018-10-29 22:02:23 -07:00
|
|
|
* The component to render.
|
2017-03-06 21:34:51 -06:00
|
|
|
*/
|
2023-04-12 16:58:42 +03:00
|
|
|
_component?: ComponentType<any>;
|
2017-03-06 21:34:51 -06:00
|
|
|
|
2018-10-29 22:02:23 -07:00
|
|
|
/**
|
|
|
|
|
* The props to pass to the component that will be rendered.
|
|
|
|
|
*/
|
2023-04-12 16:58:42 +03:00
|
|
|
_componentProps?: Object;
|
2018-09-03 15:53:24 +02:00
|
|
|
|
2018-10-29 22:02:23 -07:00
|
|
|
/**
|
2022-09-29 13:26:34 +03:00
|
|
|
* Array of reactions to be displayed.
|
2018-10-29 22:02:23 -07:00
|
|
|
*/
|
2022-10-20 12:11:27 +03:00
|
|
|
_reactionsQueue: Array<IReactionEmojiProps>;
|
2021-07-13 09:50:08 +03:00
|
|
|
|
|
|
|
|
/**
|
2022-09-29 13:26:34 +03:00
|
|
|
* True if the UI is in a compact state where we don't show dialogs.
|
2021-07-13 09:50:08 +03:00
|
|
|
*/
|
2022-09-29 13:26:34 +03:00
|
|
|
_reducedUI: boolean;
|
|
|
|
|
}
|
2017-03-06 21:34:51 -06:00
|
|
|
|
2018-10-29 22:02:23 -07:00
|
|
|
/**
|
2018-12-20 20:01:27 -08:00
|
|
|
* Implements a DialogContainer responsible for showing all dialogs.
|
2018-10-29 22:02:23 -07:00
|
|
|
*/
|
2022-10-20 12:11:27 +03:00
|
|
|
export default class AbstractDialogContainer extends Component<IProps> {
|
2017-03-06 21:34:51 -06:00
|
|
|
/**
|
2018-12-20 20:01:27 -08:00
|
|
|
* Returns the dialog to be displayed.
|
2017-03-06 21:34:51 -06:00
|
|
|
*
|
2018-12-20 20:01:27 -08:00
|
|
|
* @private
|
|
|
|
|
* @returns {ReactElement|null}
|
2017-03-06 21:34:51 -06:00
|
|
|
*/
|
2018-12-20 20:01:27 -08:00
|
|
|
_renderDialogContent() {
|
2018-09-03 15:53:24 +02:00
|
|
|
const {
|
|
|
|
|
_component: component,
|
|
|
|
|
_reducedUI: reducedUI
|
|
|
|
|
} = this.props;
|
2017-03-06 21:34:51 -06:00
|
|
|
|
2017-09-18 10:58:03 -05:00
|
|
|
return (
|
2018-09-03 15:53:24 +02:00
|
|
|
component && !reducedUI
|
2017-09-18 10:58:03 -05:00
|
|
|
? React.createElement(component, this.props._componentProps)
|
|
|
|
|
: null);
|
2017-03-06 21:34:51 -06:00
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
2018-12-20 20:01:27 -08:00
|
|
|
* Maps (parts of) the redux state to the associated
|
|
|
|
|
* {@code AbstractDialogContainer}'s props.
|
2017-03-06 21:34:51 -06:00
|
|
|
*
|
2017-09-18 10:58:03 -05:00
|
|
|
* @param {Object} state - The redux state.
|
2017-03-06 21:34:51 -06:00
|
|
|
* @private
|
2022-10-20 12:11:27 +03:00
|
|
|
* @returns {IProps}
|
2017-03-06 21:34:51 -06:00
|
|
|
*/
|
2022-10-20 12:11:27 +03:00
|
|
|
export function abstractMapStateToProps(state: IReduxState) {
|
2017-09-18 10:58:03 -05:00
|
|
|
const stateFeaturesBaseDialog = state['features/base/dialog'];
|
2018-09-03 15:53:24 +02:00
|
|
|
const { reducedUI } = state['features/base/responsive-ui'];
|
2017-09-18 10:58:03 -05:00
|
|
|
|
2017-03-06 21:34:51 -06:00
|
|
|
return {
|
2017-09-18 10:58:03 -05:00
|
|
|
_component: stateFeaturesBaseDialog.component,
|
2018-09-03 15:53:24 +02:00
|
|
|
_componentProps: stateFeaturesBaseDialog.componentProps,
|
|
|
|
|
_reducedUI: reducedUI
|
2017-03-06 21:34:51 -06:00
|
|
|
};
|
|
|
|
|
}
|