Fix imports to work with new lint rules (#19532)

* Add eslint-plugin-import

Signed-off-by: Aaron Raimist <aaron@raim.ist>

* Autofix + move comments manually

Signed-off-by: Aaron Raimist <aaron@raim.ist>

* Manual fix

Signed-off-by: Aaron Raimist <aaron@raim.ist>

package.json

@@ -57,6 +57,7 @@
   "dependencies": {
     "@matrix-org/olm": "https://gitlab.matrix.org/api/v4/projects/27/packages/npm/@matrix-org/olm/-/@matrix-org/olm-3.2.3.tgz",
     "browser-request": "^0.3.3",
+    "eslint-plugin-import": "^2.25.2",
     "gfm.css": "^1.1.2",
     "jsrsasign": "^10.2.0",
     "katex": "^0.12.0",

src/vector/app.tsx

@@ -19,23 +19,23 @@ limitations under the License.
 */
 
 import React from 'react';
-// add React and ReactPerf to the global namespace, to make them easier to access via the console
-// this incidentally means we can forget our React imports in JSX files without penalty.
-window.React = React;
-
 import * as sdk from 'matrix-react-sdk';
 import PlatformPeg from 'matrix-react-sdk/src/PlatformPeg';
 import { _td, newTranslatableError } from 'matrix-react-sdk/src/languageHandler';
 import AutoDiscoveryUtils from 'matrix-react-sdk/src/utils/AutoDiscoveryUtils';
 import { AutoDiscovery } from "matrix-js-sdk/src/autodiscovery";
 import * as Lifecycle from "matrix-react-sdk/src/Lifecycle";
-import type MatrixChatType from "matrix-react-sdk/src/components/structures/MatrixChat";
 import SdkConfig, { parseSsoRedirectOptions } from "matrix-react-sdk/src/SdkConfig";
 import { logger } from "matrix-js-sdk/src/logger";
+import { createClient } from "matrix-js-sdk/src/matrix";
 
+import type MatrixChatType from "matrix-react-sdk/src/components/structures/MatrixChat";
 import { parseQs, parseQsFromFragment } from './url_utils';
 import VectorBasePlatform from "./platform/VectorBasePlatform";
-import { createClient } from "matrix-js-sdk/src/matrix";
+
+// add React and ReactPerf to the global namespace, to make them easier to access via the console
+// this incidentally means we can forget our React imports in JSX files without penalty.
+window.React = React;
 
 let lastLocationHashSet: string = null;
 

src/vector/index.ts

@@ -18,6 +18,12 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+import { logger } from "matrix-js-sdk/src/logger";
+
+// These are things that can run before the skin loads - be careful not to reference the react-sdk though.
+import { parseQsFromFragment } from "./url_utils";
+import './modernizr';
+
 // Require common CSS here; this will make webpack process it into bundle.css.
 // Our own CSS (which is themed) is imported via separate webpack entry points
 // in webpack.config.js
@@ -33,11 +39,6 @@ require('katex/dist/katex.css');
  */
 require('./devcss');
 require('./localstorage-fix');
-// These are things that can run before the skin loads - be careful not to reference the react-sdk though.
-import { parseQsFromFragment } from "./url_utils";
-import './modernizr';
-
-import { logger } from "matrix-js-sdk/src/logger";
 
 async function settled(...promises: Array<Promise<any>>) {
     for (const prom of promises) {

src/vector/init.tsx

@@ -23,20 +23,18 @@ import olmWasmPath from "@matrix-org/olm/olm.wasm";
 import Olm from '@matrix-org/olm';
 import * as ReactDOM from "react-dom";
 import * as React from "react";
-
 import * as languageHandler from "matrix-react-sdk/src/languageHandler";
 import SettingsStore from "matrix-react-sdk/src/settings/SettingsStore";
-import ElectronPlatform from "./platform/ElectronPlatform";
-import PWAPlatform from "./platform/PWAPlatform";
-import WebPlatform from "./platform/WebPlatform";
 import PlatformPeg from "matrix-react-sdk/src/PlatformPeg";
 import SdkConfig from "matrix-react-sdk/src/SdkConfig";
 import { setTheme } from "matrix-react-sdk/src/theme";
+import { logger } from "matrix-js-sdk/src/logger";
 
+import ElectronPlatform from "./platform/ElectronPlatform";
+import PWAPlatform from "./platform/PWAPlatform";
+import WebPlatform from "./platform/WebPlatform";
 import { initRageshake, initRageshakeStore } from "./rageshakesetup";
 
-import { logger } from "matrix-js-sdk/src/logger";
-
 export const rageshakePromise = initRageshake();
 
 export function preparePlatform() {

src/vector/jitsi/index.ts

@@ -14,9 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-// We have to trick webpack into loading our CSS for us.
-require("./index.scss");
-
 import { KJUR } from 'jsrsasign';
 import {
     IOpenIDCredentials,
@@ -25,9 +22,11 @@ import {
     WidgetApi,
 } from "matrix-widget-api";
 import { ElementWidgetActions } from "matrix-react-sdk/src/stores/widgets/ElementWidgetActions";
-
 import { logger } from "matrix-js-sdk/src/logger";
 
+// We have to trick webpack into loading our CSS for us.
+require("./index.scss");
+
 const JITSI_OPENIDTOKEN_JWT_AUTH = 'openidtoken-jwt';
 
 // Dev note: we use raw JS without many dependencies to reduce bundle size.

src/vector/mobile_guide/index.ts

@@ -1,7 +1,7 @@
-import { getVectorConfig } from '../getconfig';
-
 import { logger } from "matrix-js-sdk/src/logger";
 
+import { getVectorConfig } from '../getconfig';
+
 function onBackToElementClick(): void {
     // Cookie should expire in 4 hours
     document.cookie = 'element_mobile_redirect_to_guide=false;path=/;max-age=14400';

src/vector/platform/PWAPlatform.ts

@@ -14,10 +14,10 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import WebPlatform from "./WebPlatform";
-
 import { logger } from "matrix-js-sdk/src/logger";
 
+import WebPlatform from "./WebPlatform";
+
 export default class PWAPlatform extends WebPlatform {
     setNotificationCount(count: number) {
         if (!navigator.setAppBadge) return super.setNotificationCount(count);

src/vector/platform/VectorBasePlatform.ts

@@ -19,8 +19,8 @@ limitations under the License.
 
 import BasePlatform from 'matrix-react-sdk/src/BasePlatform';
 import { _t } from 'matrix-react-sdk/src/languageHandler';
-import { getVectorConfig } from "../getconfig";
 
+import { getVectorConfig } from "../getconfig";
 import Favicon from "../../favicon";
 
 /**

src/vector/platform/WebPlatform.ts

@@ -16,7 +16,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import VectorBasePlatform from './VectorBasePlatform';
 import { UpdateCheckStatus } from "matrix-react-sdk/src/BasePlatform";
 import request from 'browser-request';
 import dis from 'matrix-react-sdk/src/dispatcher/dispatcher';
@@ -25,11 +24,11 @@ import { Room } from "matrix-js-sdk/src/models/room";
 import { hideToast as hideUpdateToast, showToast as showUpdateToast } from "matrix-react-sdk/src/toasts/UpdateToast";
 import { Action } from "matrix-react-sdk/src/dispatcher/actions";
 import { CheckUpdatesPayload } from 'matrix-react-sdk/src/dispatcher/payloads/CheckUpdatesPayload';
-
 import UAParser from 'ua-parser-js';
-
 import { logger } from "matrix-js-sdk/src/logger";
 
+import VectorBasePlatform from './VectorBasePlatform';
+
 const POKE_RATE_MS = 10 * 60 * 1000; // 10 min
 
 export default class WebPlatform extends VectorBasePlatform {

src/vector/rageshakesetup.ts

@@ -29,7 +29,6 @@ limitations under the License.
 import * as rageshake from "matrix-react-sdk/src/rageshake/rageshake";
 import SdkConfig from "matrix-react-sdk/src/SdkConfig";
 import sendBugReport from "matrix-react-sdk/src/rageshake/submit-rageshake";
-
 import { logger } from "matrix-js-sdk/src/logger";
 
 export function initRageshake() {