Skip to content
This repository has been archived by the owner on Mar 13, 2024. It is now read-only.

MM-15128 - add support for interactive dialogs with no elements #2726

Merged
merged 12 commits into from
May 29, 2019
Merged

MM-15128 - add support for interactive dialogs with no elements #2726

Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
510e9f4
MM-15128 - add support for interactive dialogs with no elements
Apr 30, 2019
ac768aa
MM-15128 - add check for null elements
May 1, 2019
139aaed
Merge branch 'master' into MM-15128
May 1, 2019
0ccadc2
MM-15128 fix TypeError for null elements, add conditonal modal
May 1, 2019
a8d51bb
delete trailing white space
May 1, 2019
33002f0
Merge branch 'master' of https://github.com/mattermost/mattermost-web…
May 5, 2019
ad0211d
Merge branch 'master' of https://github.com/mattermost/mattermost-web…
May 18, 2019
6539f74
MM-15128 add conditional styling to Modal.header
May 19, 2019
1b45dd7
MM-15128 Add conditional styling in Modal.Header
May 19, 2019
71b0f51
Merge branch 'master' of https://github.com/mattermost/mattermost-web…
May 22, 2019
a4a1a17
MM-15128 add better protection against null and undefined types
May 29, 2019
c4d8519
Merge branch 'master' of https://github.com/mattermost/mattermost-web…
May 29, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 26 additions & 19 deletions components/interactive_dialog/interactive_dialog.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export default class InteractiveDialog extends React.Component {
static propTypes = {
url: PropTypes.string.isRequired,
callbackId: PropTypes.string,
elements: PropTypes.arrayOf(PropTypes.object).isRequired,
elements: PropTypes.arrayOf(PropTypes.object),
title: PropTypes.string.isRequired,
iconUrl: PropTypes.string,
submitLabel: PropTypes.string,
Expand All @@ -33,9 +33,11 @@ export default class InteractiveDialog extends React.Component {
super(props);

const values = {};
props.elements.forEach((e) => {
values[e.name] = e.default || null;
});
if (props.elements != null) {
props.elements.forEach((e) => {
values[e.name] = e.default || null;
});
}

this.state = {
show: true,
Expand All @@ -51,18 +53,20 @@ export default class InteractiveDialog extends React.Component {
const {elements} = this.props;
const values = this.state.values;
const errors = {};
elements.forEach((elem) => {
const error = checkDialogElementForError(elem, values[elem.name]);
if (error) {
errors[elem.name] = (
<FormattedMessage
id={error.id}
defaultMessage={error.defaultMessage}
values={error.values}
/>
);
}
});
if (elements) {
elements.forEach((elem) => {
const error = checkDialogElementForError(elem, values[elem.name]);
if (error) {
errors[elem.name] = (
<FormattedMessage
id={error.id}
defaultMessage={error.defaultMessage}
values={error.values}
/>
);
}
});
}

this.setState({errors});

Expand Down Expand Up @@ -160,15 +164,18 @@ export default class InteractiveDialog extends React.Component {
role='dialog'
aria-labelledby='interactiveDialogModalLabel'
>
<Modal.Header closeButton={true}>
<Modal.Header
closeButton={true}
style={{borderBottom: elements == null && '0px'}}
>
<Modal.Title
componentClass='h1'
id='interactiveDialogModalLabel'
>
{icon}{title}
</Modal.Title>
</Modal.Header>
<Modal.Body>
{elements && <Modal.Body>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

{elements.map((e) => {
return (
<DialogElement
Expand All @@ -190,7 +197,7 @@ export default class InteractiveDialog extends React.Component {
/>
);
})}
</Modal.Body>
</Modal.Body>}
<Modal.Footer>
<button
type='button'
Expand Down