Add a warning on E2EE rooms if you try to make them public

res/css/_common.scss

@@ -380,6 +380,11 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
     font-size: $font-14px;
     color: $primary-fg-color;
     word-wrap: break-word;
+
+    a {
+        color: $accent-color;
+        cursor: pointer;
+    }
 }
 
 .mx_Dialog_buttons {

src/components/views/dialogs/CreateRoomDialog.tsx

@@ -39,11 +39,13 @@ interface IProps {
     defaultPublic?: boolean;
     defaultName?: string;
     parentSpace?: Room;
+    defaultEncrypted?: boolean;
     onFinished(proceed: boolean, opts?: IOpts): void;
 }
 
 interface IState {
     joinRule: JoinRule;
+    isPublic: boolean;
     isEncrypted: boolean;
     name: string;
     topic: string;
@@ -74,8 +76,9 @@ export default class CreateRoomDialog extends React.Component<IProps, IState> {
 
         const config = SdkConfig.get();
         this.state = {
+            isPublic: this.props.defaultPublic || false,
+            isEncrypted: this.props.defaultEncrypted ?? privateShouldBeEncrypted(),
             joinRule,
-            isEncrypted: privateShouldBeEncrypted(),
             name: this.props.defaultName || "",
             topic: "",
             alias: "",

src/components/views/settings/tabs/room/SecurityRoomSettingsTab.tsx

@@ -37,6 +37,8 @@ import RoomUpgradeWarningDialog from '../../../dialogs/RoomUpgradeWarningDialog'
 import { upgradeRoom } from "../../../../../utils/RoomUpgrade";
 import { arrayHasDiff } from "../../../../../utils/arrays";
 import SettingsFlag from '../../../elements/SettingsFlag';
+import createRoom, { IOpts } from '../../../../../createRoom';
+import CreateRoomDialog from '../../../dialogs/CreateRoomDialog';
 
 interface IProps {
     roomId: string;
@@ -129,7 +131,38 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
         if (refreshWhenTypes.includes(e.getType() as EventType)) this.forceUpdate();
     };
 
-    private onEncryptionChange = () => {
+    private onEncryptionChange = async () => {
+        if (this.state.joinRule == "public") {
+            const dialog = Modal.createTrackedDialog('Confirm Public Encrypted Room', '', QuestionDialog, {
+                title: _t('Are you sure you want to add encryption to this public room?'),
+                description: <div>
+                    <p> { _t(
+                        "<b> It’s not recommended to add encryption to public rooms. </b>" +
+                        "Anyone can find and join public rooms, so anyone can read messages in them. " +
+                        "You’ll get none of the benefits of encryption, and you won’t be able to turn it " +
+                        "off later. Encrypting messages in a public room will make receiving and sending " +
+                        "messages slower.",
+                        null,
+                        { "b": (sub) => <b> { sub } </b> },
+                    ) } </p>
+                    <p> { _t(
+                        "To avoid these issues, create a <a> new encrypted room </a> for " +
+                        "the conversation you plan to have.",
+                        null,
+                        { "a": (sub) => <a onClick={() => {
+                            dialog.close();
+                            this.createNewRoom(false, true);
+                        }}> { sub } </a> },
+                    ) } </p>
+                </div>,
+
+            });
+
+            const { finished } = dialog;
+            const [confirm] = await finished;
+            if (!confirm) return;
+        }
+
         Modal.createTrackedDialog('Enable encryption', '', QuestionDialog, {
             title: _t('Enable encryption?'),
             description: _t(
@@ -194,6 +227,41 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
             }
         }
 
+        if (
+            this.state.encrypted &&
+            this.state.joinRule !== JoinRule.Public &&
+            joinRule === JoinRule.Public
+        ) {
+            const dialog = Modal.createTrackedDialog('Confirm Public Encrypted Room', '', QuestionDialog, {
+                title: _t("Are you sure you want to make this encrypted room public?"),
+                description: <div>
+                    <p> { _t(
+                        "<b> It’s not recommended to make encrypted rooms public. </b> " +
+                        "It will mean anyone can find and join the room, so anyone can read messages. " +
+                        "You’ll get none of the benefits of encryption. Encrypting messages in a public " +
+                        "room will make receiving and sending messages slower.",
+                        null,
+                        { "b": (sub) => <b> { sub } </b> },
+                    ) } </p>
+                    <p> { _t(
+                        "To avoid these issues, create a <a> new public room </a> for the conversation " +
+                        "you plan to have.",
+                        null,
+                        {
+                            "a": (sub) => <a onClick={() => {
+                                dialog.close();
+                                this.createNewRoom(true, false);
+                            }}> { sub } </a>,
+                        },
+                    ) } </p>
+                </div>,
+            });
+
+            const { finished } = dialog;
+            const [confirm] = await finished;
+            if (!confirm) return;
+        }
+
         if (beforeJoinRule === joinRule && !restrictedAllowRoomIds) return;
 
         const content: IContent = {
@@ -254,6 +322,20 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
         });
     };
 
+    private createNewRoom = async (defaultPublic: boolean, defaultEncrypted: boolean) => {
+        const modal = Modal.createTrackedDialog<[boolean, IOpts]>(
+            "Create Room",
+            "Create room after trying to make an E2EE room public",
+            CreateRoomDialog,
+            { defaultPublic, defaultEncrypted },
+        );
+        const [shouldCreate, opts] = await modal.finished;
+        if (shouldCreate) {
+            await createRoom(opts);
+        }
+        return shouldCreate;
+    };
+
     private onHistoryRadioToggle = (history: HistoryVisibility) => {
         const beforeHistory = this.state.history;
         if (beforeHistory === history) return;

src/i18n/strings/en_EN.json

@@ -1426,9 +1426,15 @@
     "Send %(eventType)s events": "Send %(eventType)s events",
     "Permissions": "Permissions",
     "Select the roles required to change various parts of the room": "Select the roles required to change various parts of the room",
+    "Are you sure you want to add encryption to this public room?": "Are you sure you want to add encryption to this public room?",
+    "<b> It’s not recommended to add encryption to public rooms. </b>Anyone can find and join public rooms, so anyone can read messages in them. You’ll get none of the benefits of encryption, and you won’t be able to turn it off later. Encrypting messages in a public room will make receiving and sending messages slower.": "<b> It’s not recommended to add encryption to public rooms. </b>Anyone can find and join public rooms, so anyone can read messages in them. You’ll get none of the benefits of encryption, and you won’t be able to turn it off later. Encrypting messages in a public room will make receiving and sending messages slower.",
+    "To avoid these issues, create a <a> new encrypted room </a> for the conversation you plan to have.": "To avoid these issues, create a <a> new encrypted room </a> for the conversation you plan to have.",
     "Enable encryption?": "Enable encryption?",
     "Once enabled, encryption for a room cannot be disabled. Messages sent in an encrypted room cannot be seen by the server, only by the participants of the room. Enabling encryption may prevent many bots and bridges from working correctly. <a>Learn more about encryption.</a>": "Once enabled, encryption for a room cannot be disabled. Messages sent in an encrypted room cannot be seen by the server, only by the participants of the room. Enabling encryption may prevent many bots and bridges from working correctly. <a>Learn more about encryption.</a>",
     "This upgrade will allow members of selected spaces access to this room without an invite.": "This upgrade will allow members of selected spaces access to this room without an invite.",
+    "Are you sure you want to make this encrypted room public?": "Are you sure you want to make this encrypted room public?",
+    "<b> It’s not recommended to make encrypted rooms public. </b> It will mean anyone can find and join the room, so anyone can read messages. You’ll get none of the benefits of encryption. Encrypting messages in a public room will make receiving and sending messages slower.": "<b> It’s not recommended to make encrypted rooms public. </b> It will mean anyone can find and join the room, so anyone can read messages. You’ll get none of the benefits of encryption. Encrypting messages in a public room will make receiving and sending messages slower.",
+    "To avoid these issues, create a <a> new public room </a> for the conversation you plan to have.": "To avoid these issues, create a <a> new public room </a> for the conversation you plan to have.",
     "To link to this room, please add an address.": "To link to this room, please add an address.",
     "Private (invite only)": "Private (invite only)",
     "Only invited people can join.": "Only invited people can join.",