Rename everything HostingSignup -> EMSElementPro

This setup flow ended up quite specific due to all the various moving parts.
pull/21833/head
Jason Robinson 2020-12-15 10:50:38 +02:00
parent 04bd5f648f
commit cd836be809
6 changed files with 36 additions and 51 deletions

View File

@ -14,16 +14,16 @@ See the License for the specific language governing permissions and
limitations under the License. limitations under the License.
*/ */
.mx_HostingSignupDialog .mx_Dialog { .mx_EMSElementProDialog .mx_Dialog {
height: 66%; height: 66%;
min-width: 50%; min-width: 50%;
} }
.mx_HostingSignupBaseDialog { .mx_EMSElementProBaseDialog {
height: 100%; height: 100%;
} }
.mx_HostingSignupDialog_container { .mx_EMSElementProDialog_container {
height: 90%; height: 90%;
iframe { iframe {

View File

@ -15,8 +15,8 @@ limitations under the License.
*/ */
import * as React from "react"; import * as React from "react";
import EMSElementProDialog from "../views/dialogs/EMSElementProDialog";
import Modal from "../../Modal"; import Modal from "../../Modal";
import HostingSignupDialog from "../views/dialogs/HostingSignupDialog";
import { import {
IconizedContextMenuOption, IconizedContextMenuOption,
IconizedContextMenuOptionList, IconizedContextMenuOptionList,
@ -27,15 +27,15 @@ interface IProps {}
interface IState {} interface IState {}
export default class HostingSignupAction extends React.PureComponent<IProps, IState> { export default class EMSElementProAction extends React.PureComponent<IProps, IState> {
closingAllowed = false; closingAllowed = false;
modalRef: any; modalRef: any;
private openDialog = () => { private openDialog = () => {
this.modalRef = Modal.createTrackedDialog( this.modalRef = Modal.createTrackedDialog(
'Hosting Signup Open', '', HostingSignupDialog, { 'Element Pro Open', '', EMSElementProDialog, {
requestClose: this.requestClose, requestClose: this.requestClose,
}, "mx_HostingSignupDialog", false, true, { }, "mx_EMSElementProDialog", false, true, {
onBeforeClose: async () => this.closingAllowed, onBeforeClose: async () => this.closingAllowed,
}, },
); );

View File

@ -51,7 +51,7 @@ import { RightPanelPhases } from "../../stores/RightPanelStorePhases";
import ErrorDialog from "../views/dialogs/ErrorDialog"; import ErrorDialog from "../views/dialogs/ErrorDialog";
import EditCommunityPrototypeDialog from "../views/dialogs/EditCommunityPrototypeDialog"; import EditCommunityPrototypeDialog from "../views/dialogs/EditCommunityPrototypeDialog";
import {UIFeature} from "../../settings/UIFeature"; import {UIFeature} from "../../settings/UIFeature";
import HostingSignupAction from "./HostingSignupAction"; import EMSElementProAction from "./EMSElementProAction";
interface IProps { interface IProps {
isMinimized: boolean; isMinimized: boolean;
@ -274,7 +274,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
let topSection; let topSection;
const signupLink = getHostingLink("user-context-menu"); const signupLink = getHostingLink("user-context-menu");
const hostingSignupOptions = SdkConfig.get().hosting_signup; const elementProConfig = SdkConfig.get().ems_element_pro;
if (MatrixClientPeg.get().isGuest()) { if (MatrixClientPeg.get().isGuest()) {
topSection = ( topSection = (
<div className="mx_UserMenu_contextMenu_header mx_UserMenu_contextMenu_guestPrompts"> <div className="mx_UserMenu_contextMenu_header mx_UserMenu_contextMenu_guestPrompts">
@ -294,36 +294,20 @@ export default class UserMenu extends React.Component<IProps, IState> {
})} })}
</div> </div>
) )
} else if (signupLink || hostingSignupOptions) { } else if (signupLink || elementProConfig) {
let hostingSignupIFrame; let elementProIFrame;
/* if (elementProConfig && elementProConfig.url) {
Config schema: // If ems_element_pro.domains is set to a non-empty array, only show
```
"hosting_signup": {
// URL to load iframe from.
"url": "https://prodiver.tld/setup",
// Accepted Matrix user server names to show iframe action for.
// Subdomains will also match.
"domains": [
"matrix.org",
"domain.tld"
]
}
```
*/
if (hostingSignupOptions && hostingSignupOptions.url) {
// If hosting_signup_domains is set to a non-empty array, only show
// dialog if the user is on the domain or a subdomain. // dialog if the user is on the domain or a subdomain.
const hostingSignupDomains = hostingSignupOptions.domains || []; const elementProDomains = elementProConfig.domains || [];
const mxDomain = MatrixClientPeg.get().getDomain(); const mxDomain = MatrixClientPeg.get().getDomain();
const validDomains = hostingSignupDomains.filter(d => (d === mxDomain || mxDomain.endsWith(`.${d}`))); const validDomains = elementProDomains.filter(d => (d === mxDomain || mxDomain.endsWith(`.${d}`)));
if (!hostingSignupDomains || validDomains.length > 0) { if (!elementProDomains || validDomains.length > 0) {
hostingSignupIFrame = <div elementProIFrame = <div
className="" className=""
onClick={this.onCloseMenu} onClick={this.onCloseMenu}
> >
<HostingSignupAction /> <EMSElementProAction />
</div>; </div>;
} }
} }
@ -346,7 +330,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
)} )}
</div> </div>
} }
{hostingSignupIFrame} {elementProIFrame}
</> </>
); );
} }

