dialogs: close button

This commit is contained in:
muerwre 2018-12-07 18:18:41 +07:00
parent 789a38a1d0
commit 43bbd6f0d5
4 changed files with 46 additions and 11 deletions

View file

@ -9,7 +9,7 @@ import { bindActionCreators } from 'redux';
import { hot } from 'react-hot-loader';
import { Renderer } from '$components/renderer/Renderer';
import { hideRenderer } from '$redux/user/actions';
import { hideRenderer, setDialogActive } from '$redux/user/actions';
import { Cursor } from '$components/Cursor';
import { LeftDialog } from '$containers/LeftDialog';
@ -29,7 +29,7 @@ const Component = (props: Props) => (
<UserPanel />
<EditorPanel />
<Cursor mode={props.mode} sticker={props.sticker} set={props.set} />
<LeftDialog dialog={props.dialog} dialog_active={props.dialog_active} />
<LeftDialog dialog={props.dialog} dialog_active={props.dialog_active} setDialogActive={props.setDialogActive} />
{ props.renderer_active &&
<Renderer onClick={props.hideRenderer} />
@ -50,5 +50,5 @@ const mapStateToProps = ({
set,
});
const mapDispatchToProps = dispatch => bindActionCreators({ hideRenderer }, dispatch);
const mapDispatchToProps = dispatch => bindActionCreators({ hideRenderer, setDialogActive }, dispatch);
export const App = connect(mapStateToProps, mapDispatchToProps)(hot(module)(Component));

View file

@ -4,10 +4,13 @@ import { DIALOGS } from '$constants/dialogs';
import { MapListDialog } from '$components/dialogs/MapListDialog';
import classnames from 'classnames';
import { AppInfoDialog } from '$components/dialogs/AppInfoDialog';
import { Icon } from '$components/panels/Icon';
type Props = {
dialog: String,
dialog_active: Boolean,
setDialogActive: Function,
}
const LEFT_DIALOGS = {
@ -15,10 +18,13 @@ const LEFT_DIALOGS = {
[DIALOGS.APP_INFO]: AppInfoDialog,
};
export const LeftDialog = ({ dialog, dialog_active }: Props) => (
export const LeftDialog = ({ dialog, dialog_active, setDialogActive }: Props) => (
Object.keys(LEFT_DIALOGS).map(item => (
<div className={classnames('dialog', { active: dialog_active && (dialog === item) })} key={item}>
{ dialog && LEFT_DIALOGS[item] && React.createElement(LEFT_DIALOGS[item]) }
<div className="dialog-close-button" onClick={() => setDialogActive(false)}>
<Icon icon="icon-cancel-1" />
</div>
</div>
))
);