Rework ServerTypeSelector to only emit changes after initial setup

`ServerTypeSelector` would call its `onChange` prop both at construction
(because it computed the default selected type and consumers might want to know)
as well as on actual user change. This ended up complicating consumer code, as
they want to differentiate between initial state and changes made by the user.

To simplify things, `ServerTypeSelector` now exports a function to compute the
server type from HS URL, which can be useful for setting its initially selected
type. The consumer now provides that type via a prop, and `onChange` is now only
called for actual user changes, simplifying the logic in `Registration` which
uses `ServerTypeSelector`.

In addition, some usages of `customHsUrl` vs. `defaultHsUrl` in `Registration`
are simplified to be `customHsUrl` only (since it already includes a fallback to
the default URL in `MatrixChat`).
This commit is contained in:
J. Ryan Stinnett 2019-02-20 11:23:36 +00:00
parent 9292a46db0
commit b846ac5800
2 changed files with 17 additions and 33 deletions

View file

@ -94,7 +94,7 @@ module.exports = React.createClass({
// If we've been given a session ID, we're resuming
// straight back into UI auth
doingUIAuth: Boolean(this.props.sessionId),
serverType: null,
serverType: ServerType.getTypeFromHsUrl(this.props.customHsUrl),
hsUrl: this.props.customHsUrl,
isUrl: this.props.customIsUrl,
// Phase of the overall registration dialog.
@ -122,7 +122,7 @@ module.exports = React.createClass({
});
},
onServerTypeChange(type, initial) {
onServerTypeChange(type) {
this.setState({
serverType: type,
});
@ -148,15 +148,10 @@ module.exports = React.createClass({
hsUrl: this.props.defaultHsUrl,
isUrl: this.props.defaultIsUrl,
});
// if this is the initial value from the control and we're
// already in the registration phase, don't go back to the
// server details phase (but do if it's actually a change resulting
// from user interaction).
if (!initial || !this.state.phase === PHASE_REGISTRATION) {
this.setState({
phase: PHASE_SERVER_DETAILS,
});
}
// Reset back to server details on type change.
this.setState({
phase: PHASE_SERVER_DETAILS,
});
break;
}
},
@ -389,12 +384,9 @@ module.exports = React.createClass({
// If we're on a different phase, we only show the server type selector,
// which is always shown if we allow custom URLs at all.
if (PHASES_ENABLED && this.state.phase !== PHASE_SERVER_DETAILS) {
// if we've been given a custom HS URL we should actually pass that, so
// that the appropriate section is selected at the start to match the
// homeserver URL we're using
return <div>
<ServerTypeSelector
defaultHsUrl={this.props.customHsUrl || this.props.defaultHsUrl}
selected={this.state.serverType}
onChange={this.onServerTypeChange}
/>
</div>;
@ -436,7 +428,7 @@ module.exports = React.createClass({
return <div>
<ServerTypeSelector
defaultHsUrl={this.props.defaultHsUrl}
selected={this.state.serverType}
onChange={this.onServerTypeChange}
/>
{serverDetails}

View file

@ -56,12 +56,12 @@ export const TYPES = {
},
};
function getDefaultType(defaultHsUrl) {
if (!defaultHsUrl) {
export function getTypeFromHsUrl(hsUrl) {
if (!hsUrl) {
return null;
} else if (defaultHsUrl === TYPES.FREE.hsUrl) {
} else if (hsUrl === TYPES.FREE.hsUrl) {
return FREE;
} else if (new URL(defaultHsUrl).hostname.endsWith('.modular.im')) {
} else if (new URL(hsUrl).hostname.endsWith('.modular.im')) {
// This is an unlikely case to reach, as Modular defaults to hiding the
// server type selector.
return PREMIUM;
@ -72,8 +72,8 @@ function getDefaultType(defaultHsUrl) {
export default class ServerTypeSelector extends React.PureComponent {
static propTypes = {
// The default HS URL as another way to set the initially selected type.
defaultHsUrl: PropTypes.string,
// The default selected type.
selected: PropTypes.string,
// Handler called when the selected type changes.
onChange: PropTypes.func.isRequired,
}
@ -82,20 +82,12 @@ export default class ServerTypeSelector extends React.PureComponent {
super(props);
const {
defaultHsUrl,
onChange,
selected,
} = props;
const type = getDefaultType(defaultHsUrl);
this.state = {
selected: type,
selected,
};
if (onChange) {
// FIXME: Supply a second 'initial' param here to flag that this is
// initialising the value rather than from user interaction
// (which sometimes we'll want to ignore). Must be a better way
// to do this.
onChange(type, true);
}
}
updateSelectedType(type) {