Enable indent rule and fix indent

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

.eslintrc.js

@@ -15,7 +15,6 @@ module.exports = {
         "prefer-promise-reject-errors": "off",
         "no-async-promise-executor": "off",
         "quotes": "off",
-        "indent": "off",
     },
 
     overrides: [{

src/async-components/views/dialogs/security/ExportE2eKeysDialog.js

@@ -170,7 +170,10 @@ export default class ExportE2eKeysDialog extends React.Component {
                         </div>
                     </div>
                     <div className='mx_Dialog_buttons'>
-                        <input className='mx_Dialog_primary' type='submit' value={_t('Export')}
+                        <input
+                            className='mx_Dialog_primary'
+                            type='submit'
+                            value={_t('Export')}
                             disabled={disableForm}
                         />
                         <button onClick={this._onCancelClick} disabled={disableForm}>

src/components/structures/GroupView.js

@@ -43,7 +43,7 @@ import {mediaFromMxc} from "../../customisations/Media";
 import {replaceableComponent} from "../../utils/replaceableComponent";
 
 const LONG_DESC_PLACEHOLDER = _td(
-`<h1>HTML for your community's page</h1>
+    `<h1>HTML for your community's page</h1>
 <p>
     Use the long description to introduce new members to the community, or distribute
     some important <a href="foo">links</a>
@@ -117,7 +117,8 @@ class CategoryRoomList extends React.Component {
                             {groupId: this.props.groupId},
                         ),
                         description: errorList.join(", "),
-                    });
+                        },
+                    );
                 });
             },
         }, /*className=*/null, /*isPriority=*/false, /*isStatic=*/true);
@@ -145,7 +146,8 @@ class CategoryRoomList extends React.Component {
 
         let catHeader = <div />;
         if (this.props.category && this.props.category.profile) {
-            catHeader = <div className="mx_GroupView_featuredThings_category">
+            catHeader = <div
+                className="mx_GroupView_featuredThings_category">
                 { this.props.category.profile.name }
             </div>;
         }
@@ -196,7 +198,8 @@ class FeaturedRoom extends React.Component {
                     {groupId: this.props.groupId},
                 ),
                 description: _t("The room '%(roomName)s' could not be removed from the summary.", {roomName}),
-            });
+                },
+            );
         });
     };
 
@@ -359,7 +362,8 @@ class FeaturedUser extends React.Component {
                     {groupId: this.props.groupId},
                 ),
                 description: _t("The user '%(displayName)s' could not be removed from the summary.", {displayName}),
-            });
+                },
+            );
         });
     };
 

src/components/structures/MessagePanel.js

