mirror of https://github.com/vector-im/riot-web
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`).pull/21833/head
parent
9292a46db0
commit
b846ac5800
|
@ -94,7 +94,7 @@ module.exports = React.createClass({
|
||||||
// If we've been given a session ID, we're resuming
|
// If we've been given a session ID, we're resuming
|
||||||
// straight back into UI auth
|
// straight back into UI auth
|
||||||
doingUIAuth: Boolean(this.props.sessionId),
|
doingUIAuth: Boolean(this.props.sessionId),
|
||||||
serverType: null,
|
serverType: ServerType.getTypeFromHsUrl(this.props.customHsUrl),
|
||||||
hsUrl: this.props.customHsUrl,
|
hsUrl: this.props.customHsUrl,
|
||||||
isUrl: this.props.customIsUrl,
|
isUrl: this.props.customIsUrl,
|
||||||
// Phase of the overall registration dialog.
|
// Phase of the overall registration dialog.
|
||||||
|
@ -122,7 +122,7 @@ module.exports = React.createClass({
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
onServerTypeChange(type, initial) {
|
onServerTypeChange(type) {
|
||||||
this.setState({
|
this.setState({
|
||||||
serverType: type,
|
serverType: type,
|
||||||
});
|
});
|
||||||
|
@ -148,15 +148,10 @@ module.exports = React.createClass({
|
||||||
hsUrl: this.props.defaultHsUrl,
|
hsUrl: this.props.defaultHsUrl,
|
||||||
isUrl: this.props.defaultIsUrl,
|
isUrl: this.props.defaultIsUrl,
|
||||||
});
|
});
|
||||||
// if this is the initial value from the control and we're
|
// Reset back to server details on type change.
|
||||||
// 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({
|
this.setState({
|
||||||
phase: PHASE_SERVER_DETAILS,
|
phase: PHASE_SERVER_DETAILS,
|
||||||
});
|
});
|
||||||
}
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -389,12 +384,9 @@ module.exports = React.createClass({
|
||||||
// If we're on a different phase, we only show the server type selector,
|
// 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.
|
// which is always shown if we allow custom URLs at all.
|
||||||
if (PHASES_ENABLED && this.state.phase !== PHASE_SERVER_DETAILS) {
|
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>
|
return <div>
|
||||||
<ServerTypeSelector
|
<ServerTypeSelector
|
||||||
defaultHsUrl={this.props.customHsUrl || this.props.defaultHsUrl}
|
selected={this.state.serverType}
|
||||||
onChange={this.onServerTypeChange}
|
onChange={this.onServerTypeChange}
|
||||||
/>
|
/>
|
||||||
</div>;
|
</div>;
|
||||||
|
@ -436,7 +428,7 @@ module.exports = React.createClass({
|
||||||
|
|
||||||
return <div>
|
return <div>
|
||||||
<ServerTypeSelector
|
<ServerTypeSelector
|
||||||
defaultHsUrl={this.props.defaultHsUrl}
|
selected={this.state.serverType}
|
||||||
onChange={this.onServerTypeChange}
|
onChange={this.onServerTypeChange}
|
||||||
/>
|
/>
|
||||||
{serverDetails}
|
{serverDetails}
|
||||||
|
|
|
@ -56,12 +56,12 @@ export const TYPES = {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
function getDefaultType(defaultHsUrl) {
|
export function getTypeFromHsUrl(hsUrl) {
|
||||||
if (!defaultHsUrl) {
|
if (!hsUrl) {
|
||||||
return null;
|
return null;
|
||||||
} else if (defaultHsUrl === TYPES.FREE.hsUrl) {
|
} else if (hsUrl === TYPES.FREE.hsUrl) {
|
||||||
return FREE;
|
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
|
// This is an unlikely case to reach, as Modular defaults to hiding the
|
||||||
// server type selector.
|
// server type selector.
|
||||||
return PREMIUM;
|
return PREMIUM;
|
||||||
|
@ -72,8 +72,8 @@ function getDefaultType(defaultHsUrl) {
|
||||||
|
|
||||||
export default class ServerTypeSelector extends React.PureComponent {
|
export default class ServerTypeSelector extends React.PureComponent {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
// The default HS URL as another way to set the initially selected type.
|
// The default selected type.
|
||||||
defaultHsUrl: PropTypes.string,
|
selected: PropTypes.string,
|
||||||
// Handler called when the selected type changes.
|
// Handler called when the selected type changes.
|
||||||
onChange: PropTypes.func.isRequired,
|
onChange: PropTypes.func.isRequired,
|
||||||
}
|
}
|
||||||
|
@ -82,20 +82,12 @@ export default class ServerTypeSelector extends React.PureComponent {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
const {
|
const {
|
||||||
defaultHsUrl,
|
selected,
|
||||||
onChange,
|
|
||||||
} = props;
|
} = props;
|
||||||
const type = getDefaultType(defaultHsUrl);
|
|
||||||
this.state = {
|
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) {
|
updateSelectedType(type) {
|
||||||
|
|
Loading…
Reference in New Issue