diff --git a/src/vector/app.js b/src/vector/app.js index b03f5503..12706d90 100644 --- a/src/vector/app.js +++ b/src/vector/app.js @@ -37,10 +37,8 @@ import {parseQs, parseQsFromFragment} from './url_utils'; import {MatrixClientPeg} from 'matrix-react-sdk/src/MatrixClientPeg'; import SdkConfig from "matrix-react-sdk/src/SdkConfig"; -import {setTheme} from "matrix-react-sdk/src/theme"; import CallHandler from 'matrix-react-sdk/src/CallHandler'; -import {loadConfig, preparePlatform, loadLanguage} from "./init"; let lastLocationHashSet = null; @@ -128,7 +126,7 @@ function onTokenLoginCompleted() { window.location.href = formatted; } -export async function loadApp(fragParams: {}, acceptBrowser: boolean, configError: Error) { +export async function loadApp(fragParams: {}, acceptBrowser: boolean, configError: Error|void) { // XXX: the way we pass the path to the worker script from webpack via html in body's dataset is a hack // but alternatives seem to require changing the interface to passing Workers to js-sdk const vectorIndexeddbWorkerScript = document.body.dataset.vectorIndexeddbWorkerScript; @@ -146,14 +144,8 @@ export async function loadApp(fragParams: {}, acceptBrowser: boolean, configErro const platform = PlatformPeg.get(); - // Load language after loading config.json so that settingsDefaults.language can be applied - await loadLanguage(); - const params = parseQs(window.location); - // as quickly as we possibly can, set a default theme... - await setTheme(); - // Now that we've loaded the theme (CSS), display the config syntax error if needed. if (configError && configError.err && configError.err instanceof SyntaxError) { const errorMessage = ( diff --git a/src/vector/index.ts b/src/vector/index.ts index 23dc0470..f95cbc49 100644 --- a/src/vector/index.ts +++ b/src/vector/index.ts @@ -21,8 +21,6 @@ limitations under the License. // 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 -import {loadConfig, preparePlatform} from "./init"; - require('gfm.css/gfm.css'); require('highlight.js/styles/github.css'); @@ -83,7 +81,16 @@ function checkBrowserFeatures() { // try in react but fallback to an `alert` async function start() { // load init.ts async so that its code is not executed immediately and we can catch any exceptions - const {rageshakePromise, preparePlatform, loadOlm, loadSkin, loadApp} = await import( + const { + rageshakePromise, + preparePlatform, + loadOlm, + loadConfig, + loadSkin, + loadLanguage, + loadTheme, + loadApp, + } = await import( /* webpackChunkName: "init" */ /* webpackPreload: true */ "./init"); @@ -110,11 +117,11 @@ async function start() { } } + const loadOlmPromise = loadOlm(); // set the platform for react sdk preparePlatform(); // load config requires the platform to be ready const loadConfigPromise = loadConfig(); - const loadOlmPromise = loadOlm(); await loadSkin(); @@ -123,11 +130,17 @@ async function start() { acceptBrowser = Boolean(window.localStorage.getItem("mx_accepts_unsupported_browser")); } + // await config here + const configError = await loadConfigPromise; + // Load language after loading config.json so that settingsDefaults.language can be applied + const loadLanguagePromise = loadLanguage(); + // as quickly as we possibly can, set a default theme... + const loadThemePromise = loadTheme(); + // await things starting successfully await loadOlmPromise; - - - const configError = await loadConfigPromise; + await loadThemePromise; + await loadLanguagePromise; // Finally, load the app. All of the other react-sdk imports are in this file which causes the skinner to // run on the components. diff --git a/src/vector/init.ts b/src/vector/init.ts index 04c847ff..85f75181 100644 --- a/src/vector/init.ts +++ b/src/vector/init.ts @@ -28,6 +28,7 @@ import ElectronPlatform from "./platform/ElectronPlatform"; 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 { initRageshake } from "./rageshakesetup"; @@ -138,7 +139,11 @@ export async function loadSkin() { console.log("Skin loaded!"); } -export async function loadApp(fragParams: {}, acceptBrowser: boolean, configError: Error) { +export async function loadTheme() { + setTheme(); +} + +export async function loadApp(fragParams: {}, acceptBrowser: boolean, configError: Error|void) { // load app.js async so that its code is not executed immediately and we can catch any exceptions const module = await import( /* webpackChunkName: "riot-web-app" */