@@ -427,8 +427,10 @@ export default class MessagePanel extends React.Component {
             // we get a new DOM node (restarting the animation) when the ghost
             // moves to a different event.
             return (
-                <li key={"_readuptoghost_"+eventId}
+                <li
-                      className="mx_RoomView_myReadMarker_container">
+                    key={"_readuptoghost_"+eventId}
+                    className="mx_RoomView_myReadMarker_container"
+                >
                     { hr }
                 </li>
             );

src/components/structures/RoomStatusBar.js

@@ -196,7 +196,8 @@ export default class RoomStatusBar extends React.Component {
         } else if (resourceLimitError) {
             title = messageForResourceLimitError(
                 resourceLimitError.data.limit_type,
-                resourceLimitError.data.admin_contact, {
+                resourceLimitError.data.admin_contact,
+                {
                     'monthly_active_user': _td(
                         "Your message wasn't sent because this homeserver has hit its Monthly Active User Limit. " +
                         "Please <a>contact your service administrator</a> to continue using the service.",
@@ -209,7 +210,8 @@ export default class RoomStatusBar extends React.Component {
                         "Your message wasn't sent because this homeserver has exceeded a resource limit. " +
                         "Please <a>contact your service administrator</a> to continue using the service.",
                     ),
-            });
+                },
+            );
         } else {
             title = _t('Some of your messages have not been sent');
         }

src/components/structures/ScrollPanel.js

@@ -884,9 +884,12 @@ export default class ScrollPanel extends React.Component {
 
         // give the <ol> an explicit role=list because Safari+VoiceOver seems to think an ordered-list with
         // list-style-type: none; is no longer a list
-        return (<AutoHideScrollbar wrappedRef={this._collectScroll}
+        return (<AutoHideScrollbar
+            wrappedRef={this._collectScroll}
             onScroll={this.onScroll}
-                className={`mx_ScrollPanel ${this.props.className}`} style={this.props.style}>
+            className={`mx_ScrollPanel ${this.props.className}`}
+            style={this.props.style}
+        >
             { this.props.fixedChildren }
             <div className="mx_RoomView_messageListWrapper">
                 <ol ref={this._itemlist} className="mx_RoomView_MessageList" aria-live="polite" role="list">

src/components/structures/TimelinePanel.js

@@ -785,8 +785,10 @@ class TimelinePanel extends React.Component {
             return;
         }
         const lastDisplayedEvent = this.state.events[lastDisplayedIndex];
-        this._setReadMarker(lastDisplayedEvent.getId(),
+        this._setReadMarker(
-                            lastDisplayedEvent.getTs());
+            lastDisplayedEvent.getId(),
+            lastDisplayedEvent.getTs(),
+        );
 
         // the read-marker should become invisible, so that if the user scrolls
         // down, they don't see it.

src/components/views/dialogs/ConfirmWipeDeviceDialog.js

@@ -39,9 +39,12 @@ export default class ConfirmWipeDeviceDialog extends React.Component {
         const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
 
         return (
-            <BaseDialog className='mx_ConfirmWipeDeviceDialog' hasCancel={true}
+            <BaseDialog
+                className='mx_ConfirmWipeDeviceDialog'
+                hasCancel={true}
                 onFinished={this.props.onFinished}
-                        title={_t("Clear all data in this session?")}>
+                title={_t("Clear all data in this session?")}
+            >
                 <div className='mx_ConfirmWipeDeviceDialog_content'>
                     <p>
                         {_t(

src/components/views/dialogs/DevtoolsDialog.js

@@ -70,8 +70,16 @@ class GenericEditor extends React.PureComponent {
     }
 
     textInput(id, label) {
-        return <Field id={id} label={label} size="42" autoFocus={true} type="text" autoComplete="on"
+        return <Field
-                      value={this.state[id]} onChange={this._onChange} />;
+            id={id}
+            label={label}
+            size="42"
+            autoFocus={true}
+            type="text"
+            autoComplete="on"
+            value={this.state[id]}
+            onChange={this._onChange}
+        />;
     }
 }
 

src/components/views/dialogs/IntegrationsDisabledDialog.js

@@ -42,9 +42,12 @@ export default class IntegrationsDisabledDialog extends React.Component {
         const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
 
         return (
-            <BaseDialog className='mx_IntegrationsDisabledDialog' hasCancel={true}
+            <BaseDialog
+                className='mx_IntegrationsDisabledDialog'
+                hasCancel={true}
                 onFinished={this.props.onFinished}
-                        title={_t("Integrations are disabled")}>
+                title={_t("Integrations are disabled")}
+            >
                 <div className='mx_IntegrationsDisabledDialog_content'>
                     <p>{_t("Enable 'Manage Integrations' in Settings to do this.")}</p>
                 </div>

src/components/views/dialogs/IntegrationsImpossibleDialog.js

@@ -37,9 +37,12 @@ export default class IntegrationsImpossibleDialog extends React.Component {
         const DialogButtons = sdk.getComponent('views.elements.DialogButtons');
 
         return (
-            <BaseDialog className='mx_IntegrationsImpossibleDialog' hasCancel={false}
+            <BaseDialog
+                className='mx_IntegrationsImpossibleDialog'
+                hasCancel={false}
                 onFinished={this.props.onFinished}
-                        title={_t("Integrations not allowed")}>
+                title={_t("Integrations not allowed")}
+            >
                 <div className='mx_IntegrationsImpossibleDialog_content'>
                     <p>
                         {_t(

src/components/views/dialogs/KeySignatureUploadFailedDialog.js

@@ -24,7 +24,7 @@ export default function KeySignatureUploadFailedDialog({
         source,
         continuation,
         onFinished,
-    }) {
+}) {
     const RETRIES = 2;
     const BaseDialog = sdk.getComponent('dialogs.BaseDialog');
     const DialogButtons = sdk.getComponent('views.elements.DialogButtons');

src/components/views/dialogs/MessageEditHistoryDialog.js

@@ -164,8 +164,12 @@ export default class MessageEditHistoryDialog extends React.PureComponent {
         }
         const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
         return (
-            <BaseDialog className='mx_MessageEditHistoryDialog' hasCancel={true}
+            <BaseDialog
-                        onFinished={this.props.onFinished} title={_t("Message edits")}>
+                className='mx_MessageEditHistoryDialog'
+                hasCancel={true}
+                onFinished={this.props.onFinished}
+                title={_t("Message edits")}
+            >
                 {content}
             </BaseDialog>
         );

src/components/views/dialogs/StorageEvictedDialog.js

@@ -48,7 +48,8 @@ export default class StorageEvictedDialog extends React.Component {
                 "To help us prevent this in future, please <a>send us logs</a>.", {},
                 {
                 a: text => <a href="#" onClick={this._sendBugReport}>{text}</a>,
-            });
+                },
+            );
         }
 
         return (

src/components/views/dialogs/VerificationRequestDialog.js

@@ -52,7 +52,9 @@ export default class VerificationRequestDialog extends React.Component {
         const title = request && request.isSelfVerification ?
             _t("Verify other login") : _t("Verification Request");
 
-        return <BaseDialog className="mx_InfoDialog" onFinished={this.props.onFinished}
+        return <BaseDialog
+            className="mx_InfoDialog"
+            onFinished={this.props.onFinished}
             contentId="mx_Dialog_content"
             title={title}
             hasCancel={true}

src/components/views/elements/EditableItemList.js

@@ -65,12 +65,18 @@ export class EditableItem extends React.Component {
                     <span className="mx_EditableItem_promptText">
                         {_t("Are you sure?")}
                     </span>
-                    <AccessibleButton onClick={this._onActuallyRemove} kind="primary_sm"
+                    <AccessibleButton
-                                      className="mx_EditableItem_confirmBtn">
+                        onClick={this._onActuallyRemove}
+                        kind="primary_sm"
+                        className="mx_EditableItem_confirmBtn"
+                    >
                         {_t("Yes")}
                     </AccessibleButton>
-                    <AccessibleButton onClick={this._onDontRemove} kind="danger_sm"
+                    <AccessibleButton
-                                      className="mx_EditableItem_confirmBtn">
+                        onClick={this._onDontRemove}
+                        kind="danger_sm"
+                        className="mx_EditableItem_confirmBtn"
+                    >
                         {_t("No")}
                     </AccessibleButton>
                 </div>

src/components/views/elements/EditableText.js

@@ -221,13 +221,15 @@ export default class EditableText extends React.Component {
             </div>;
         } else {
             // show the content editable div, but manually manage its contents as react and contentEditable don't play nice together
-            editableEl = <div ref={this._editable_div}
+            editableEl = <div
+                ref={this._editable_div}
                 contentEditable={true}
                 className={className}
                 onKeyDown={this.onKeyDown}
                 onKeyUp={this.onKeyUp}
                 onFocus={this.onFocus}
-                              onBlur={this.onBlur} />;
+                onBlur={this.onBlur}
+            />;
         }
 
         return editableEl;

src/components/views/elements/LabelledToggleSwitch.js

@@ -46,8 +46,12 @@ export default class LabelledToggleSwitch extends React.Component {
         // This is a minimal version of a SettingsFlag
 
         let firstPart = <span className="mx_SettingsFlag_label">{this.props.label}</span>;
-        let secondPart = <ToggleSwitch checked={this.props.value} disabled={this.props.disabled}
+        let secondPart = <ToggleSwitch
-                                         onChange={this.props.onChange} aria-label={this.props.label} />;
+            checked={this.props.value}
+            disabled={this.props.disabled}
+            onChange={this.props.onChange}
+            aria-label={this.props.label}
+        />;
 
         if (this.props.toggleInFront) {
             const temp = firstPart;

src/components/views/elements/PowerSelector.js

@@ -136,8 +136,12 @@ export default class PowerSelector extends React.Component {
             picker = (
                 <Field type="number"
                     label={label} max={this.props.maxValue}
-                       onBlur={this.onCustomBlur} onKeyDown={this.onCustomKeyDown} onChange={this.onCustomChange}
+                    onBlur={this.onCustomBlur}
-                       value={String(this.state.customValue)} disabled={this.props.disabled} />
+                    onKeyDown={this.onCustomKeyDown}
+                    onChange={this.onCustomChange}
+                    value={String(this.state.customValue)}
+                    disabled={this.props.disabled}
+                />
             );
         } else {
             // Each level must have a definition in this.state.levelRoleMap
@@ -155,7 +159,8 @@ export default class PowerSelector extends React.Component {
             picker = (
                 <Field element="select"
                     label={label} onChange={this.onSelectChange}
-                       value={String(this.state.selectValue)} disabled={this.props.disabled}>
+                    value={String(this.state.selectValue)} disabled={this.props.disabled}
+                >
                     {options}
                 </Field>
             );

src/components/views/elements/RoomAliasField.js

@@ -56,7 +56,8 @@ export default class RoomAliasField extends React.PureComponent {
                 placeholder={_t("e.g. my-room")}
                 onChange={this._onChange}
                 value={this.props.value.substring(1, this.props.value.length - this.props.domain.length - 1)}
-                    maxLength={maxlength} />
+                maxLength={maxlength}
+            />
         );
     }
 

src/components/views/groups/GroupMemberList.js

@@ -178,9 +178,15 @@ export default class GroupMemberList extends React.Component {
         }
 
         const inputBox = (
-            <input className="mx_GroupMemberList_query mx_textinput" id="mx_GroupMemberList_query" type="text"
+            <input
-                    onChange={this.onSearchQueryChanged} value={this.state.searchQuery}
+                className="mx_GroupMemberList_query mx_textinput"
-                    placeholder={_t('Filter community members')} autoComplete="off" />
+                id="mx_GroupMemberList_query"
+                type="text"
+                onChange={this.onSearchQueryChanged}
+                value={this.state.searchQuery}
+                placeholder={_t('Filter community members')}
+                autoComplete="off"
+            />
         );
 
         const joined = this.state.members ? <div className="mx_MemberList_joined">

src/components/views/groups/GroupRoomList.js

@@ -141,9 +141,14 @@ export default class GroupRoomList extends React.Component {
             );
         }
         const inputBox = (
-            <input className="mx_GroupRoomList_query mx_textinput" id="mx_GroupRoomList_query" type="text"
+            <input
-                    onChange={this.onSearchQueryChanged} value={this.state.searchQuery}
+                className="mx_GroupRoomList_query mx_textinput" id="mx_GroupRoomList_query"
-                    placeholder={_t('Filter community rooms')} autoComplete="off" />
+                type="text"
+                onChange={this.onSearchQueryChanged}
+                value={this.state.searchQuery}
+                placeholder={_t('Filter community rooms')}
+                autoComplete="off"
+            />
         );
 
         const TruncatedList = sdk.getComponent("elements.TruncatedList");

src/components/views/messages/TextualBody.js

@@ -525,7 +525,8 @@ export default class TextualBody extends React.Component {
                     link={link}
                     mxEvent={this.props.mxEvent}
                     onCancelClick={this.onCancelClick}
-                            onHeightChanged={this.props.onHeightChanged} />;
+                    onHeightChanged={this.props.onHeightChanged}
+                />;
             });
         }
 

src/components/views/room_settings/AliasSettings.js

@@ -310,9 +310,14 @@ export default class AliasSettings extends React.Component {
         let found = false;
         const canonicalValue = this.state.canonicalAlias || "";
         const canonicalAliasSection = (
-            <Field onChange={this.onCanonicalAliasChange} value={canonicalValue}
+            <Field
+                onChange={this.onCanonicalAliasChange}
+                value={canonicalValue}
                 disabled={this.state.updatingCanonicalAlias || !this.props.canSetCanonicalAlias}
-                   element='select' id='canonicalAlias' label={_t('Main address')}>
+                element='select'
+                id='canonicalAlias'
+                label={_t('Main address')}
+            >
                 <option value="" key="unset">{ _t('not specified') }</option>
                 {
                     this._getAliases().map((alias, i) => {

src/components/views/room_settings/RoomProfileSettings.js

@@ -205,16 +205,34 @@ export default class RoomProfileSettings extends React.Component {
                 noValidate={true}
                 className="mx_ProfileSettings_profileForm"
             >
-                <input type="file" ref={this._avatarUpload} className="mx_ProfileSettings_avatarUpload"
+                <input
-                       onChange={this._onAvatarChanged} accept="image/*" />
+                    type="file"
+                    ref={this._avatarUpload}
+                    className="mx_ProfileSettings_avatarUpload"
+                    onChange={this._onAvatarChanged}
+                    accept="image/*"
+                />
                 <div className="mx_ProfileSettings_profile">
                     <div className="mx_ProfileSettings_controls">
-                        <Field label={_t("Room Name")}
+                        <Field
-                               type="text" value={this.state.displayName} autoComplete="off"
+                            label={_t("Room Name")}
-                               onChange={this._onDisplayNameChanged} disabled={!this.state.canSetName} />
+                            type="text"
-                        <Field className="mx_ProfileSettings_controls_topic" id="profileTopic" label={_t("Room Topic")} disabled={!this.state.canSetTopic}
+                            value={this.state.displayName}
-                               type="text" value={this.state.topic} autoComplete="off"
+                            autoComplete="off"
-                               onChange={this._onTopicChanged} element="textarea" />
+                            onChange={this._onDisplayNameChanged}
+                            disabled={!this.state.canSetName}
+                        />
+                        <Field
+                            className="mx_ProfileSettings_controls_topic"
+                            id="profileTopic"
+                            label={_t("Room Topic")}
+                            disabled={!this.state.canSetTopic}
+                            type="text"
+                            value={this.state.topic}
+                            autoComplete="off"
+                            onChange={this._onTopicChanged}
+                            element="textarea"
+                        />
                     </div>
                     <AvatarSetting
                         avatarUrl={this.state.avatarUrl}

src/components/views/room_settings/UrlPreviewSettings.js

@@ -68,10 +68,12 @@ export default class UrlPreviewSettings extends React.Component {
             if (SettingsStore.canSetValue("urlPreviewsEnabled", roomId, "room")) {
                 previewsForRoom = (
                     <label>
-                        <SettingsFlag name="urlPreviewsEnabled"
+                        <SettingsFlag
+                            name="urlPreviewsEnabled"
                             level={SettingLevel.ROOM}
                             roomId={roomId}
-                                      isExplicit={true} />
+                            isExplicit={true}
+                        />
                     </label>
                 );
             } else {

src/components/views/rooms/EntityTile.js

@@ -176,8 +176,11 @@ class EntityTile extends React.Component {
         // The wrapping div is required to make the magic mouse listener work, for some reason.
         return (
             <div ref={(c) => this.container = c} >
-                <AccessibleButton className={classNames(mainClassNames)} title={this.props.title}
+                <AccessibleButton
-                                  onClick={this.props.onClick}>
+                    className={classNames(mainClassNames)}
+                    title={this.props.title}
+                    onClick={this.props.onClick}
+                >
                     <div className="mx_EntityTile_avatar">
                         { av }
                         { e2eIcon }

src/components/views/rooms/PinnedEventTile.js

@@ -98,7 +98,10 @@ export default class PinnedEventTile extends React.Component {
                     { formatFullDate(new Date(this.props.mxEvent.getTs())) }
                 </span>
                 <div className="mx_PinnedEventTile_message">
-                    <MessageEvent mxEvent={this.props.mxEvent} className="mx_PinnedEventTile_body" maxImageHeight={150}
+                    <MessageEvent
+                        mxEvent={this.props.mxEvent}
+                        className="mx_PinnedEventTile_body"
+                        maxImageHeight={150}
                         onHeightChanged={() => {}} // we need to give this, apparently
                     />
                 </div>

src/components/views/rooms/PinnedEventsPanel.js

@@ -113,10 +113,14 @@ export default class PinnedEventsPanel extends React.Component {
         }
 
         return this.state.pinned.map((context) => {
-            return (<PinnedEventTile key={context.event.getId()}
+            return (
+                <PinnedEventTile
+                    key={context.event.getId()}
                     mxRoom={this.props.room}
                     mxEvent={context.event}
-                                     onUnpinned={this._updatePinnedMessages} />);
+                    onUnpinned={this._updatePinnedMessages}
+                />
+            );
         });
     }
 

src/components/views/rooms/ReplyPreview.js

@@ -79,8 +79,13 @@ export default class ReplyPreview extends React.Component {
                     { _t('Replying') }
                 </div>
                 <div className="mx_ReplyPreview_header mx_ReplyPreview_cancel">
-                    <img className="mx_filterFlipColor" src={require("../../../../res/img/cancel.svg")} width="18" height="18"
+                    <img
-                         onClick={cancelQuoting} />
+                        className="mx_filterFlipColor"
+                        src={require("../../../../res/img/cancel.svg")}
+                        width="18"
+                        height="18"
+                        onClick={cancelQuoting}
+                    />
                 </div>
                 <div className="mx_ReplyPreview_clear" />
                 <EventTile

src/components/views/settings/DevicesPanel.js

@@ -214,7 +214,7 @@ export default class DevicesPanel extends React.Component {
         const deleteButton = this.state.deleting ?
             <Spinner w={22} h={22} /> :
             <AccessibleButton onClick={this._onDeleteClick} kind="danger_sm">
-               { _t("Delete %(count)s sessions", {count: this.state.selectedDevices.length}) }
+                { _t("Delete %(count)s sessions", {count: this.state.selectedDevices.length})}
             </AccessibleButton>;
 
         const classes = classNames(this.props.className, "mx_DevicesPanel");

src/components/views/settings/ProfileSettings.js

@@ -170,8 +170,12 @@ export default class ProfileSettings extends React.Component {
                 noValidate={true}
                 className="mx_ProfileSettings_profileForm"
             >
-                <input type="file" ref={this._avatarUpload} className="mx_ProfileSettings_avatarUpload"
+                <input
-                       onChange={this._onAvatarChanged} accept="image/*" />
+                    type="file"
+                    ref={this._avatarUpload} className="mx_ProfileSettings_avatarUpload"
+                    onChange={this._onAvatarChanged}
+                    accept="image/*"
+                />
                 <div className="mx_ProfileSettings_profile">
                     <div className="mx_ProfileSettings_controls">
                         <span className="mx_SettingsTab_subheading">{_t("Profile")}</span>

src/components/views/settings/account/EmailAddresses.js

@@ -90,12 +90,18 @@ export class ExistingEmailAddress extends React.Component {
                     <span className="mx_ExistingEmailAddress_promptText">
                         {_t("Remove %(email)s?", {email: this.props.email.address} )}
                     </span>
-                    <AccessibleButton onClick={this._onActuallyRemove} kind="danger_sm"
+                    <AccessibleButton
-                                      className="mx_ExistingEmailAddress_confirmBtn">
+                        onClick={this._onActuallyRemove}
+                        kind="danger_sm"
+                        className="mx_ExistingEmailAddress_confirmBtn"
+                    >
                         {_t("Remove")}
                     </AccessibleButton>
-                    <AccessibleButton onClick={this._onDontRemove} kind="link_sm"
+                    <AccessibleButton
-                                      className="mx_ExistingEmailAddress_confirmBtn">
+                        onClick={this._onDontRemove}
+                        kind="link_sm"
+                        className="mx_ExistingEmailAddress_confirmBtn"
+                    >
                         {_t("Cancel")}
                     </AccessibleButton>
                 </div>
@@ -230,8 +236,11 @@ export default class EmailAddresses extends React.Component {
             addButton = (
                 <div>
                     <div>{_t("We've sent you an email to verify your address. Please follow the instructions there and then click the button below.")}</div>
-                  <AccessibleButton onClick={this._onContinueClick} kind="primary"
+                    <AccessibleButton
-                                    disabled={this.state.continueDisabled}>
+                        onClick={this._onContinueClick}
+                        kind="primary"
+                        disabled={this.state.continueDisabled}
+                    >
                         {_t("Continue")}
                     </AccessibleButton>
                 </div>
@@ -241,8 +250,12 @@ export default class EmailAddresses extends React.Component {
         return (
             <div className="mx_EmailAddresses">
                 {existingEmailElements}
-                <form onSubmit={this._onAddClick} autoComplete="off"
+                <form
-                      noValidate={true} className="mx_EmailAddresses_new">
+                    onSubmit={this._onAddClick}
+                    autoComplete="off"
+                    noValidate={true}
+                    className="mx_EmailAddresses_new"
+                >
                     <Field
                         type="text"
                         label={_t("Email Address")}

src/components/views/settings/account/PhoneNumbers.js

@@ -85,12 +85,18 @@ export class ExistingPhoneNumber extends React.Component {
                     <span className="mx_ExistingPhoneNumber_promptText">
                         {_t("Remove %(phone)s?", {phone: this.props.msisdn.address})}
                     </span>
-                    <AccessibleButton onClick={this._onActuallyRemove} kind="danger_sm"
+                    <AccessibleButton
-                                      className="mx_ExistingPhoneNumber_confirmBtn">
+                        onClick={this._onActuallyRemove}
+                        kind="danger_sm"
+                        className="mx_ExistingPhoneNumber_confirmBtn"
+                    >
                         {_t("Remove")}
                     </AccessibleButton>
-                    <AccessibleButton onClick={this._onDontRemove} kind="link_sm"
+                    <AccessibleButton
-                                      className="mx_ExistingPhoneNumber_confirmBtn">
+                        onClick={this._onDontRemove}
+                        kind="link_sm"
+                        className="mx_ExistingPhoneNumber_confirmBtn"
+                    >
                         {_t("Cancel")}
                     </AccessibleButton>
                 </div>
@@ -246,8 +252,11 @@ export default class PhoneNumbers extends React.Component {
                             value={this.state.newPhoneNumberCode}
                             onChange={this._onChangeNewPhoneNumberCode}
                         />
-                        <AccessibleButton onClick={this._onContinueClick} kind="primary"
+                        <AccessibleButton
-                                          disabled={this.state.continueDisabled}>
+                            onClick={this._onContinueClick}
+                            kind="primary"
+                            disabled={this.state.continueDisabled}
+                        >
                             {_t("Continue")}
                         </AccessibleButton>
                     </form>

src/components/views/settings/tabs/room/GeneralRoomSettingsTab.js

@@ -80,9 +80,11 @@ export default class GeneralRoomSettingsTab extends React.Component {
             flairSection = <>
                 <span className='mx_SettingsTab_subheading'>{_t("Flair")}</span>
                 <div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'>
-                    <RelatedGroupSettings roomId={room.roomId}
+                    <RelatedGroupSettings
+                        roomId={room.roomId}
                         canSetRelatedGroups={canChangeGroups}
-                                          relatedGroupsEvent={groupsEvent} />
+                        relatedGroupsEvent={groupsEvent}
+                    />
                 </div>
             </>;
         }

src/components/views/settings/tabs/user/GeneralUserSettingsTab.js

@@ -319,8 +319,11 @@ export default class GeneralUserSettingsTab extends React.Component {
         return (
             <div className="mx_SettingsTab_section">
                 <span className="mx_SettingsTab_subheading">{_t("Language and region")}</span>
-                <LanguageDropdown className="mx_GeneralUserSettingsTab_languageInput"
+                <LanguageDropdown
-                                  onOptionChange={this._onLanguageChange} value={this.state.language} />
+                    className="mx_GeneralUserSettingsTab_languageInput"
+                    onOptionChange={this._onLanguageChange}
+                    value={this.state.language}
+                />
             </div>
         );
     }
@@ -329,8 +332,10 @@ export default class GeneralUserSettingsTab extends React.Component {
         return (
             <div className="mx_SettingsTab_section">
                 <span className="mx_SettingsTab_subheading">{_t("Spell check dictionaries")}</span>
-                <SpellCheckSettings languages={this.state.spellCheckLanguages}
+                <SpellCheckSettings
-                                    onLanguagesChange={this._onSpellCheckLanguagesChange} />
+                    languages={this.state.spellCheckLanguages}
+                    onLanguagesChange={this._onSpellCheckLanguagesChange}
+                />
             </div>
         );
     }

src/components/views/settings/tabs/user/SecurityUserSettingsTab.js

@@ -257,8 +257,7 @@ export default class SecurityUserSettingsTab extends React.Component {
 
         if (!ignoredUserIds || ignoredUserIds.length === 0) return null;
 
-        const userIds = ignoredUserIds
+        const userIds = ignoredUserIds.map((u) => <IgnoredUser
-            .map((u) => <IgnoredUser
             userId={u}
             onUnignored={this._onUserUnignored}
             key={u}

src/indexing/EventIndex.js

@@ -127,8 +127,13 @@ export default class EventIndex extends EventEmitter {
                     this.crawlerCheckpoints.push(forwardCheckpoint);
                 }
             } catch (e) {
-                console.log("EventIndex: Error adding initial checkpoints for room",
+                console.log(
-                            room.roomId, backCheckpoint, forwardCheckpoint, e);
+                    "EventIndex: Error adding initial checkpoints for room",
+                    room.roomId,
+                    backCheckpoint,
+                    forwardCheckpoint,
+                    e,
+                );
             }
         }));
     }
@@ -379,8 +384,12 @@ export default class EventIndex extends EventEmitter {
         try {
             await indexManager.addCrawlerCheckpoint(checkpoint);
         } catch (e) {
-            console.log("EventIndex: Error adding new checkpoint for room",
+            console.log(
-                        room.roomId, checkpoint, e);
+                "EventIndex: Error adding new checkpoint for room",
+                room.roomId,
+                checkpoint,
+                e,
+            );
         }
 
         this.crawlerCheckpoints.push(checkpoint);

test/components/views/dialogs/AccessSecretStorageDialog-test.js

@@ -89,10 +89,12 @@ describe("AccessSecretStorageDialog", function() {
             <AccessSecretStorageDialog
                 checkPrivateKey={() => false}
                 onFinished={() => {}}
-              keyInfo={ { passphrase: {
+                keyInfo={{
+                    passphrase: {
                         salt: 'nonempty',
                         iterations: 2,
-              } } }
+                    },
+                }}
             />,
         );
         const e = { target: { value: "a" } };

test/components/views/elements/MemberEventListSummary-test.js

@@ -297,7 +297,8 @@ describe('MemberEventListSummary', function() {
                 "user_1 was unbanned, joined and left 2 times, was banned, " +
             "joined and left 3 times and was invited",
             );
-    });
+        },
+    );
 
     it('handles multiple users following the same sequence of memberships', function() {
         const events = generateEvents([
@@ -445,7 +446,8 @@ describe('MemberEventListSummary', function() {
                 "user_2 was unbanned and joined and left 2 times, user_1 was unbanned, " +
             "joined and left 2 times and was banned",
             );
-    });
+        },
+    );
 
     it('correctly identifies transitions', function() {
         const events = generateEvents([
@@ -601,7 +603,8 @@ describe('MemberEventListSummary', function() {
             expect(summaryText).toBe(
                 "user_1 rejected their invitation 2 times",
             );
-    });
+        },
+    );
 
     it('handles a summary length = 2, with no "others"', function() {
         const events = generateEvents([

test/components/views/rooms/RoomList-test.js

@@ -70,8 +70,9 @@ describe('RoomList', () => {
         root = ReactDOM.render(
             <DragDropContext>
                 <WrappedRoomList searchFilter="" onResize={() => {}} />
-            </DragDropContext>
+            </DragDropContext>,
-        , parentDiv);
+            parentDiv,
+        );
         ReactTestUtils.findRenderedComponentWithType(root, RoomList);
 
         movingRoom = createRoom({name: 'Moving room'});