4e4713c3e2
* feat(invite): be able to call numbers from the invite dialog The major changes: - Remove DialOutDialog, its views, redux hooks, css, and images. Its main functionality has been moved into AddPeopleDialog. - Modify the AppPeopleDialog styling a bit so it is wider. - Add phone numbers to AddPeopleDialog search results. Phone numbers are validated in parallel with the request for people and then appended to the result. The validation includes an ajax to validate the number is recognized as dialable by the server. The trigger for the validation is essentially if the entered input is numbers only. - AddPeopleDialog holds onto the full object representation of an item selected in MultiSelectAutocomplete. This is so selected items can be removed on successful invite, leaving only unsuccessful items. - More granular error handling on invite so individual invitees can be removed from the selected items list. * squash: change load state, new regex for numbers * squash: change strings, auto prepend 1 if no country code, add reminders
88 lines
2.2 KiB
JavaScript
88 lines
2.2 KiB
JavaScript
import PropTypes from 'prop-types';
|
|
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import Button from '@atlaskit/button';
|
|
|
|
import { openDialog } from '../../base/dialog';
|
|
import { translate } from '../../base/i18n';
|
|
import { AddPeopleDialog } from '.';
|
|
|
|
/**
|
|
* The button that provides different invite options.
|
|
*/
|
|
class InviteButton extends Component {
|
|
/**
|
|
* {@code InviteButton}'s property types.
|
|
*
|
|
* @static
|
|
*/
|
|
static propTypes = {
|
|
/**
|
|
* Invoked to open {@code AddPeopleDialog}.
|
|
*/
|
|
dispatch: PropTypes.func,
|
|
|
|
/**
|
|
* Indicates if the "Add to call" feature is available.
|
|
*/
|
|
enableAddPeople: PropTypes.bool,
|
|
|
|
/**
|
|
* Indicates if the "Dial out" feature is available.
|
|
*/
|
|
enableDialOut: PropTypes.bool,
|
|
|
|
/**
|
|
* Invoked to obtain translated strings.
|
|
*/
|
|
t: PropTypes.func
|
|
};
|
|
|
|
/**
|
|
* Initializes a new {@code InviteButton} instance.
|
|
*
|
|
* @param {Object} props - The read-only properties with which the new
|
|
* instance is to be initialized.
|
|
*/
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
// Bind event handler so it is only bound once for every instance.
|
|
this._onClick = this._onClick.bind(this);
|
|
}
|
|
|
|
/**
|
|
* Renders the content of this component.
|
|
*
|
|
* @returns {ReactElement}
|
|
*/
|
|
render() {
|
|
return (
|
|
<div className = 'filmstrip__invite'>
|
|
<div className = 'invite-button-group'>
|
|
<Button
|
|
onClick = { this._onClick }
|
|
shouldFitContainer = { true }>
|
|
{ this.props.t('addPeople.invite') }
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Opens {@code AddPeopleDialog}.
|
|
*
|
|
* @private
|
|
* @returns {void}
|
|
*/
|
|
_onClick() {
|
|
this.props.dispatch(openDialog(AddPeopleDialog, {
|
|
enableAddPeople: this.props.enableAddPeople,
|
|
enableDialOut: this.props.enableDialOut
|
|
}));
|
|
}
|
|
}
|
|
|
|
export default translate(connect()(InviteButton));
|