Migrate more strings to translation keys (#11671)

src/components/structures/LeftPanel.tsx

@@ -345,7 +345,7 @@ export default class LeftPanel extends React.Component<IProps, IState> {
                 <AccessibleTooltipButton
                     className="mx_LeftPanel_exploreButton"
                     onClick={this.onExplore}
-                    title={_t("Explore rooms")}
+                    title={_t("action|explore_rooms")}
                 />
             );
         }

src/components/structures/SpaceHierarchy.tsx

@@ -384,7 +384,7 @@ export const showRoom = (cli: MatrixClient, hierarchy: RoomHierarchy, roomId: st
         oob_data: {
             avatarUrl: room?.avatar_url,
             // XXX: This logic is duplicated from the JS SDK which would normally decide what the name is.
-            name: room?.name || roomAlias || _t("Unnamed room"),
+            name: room?.name || roomAlias || _t("common|unnamed_room"),
             roomType,
         } as IOOBData,
         metricsTrigger: "RoomDirectory",

src/components/structures/SpaceRoomView.tsx

@@ -124,7 +124,7 @@ const SpaceLandingAddButton: React.FC<{ space: Room }> = ({ space }) => {
                     {canCreateRoom && (
                         <>
                             <IconizedContextMenuOption
-                                label={_t("New room")}
+                                label={_t("action|new_room")}
                                 iconClassName="mx_RoomList_iconNewRoom"
                                 onClick={async (e): Promise<void> => {
                                     e.preventDefault();
@@ -139,7 +139,7 @@ const SpaceLandingAddButton: React.FC<{ space: Room }> = ({ space }) => {
                             />
                             {videoRoomsEnabled && (
                                 <IconizedContextMenuOption
-                                    label={_t("New video room")}
+                                    label={_t("action|new_video_room")}
                                     iconClassName="mx_RoomList_iconNewVideoRoom"
                                     onClick={async (e): Promise<void> => {
                                         e.preventDefault();
@@ -164,7 +164,7 @@ const SpaceLandingAddButton: React.FC<{ space: Room }> = ({ space }) => {
                         </>
                     )}
                     <IconizedContextMenuOption
-                        label={_t("Add existing room")}
+                        label={_t("action|add_existing_room")}
                         iconClassName="mx_RoomList_iconAddExistingRoom"
                         onClick={(e) => {
                             e.preventDefault();

src/components/views/context_menus/RoomContextMenu.tsx

@@ -174,11 +174,11 @@ const RoomContextMenu: React.FC<IProps> = ({ room, onFinished, ...props }) => {
         let iconClassName: string | undefined;
         switch (echoChamber.notificationVolume) {
             case RoomNotifState.AllMessages:
-                notificationLabel = _t("Default");
+                notificationLabel = _t("notifications|default");
                 iconClassName = "mx_RoomTile_iconNotificationsDefault";
                 break;
             case RoomNotifState.AllMessagesLoud:
-                notificationLabel = _t("All messages");
+                notificationLabel = _t("notifications|all_messages");
                 iconClassName = "mx_RoomTile_iconNotificationsAllMessages";
                 break;
             case RoomNotifState.MentionsOnly:

src/components/views/context_menus/RoomNotificationContextMenu.tsx

@@ -61,7 +61,7 @@ export const RoomNotificationContextMenu: React.FC<IProps> = ({ room, onFinished
 
     const allMessagesOption: JSX.Element = (
         <IconizedContextMenuRadio
-            label={_t("All messages")}
+            label={_t("notifications|all_messages")}
             active={notificationState === RoomNotifState.AllMessagesLoud}
             iconClassName="mx_RoomNotificationContextMenu_iconBellDot"
             onClick={wrapHandler(() => setNotificationState(RoomNotifState.AllMessagesLoud))}

src/components/views/context_menus/SpaceContextMenu.tsx

@@ -187,7 +187,7 @@ const SpaceContextMenu: React.FC<IProps> = ({ space, hideHeader, onFinished, ...
                     <IconizedContextMenuOption
                         data-testid="new-video-room-option"
                         iconClassName="mx_SpacePanel_iconPlus"
-                        label={_t("Video room")}
+                        label={_t("common|video_room")}
                         onClick={onNewVideoRoomClick}
                     >
                         <BetaPill />

src/components/views/dialogs/ConfirmUserActionDialog.tsx

@@ -95,7 +95,7 @@ export default class ConfirmUserActionDialog extends React.Component<IProps, ISt
                         onChange={this.onReasonChange}
                         value={this.state.reason}
                         className="mx_ConfirmUserActionDialog_reasonField"
-                        label={_t("Reason")}
+                        label={_t("room_settings|permissions|ban_reason")}
                         autoFocus={true}
                     />
                 </form>

src/components/views/dialogs/CreateRoomDialog.tsx

@@ -353,9 +353,7 @@ export default class CreateRoomDialog extends React.Component<IProps, IState> {
                     microcopy = _t("create_room|encryption_forced");
                 }
             } else {
-                microcopy = _t(
-                    "Your server admin has disabled end-to-end encryption by default in private rooms & Direct Messages.",
-                );
+                microcopy = _t("settings|security|e2ee_default_disabled_warning");
             }
             e2eeSection = (
                 <React.Fragment>
@@ -420,7 +418,7 @@ export default class CreateRoomDialog extends React.Component<IProps, IState> {
                             labelKnock={
                                 this.askToJoinEnabled ? _t("room_settings|security|join_rule_knock") : undefined
                             }
-                            labelPublic={_t("Public room")}
+                            labelPublic={_t("common|public_room")}
                             labelRestricted={
                                 this.supportsRestricted ? _t("create_room|join_rule_restricted") : undefined
                             }

src/components/views/dialogs/CreateSubspaceDialog.tsx

@@ -163,7 +163,7 @@ const CreateSubspaceDialog: React.FC<IProps> = ({ space, onAddExistingSpaceClick
                         <JoinRuleDropdown
                             label={_t("Space visibility")}
                             labelInvite={_t("Private space (invite only)")}
-                            labelPublic={_t("Public space")}
+                            labelPublic={_t("common|public_space")}
                             labelRestricted={_t("create_room|join_rule_restricted")}
                             width={478}
                             value={joinRule}

src/components/views/dialogs/DeactivateAccountDialog.tsx

@@ -214,7 +214,7 @@ export default class DeactivateAccountDialog extends React.Component<IProps, ISt
                 className="mx_DeactivateAccountDialog"
                 onFinished={this.props.onFinished}
                 titleClass="danger"
-                title={_t("Deactivate Account")}
+                title={_t("settings|general|deactivate_section")}
                 screenName="DeactivateAccount"
             >
                 <div className="mx_Dialog_content">

src/components/views/dialogs/IntegrationsDisabledDialog.tsx

@@ -47,7 +47,7 @@ export default class IntegrationsDisabledDialog extends React.Component<IProps>
                 <div className="mx_IntegrationsDisabledDialog_content">
                     <p>
                         {_t("Enable '%(manageIntegrations)s' in Settings to do this.", {
-                            manageIntegrations: _t("Manage integrations"),
+                            manageIntegrations: _t("integration_manager|manage_title"),
                         })}
                     </p>
                 </div>

src/components/views/dialogs/InteractiveAuthDialog.tsx

@@ -143,7 +143,7 @@ export default class InteractiveAuthDialog<T> extends React.Component<Interactiv
         // Let's pick a title, body, and other params text that we'll show to the user. The order
         // is most specific first, so stagePhase > our props > defaults.
 
-        let title = this.state.authError ? "Error" : this.props.title || _t("Authentication");
+        let title = this.state.authError ? "Error" : this.props.title || _t("common|authentication");
         let body = this.state.authError ? null : this.props.body;
         let continueText: string | undefined;
         let continueKind: string | undefined;

src/components/views/dialogs/ReportEventDialog.tsx

@@ -417,7 +417,7 @@ export default class ReportEventDialog extends React.Component<IProps, IState> {
                         <Field
                             className="mx_ReportEventDialog_reason"
                             element="textarea"
-                            label={_t("Reason")}
+                            label={_t("room_settings|permissions|ban_reason")}
                             rows={5}
                             onChange={this.onReasonChange}
                             value={this.state.reason}
@@ -456,7 +456,7 @@ export default class ReportEventDialog extends React.Component<IProps, IState> {
                     <Field
                         className="mx_ReportEventDialog_reason"
                         element="textarea"
-                        label={_t("Reason")}
+                        label={_t("room_settings|permissions|ban_reason")}
                         rows={5}
                         onChange={this.onReasonChange}
                         value={this.state.reason}

src/components/views/dialogs/RoomSettingsDialog.tsx

@@ -154,7 +154,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
             tabs.push(
                 new Tab(
                     RoomSettingsTab.Voip,
-                    _td("Voice & Video"),
+                    _td("settings|voip|title"),
                     "mx_RoomSettingsDialog_voiceIcon",
                     <VoipRoomSettingsTab room={this.state.room} />,
                 ),
@@ -197,7 +197,7 @@ class RoomSettingsDialog extends React.Component<IProps, IState> {
             tabs.push(
                 new Tab(
                     RoomSettingsTab.Bridges,
-                    _td("Bridges"),
+                    _td("room_settings|bridges|title"),
                     "mx_RoomSettingsDialog_bridgesIcon",
                     <BridgeSettingsTab room={this.state.room} />,
                     "RoomSettingsBridges",

src/components/views/dialogs/SetEmailDialog.tsx

@@ -67,8 +67,8 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
         const emailAddress = this.state.emailAddress;
         if (!Email.looksValid(emailAddress)) {
             Modal.createDialog(ErrorDialog, {
-                title: _t("Invalid Email Address"),
-                description: _t("This doesn't appear to be a valid email address"),
+                title: _t("settings|general|error_invalid_email"),
+                description: _t("settings|general|error_invalid_email_detail"),
             });
             return;
         }
@@ -88,7 +88,7 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
                 this.setState({ emailBusy: false });
                 logger.error("Unable to add email address " + emailAddress + " " + err);
                 Modal.createDialog(ErrorDialog, {
-                    title: _t("Unable to add email address"),
+                    title: _t("settings|general|error_add_email"),
                     description: extractErrorMessageFromError(err, _t("invite|failed_generic")),
                 });
             },
@@ -123,7 +123,7 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
 
                 if (underlyingError instanceof MatrixError && underlyingError.errcode === "M_THREEPID_AUTH_FAILED") {
                     const message =
-                        _t("Unable to verify email address.") +
+                        _t("settings|general|error_email_verification") +
                         " " +
                         _t(
                             "Please check your email and click on the link it contains. Once this is done, click continue.",
@@ -137,7 +137,7 @@ export default class SetEmailDialog extends React.Component<IProps, IState> {
                 } else {
                     logger.error("Unable to verify email address: " + err);
                     Modal.createDialog(ErrorDialog, {
-                        title: _t("Unable to verify email address."),
+                        title: _t("settings|general|error_email_verification"),
                         description: extractErrorMessageFromError(err, _t("invite|failed_generic")),
                     });
                 }

src/components/views/dialogs/UserSettingsDialog.tsx

@@ -133,7 +133,7 @@ export default class UserSettingsDialog extends React.Component<IProps, IState>
             tabs.push(
                 new Tab(
                     UserTab.Voice,
-                    _td("Voice & Video"),
+                    _td("settings|voip|title"),
                     "mx_UserSettingsDialog_voiceIcon",
                     <VoiceUserSettingsTab />,
                     "UserSettingsVoiceVideo",

src/components/views/dialogs/spotlight/PublicRoomResultDetails.tsx

@@ -33,7 +33,9 @@ interface Props {
 
 export function PublicRoomResultDetails({ room, labelId, descriptionId, detailsId }: Props): JSX.Element {
     let name =
-        room.name || getDisplayAliasForAliasSet(room.canonical_alias ?? "", room.aliases ?? []) || _t("Unnamed room");
+        room.name ||
+        getDisplayAliasForAliasSet(room.canonical_alias ?? "", room.aliases ?? []) ||
+        _t("common|unnamed_room");
     if (name.length > MAX_NAME_LENGTH) {
         name = `${name.substring(0, MAX_NAME_LENGTH)}...`;
     }

src/components/views/right_panel/UserInfo.tsx

@@ -409,7 +409,7 @@ export const UserOptionsSection: React.FC<{
                 kind="link"
                 className={classNames("mx_UserInfo_field", { mx_UserInfo_destructive: !isIgnored })}
             >
-                {isIgnored ? _t("Unignore") : _t("action|ignore")}
+                {isIgnored ? _t("action|unignore") : _t("action|ignore")}
             </AccessibleButton>
         );
 

src/components/views/rooms/LegacyRoomHeader.tsx

@@ -762,7 +762,7 @@ export default class RoomHeader extends React.Component<IProps, IState> {
 
         const buttons = this.props.showButtons ? this.renderButtons(isVideoRoom) : null;
 
-        let oobName = _t("Unnamed room");
+        let oobName = _t("common|unnamed_room");
         if (this.props.oobData && this.props.oobData.name) {
             oobName = this.props.oobData.name;
         }

src/components/views/rooms/LinkPreviewGroup.tsx

@@ -59,7 +59,7 @@ const LinkPreviewGroup: React.FC<IProps> = ({ links, mxEvent, onCancelClick, onH
             <AccessibleButton onClick={toggleExpanded}>
                 {expanded
                     ? _t("action|collapse")
-                    : _t("Show %(count)s other previews", { count: previews.length - showPreviews.length })}
+                    : _t("timeline|url_preview|show_n_more", { count: previews.length - showPreviews.length })}
             </AccessibleButton>
         );
     }
@@ -72,7 +72,7 @@ const LinkPreviewGroup: React.FC<IProps> = ({ links, mxEvent, onCancelClick, onH
                         <AccessibleButton
                             className="mx_LinkPreviewGroup_hide"
                             onClick={onCancelClick}
-                            aria-label={_t("Close preview")}
+                            aria-label={_t("timeline|url_preview|close")}
                         >
                             <img
                                 className="mx_filterFlipColor"

src/components/views/rooms/MemberList.tsx

@@ -354,9 +354,9 @@ export default class MemberList extends React.Component<IProps, IState> {
         let inviteButton: JSX.Element | undefined;
 
         if (room?.getMyMembership() === "join" && shouldShowComponent(UIComponent.InviteUsers)) {
-            let inviteButtonText = _t("Invite to this room");
+            let inviteButtonText = _t("room|invite_this_room");
             if (room.isSpaceRoom()) {
-                inviteButtonText = _t("Invite to this space");
+                inviteButtonText = _t("space|invite_this_space");
             }
 
             if (this.state.canInvite) {

src/components/views/rooms/NewRoomIntro.tsx

@@ -215,7 +215,7 @@ const NewRoomIntro: React.FC = () => {
                             defaultDispatcher.dispatch({ action: "view_invite", roomId });
                         }}
                     >
-                        {_t("Invite to this room")}
+                        {_t("room|invite_this_room")}
                     </AccessibleButton>
                 </div>
             );

src/components/views/rooms/RoomBreadcrumbs.tsx

@@ -50,7 +50,7 @@ const RoomBreadcrumbTile: React.FC<{ room: Room; onClick: (ev: ButtonEvent) => v
         <AccessibleTooltipButton
             className="mx_RoomBreadcrumbs_crumb"
             onClick={onClick}
-            aria-label={_t("Room %(name)s", { name: room.name })}
+            aria-label={_t("a11y|room_name", { name: room.name })}
             title={room.name}
             tooltipClassName="mx_RoomBreadcrumbs_Tooltip"
             onFocus={onFocus}
@@ -123,15 +123,15 @@ export default class RoomBreadcrumbs extends React.PureComponent<IProps, IState>
             // NOTE: The CSSTransition timeout MUST match the timeout in our CSS!
             return (
                 <CSSTransition appear={true} in={this.state.doAnimation} timeout={640} classNames="mx_RoomBreadcrumbs">
-                    <Toolbar className="mx_RoomBreadcrumbs" aria-label={_t("Recently visited rooms")}>
+                    <Toolbar className="mx_RoomBreadcrumbs" aria-label={_t("room_list|breadcrumbs_label")}>
                         {tiles.slice(this.state.skipFirst ? 1 : 0)}
                     </Toolbar>
                 </CSSTransition>
             );
         } else {
             return (
                 <div className="mx_RoomBreadcrumbs">
-                    <div className="mx_RoomBreadcrumbs_placeholder">{_t("No recently visited rooms")}</div>
+                    <div className="mx_RoomBreadcrumbs_placeholder">{_t("room_list|breadcrumbs_empty")}</div>
                 </div>
             );
         }

src/components/views/rooms/RoomHeader.tsx

@@ -131,12 +131,12 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
                     {roomName}
 
                     {!isDirectMessage && roomState.getJoinRule() === JoinRule.Public && (
-                        <Tooltip label={_t("Public room")}>
+                        <Tooltip label={_t("common|public_room")}>
                             <PublicIcon
                                 width="16px"
                                 height="16px"
                                 className="text-secondary"
-                                aria-label={_t("Public room")}
+                                aria-label={_t("common|public_room")}
                             />
                         </Tooltip>
                     )}
@@ -153,12 +153,12 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
                     )}
 
                     {isDirectMessage && e2eStatus === E2EStatus.Warning && (
-                        <Tooltip label={_t("Untrusted")}>
+                        <Tooltip label={_t("room|header_untrusted_label")}>
                             <ErrorIcon
                                 width="16px"
                                 height="16px"
                                 className="mx_Untrusted"
-                                aria-label={_t("Untrusted")}
+                                aria-label={_t("room|header_untrusted_label")}
                             />
                         </Tooltip>
                     )}

src/components/views/rooms/RoomInfoLine.tsx

@@ -51,13 +51,13 @@ const RoomInfoLine: FC<IProps> = ({ room }) => {
     let roomType: string;
     if (isVideoRoom) {
         iconClass = "mx_RoomInfoLine_video";
-        roomType = _t("Video room");
+        roomType = _t("common|video_room");
     } else if (joinRule === JoinRule.Public) {
         iconClass = "mx_RoomInfoLine_public";
-        roomType = room.isSpaceRoom() ? _t("Public space") : _t("Public room");
+        roomType = room.isSpaceRoom() ? _t("common|public_space") : _t("common|public_room");
     } else {
         iconClass = "mx_RoomInfoLine_private";
-        roomType = room.isSpaceRoom() ? _t("Private space") : _t("Private room");
+        roomType = room.isSpaceRoom() ? _t("common|private_space") : _t("common|private_room");
     }
 
     let members: JSX.Element | undefined;