Merge pull request #4555 from matrix-org/travis/sso-xsigning

Add copy to SSO prompts during cross-signing setup

src/async-components/views/dialogs/secretstorage/CreateSecretStorageDialog.js

@@ -25,6 +25,7 @@ import { _t } from '../../../../languageHandler';
 import Modal from '../../../../Modal';
 import { promptForBackupPassphrase } from '../../../../CrossSigningManager';
 import {copyNode} from "../../../../utils/strings";
+import {SSOAuthEntry} from "../../../../components/views/auth/InteractiveAuthEntryComponents";
 
 const PHASE_LOADING = 0;
 const PHASE_LOADERROR = 1;
@@ -209,12 +210,32 @@ export default class CreateSecretStorageDialog extends React.PureComponent {
             });
         } else {
             const InteractiveAuthDialog = sdk.getComponent("dialogs.InteractiveAuthDialog");
+
+            const dialogAesthetics = {
+                [SSOAuthEntry.PHASE_PREAUTH]: {
+                    title: _t("Use Single Sign On to continue"),
+                    body: _t("To continue, use Single Sign On to prove your identity."),
+                    continueText: _t("Single Sign On"),
+                    continueKind: "primary",
+                },
+                [SSOAuthEntry.PHASE_POSTAUTH]: {
+                    title: _t("Confirm encryption setup"),
+                    body: _t("Click the button below to confirm setting up encryption."),
+                    continueText: _t("Confirm"),
+                    continueKind: "primary",
+                },
+            };
+
             const { finished } = Modal.createTrackedDialog(
                 'Cross-signing keys dialog', '', InteractiveAuthDialog,
                 {
                     title: _t("Setting up keys"),
                     matrixClient: MatrixClientPeg.get(),
                     makeRequest,
+                    aestheticsForStagePhases: {
+                        [SSOAuthEntry.LOGIN_TYPE]: dialogAesthetics,
+                        [SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: dialogAesthetics,
+                    },
                 },
             );
             const [confirmed] = await finished;

src/components/views/dialogs/InteractiveAuthDialog.js

@@ -25,6 +25,7 @@ import { _t } from '../../../languageHandler';
 
 import AccessibleButton from '../elements/AccessibleButton';
 import {ERROR_USER_CANCELLED} from "../../structures/InteractiveAuth";
+import {SSOAuthEntry} from "../auth/InteractiveAuthEntryComponents";
 
 export default createReactClass({
     displayName: 'InteractiveAuthDialog',
@@ -66,6 +67,8 @@ export default createReactClass({
         //         }
         //     }
         // }
+        //
+        // Default is defined in _getDefaultDialogAesthetics()
         aestheticsForStagePhases: PropTypes.object,
     },
 
@@ -79,6 +82,28 @@ export default createReactClass({
         };
     },
 
+    _getDefaultDialogAesthetics: function() {
+        const ssoAesthetics = {
+            [SSOAuthEntry.PHASE_PREAUTH]: {
+                title: _t("Use Single Sign On to continue"),
+                body: _t("To continue, use Single Sign On to prove your identity."),
+                continueText: _t("Single Sign On"),
+                continueKind: "primary",
+            },
+            [SSOAuthEntry.PHASE_POSTAUTH]: {
+                title: _t("Confirm to continue"),
+                body: _t("Click the button below to confirm your identity."),
+                continueText: _t("Confirm"),
+                continueKind: "primary",
+            },
+        };
+
+        return {
+            [SSOAuthEntry.LOGIN_TYPE]: ssoAesthetics,
+            [SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: ssoAesthetics,
+        };
+    },
+
     _onAuthFinished: function(success, result) {
         if (success) {
             this.props.onFinished(true, result);
@@ -113,9 +138,10 @@ export default createReactClass({
         let body = this.state.authError ? null : this.props.body;
         let continueText = null;
         let continueKind = null;
-        if (!this.state.authError && this.props.aestheticsForStagePhases) {
+        const dialogAesthetics = this.props.aestheticsForStagePhases || this._getDefaultDialogAesthetics();
-            if (this.props.aestheticsForStagePhases[this.state.uiaStage]) {
+        if (!this.state.authError && dialogAesthetics) {
-                const aesthetics = this.props.aestheticsForStagePhases[this.state.uiaStage][this.state.uiaStagePhase];
+            if (dialogAesthetics[this.state.uiaStage]) {
+                const aesthetics = dialogAesthetics[this.state.uiaStage][this.state.uiaStagePhase];
                 if (aesthetics && aesthetics.title) title = aesthetics.title;
                 if (aesthetics && aesthetics.body) body = aesthetics.body;
                 if (aesthetics && aesthetics.continueText) continueText = aesthetics.continueText;

src/i18n/strings/en_EN.json

@@ -1642,6 +1642,9 @@
     "Enable 'Manage Integrations' in Settings to do this.": "Enable 'Manage Integrations' in Settings to do this.",
     "Integrations not allowed": "Integrations not allowed",
     "Your Riot doesn't allow you to use an Integration Manager to do this. Please contact an admin.": "Your Riot doesn't allow you to use an Integration Manager to do this. Please contact an admin.",
+    "To continue, use Single Sign On to prove your identity.": "To continue, use Single Sign On to prove your identity.",
+    "Confirm to continue": "Confirm to continue",
+    "Click the button below to confirm your identity.": "Click the button below to confirm your identity.",
     "Failed to invite the following users to chat: %(csvUsers)s": "Failed to invite the following users to chat: %(csvUsers)s",
     "We couldn't create your DM. Please check the users you want to invite and try again.": "We couldn't create your DM. Please check the users you want to invite and try again.",
     "Something went wrong trying to invite the users.": "Something went wrong trying to invite the users.",
@@ -2193,6 +2196,8 @@
     "The export file will be protected with a passphrase. You should enter the passphrase here, to decrypt the file.": "The export file will be protected with a passphrase. You should enter the passphrase here, to decrypt the file.",
     "File to import": "File to import",
     "Import": "Import",
+    "Confirm encryption setup": "Confirm encryption setup",
+    "Click the button below to confirm setting up encryption.": "Click the button below to confirm setting up encryption.",
     "Enter your account password to confirm the upgrade:": "Enter your account password to confirm the upgrade:",
     "Restore your key backup to upgrade your encryption": "Restore your key backup to upgrade your encryption",
     "Restore": "Restore",