View File

@ -26,9 +26,9 @@ interface IProps extends IDialogProps {
interface IState {} interface IState {}
/* /*
* A dialog for confirming closing the Hosting signup setup dialog. * A dialog for confirming closing the Element Pro setup dialog.
*/ */
export default class ConfirmCloseHostingSignupDialog extends React.PureComponent<IProps, IState> { export default class EMSElementProConfirmCloseDialog extends React.PureComponent<IProps, IState> {
public render() { public render() {
return ( return (
<QuestionDialog <QuestionDialog

View File

@ -26,9 +26,9 @@ interface IProps extends IDialogProps {
interface IState {} interface IState {}
/* /*
* A dialog for confirming closing the Hosting signup setup dialog. * A dialog for confirming transfer of data to the Element Pro iframe.
*/ */
export default class HostingSignupAccountDataConfirmDialog extends React.PureComponent<IProps, IState> { export default class EMSElementProDataConfirmDialog extends React.PureComponent<IProps, IState> {
public render() { public render() {
return ( return (
<QuestionDialog <QuestionDialog

View File

@ -16,8 +16,8 @@ limitations under the License.
import * as React from "react"; import * as React from "react";
import BaseDialog from '../../views/dialogs/BaseDialog'; import BaseDialog from '../../views/dialogs/BaseDialog';
import ConfirmCloseHostingSignupDialog from '../../views/dialogs/ConfirmCloseHostingSignupDialog'; import EMSElementProConfirmCloseDialog from './EMSElementProConfirmCloseDialog';
import HostingSignupAccountDataConfirmDialog from '../../views/dialogs/HostingSignupAccountDataConfirmDialog'; import EMSElementProDataConfirmDialog from './EMSElementProDataConfirmDialog';
import Modal from "../../../Modal"; import Modal from "../../../Modal";
import SdkConfig from "../../../SdkConfig"; import SdkConfig from "../../../SdkConfig";
import { _t } from "../../../languageHandler"; import { _t } from "../../../languageHandler";
@ -33,9 +33,9 @@ interface IState {
error: string; error: string;
} }
export default class HostingSignupDialog extends React.PureComponent<IProps, IState> { export default class EMSElementProDialog extends React.PureComponent<IProps, IState> {
iframeRef; iframeRef;
hostingSignupUrl: string; elementProSetupUrl: string;
constructor(props: IProps) { constructor(props: IProps) {
super(props); super(props);
@ -46,17 +46,17 @@ export default class HostingSignupDialog extends React.PureComponent<IProps, ISt
}; };
this.iframeRef = React.createRef(); this.iframeRef = React.createRef();
this.hostingSignupUrl = SdkConfig.get().hosting_signup.url; this.elementProSetupUrl = SdkConfig.get().ems_element_pro.url;
} }
private messageHandler = (message) => { private messageHandler = (message) => {
if (!this.hostingSignupUrl.startsWith(message.origin)) { if (!this.elementProSetupUrl.startsWith(message.origin)) {
return; return;
} }
switch (message.data.action) { switch (message.data.action) {
case 'element_pro_account_details_request': case 'element_pro_account_details_request':
Modal.createDialog( Modal.createDialog(
HostingSignupAccountDataConfirmDialog, EMSElementProDataConfirmDialog,
{ {
onFinished: result => { onFinished: result => {
if (result) { if (result) {
@ -85,7 +85,7 @@ export default class HostingSignupDialog extends React.PureComponent<IProps, ISt
this.props.requestClose(); this.props.requestClose();
} else { } else {
Modal.createDialog( Modal.createDialog(
ConfirmCloseHostingSignupDialog, EMSElementProConfirmCloseDialog,
{ {
onFinished: result => { onFinished: result => {
if (result) { if (result) {
@ -100,7 +100,7 @@ export default class HostingSignupDialog extends React.PureComponent<IProps, ISt
private sendMessage = (message) => { private sendMessage = (message) => {
this.iframeRef.contentWindow.postMessage( this.iframeRef.contentWindow.postMessage(
message, message,
this.hostingSignupUrl, this.elementProSetupUrl,
) )
} }
@ -108,6 +108,7 @@ export default class HostingSignupDialog extends React.PureComponent<IProps, ISt
const openIdToken = await MatrixClientPeg.get().getOpenIdToken(); const openIdToken = await MatrixClientPeg.get().getOpenIdToken();
if (!openIdToken || !openIdToken.access_token) { if (!openIdToken || !openIdToken.access_token) {
this.setState({ this.setState({
completed: true,
error: _t("Failed to connect to your homeserver. Please close this dialog and try again."), error: _t("Failed to connect to your homeserver. Please close this dialog and try again."),
}); });
return; return;
@ -135,15 +136,15 @@ export default class HostingSignupDialog extends React.PureComponent<IProps, ISt
public render(): React.ReactNode { public render(): React.ReactNode {
return ( return (
<BaseDialog <BaseDialog
className="mx_HostingSignupBaseDialog" className="mx_EMSElementProBaseDialog"
onFinished={this.onFinished} onFinished={this.onFinished}
title={_t("Set up your own personal Element host")} title={_t("Set up your own personal Element host")}
hasCancel={true} hasCancel={true}
fixedWidth={false} fixedWidth={false}
> >
<div className="mx_HostingSignupDialog_container"> <div className="mx_EMSElementProDialog_container">
<iframe <iframe
src={this.hostingSignupUrl} src={this.elementProSetupUrl}
ref={ref => this.iframeRef = ref} ref={ref => this.iframeRef = ref}
/> />
{this.state.error && {this.state.error &&