Merge remote-tracking branch 'origin/develop' into migrate/vuex-to-pinia

src/main.js

@@ -6,16 +6,27 @@ import './lib/event_target_polyfill.js'
 
 import instanceModule from './modules/instance.js'
 import statusesModule from './modules/statuses.js'
+import notificationsModule from './modules/notifications.js'
+import listsModule from './modules/lists.js'
 import usersModule from './modules/users.js'
 import apiModule from './modules/api.js'
 import configModule from './modules/config.js'
-import serverSideConfigModule from './modules/serverSideConfig.js'
+import profileConfigModule from './modules/profileConfig.js'
 import serverSideStorageModule from './modules/serverSideStorage.js'
+import adminSettingsModule from './modules/adminSettings.js'
+import shoutModule from './modules/shout.js'
 import oauthModule from './modules/oauth.js'
 import authFlowModule from './modules/auth_flow.js'
 import oauthTokensModule from './modules/oauth_tokens.js'
-
+import reportsModule from './modules/reports.js'
+import pollsModule from './modules/polls.js'
+import postStatusModule from './modules/postStatus.js'
+import editStatusModule from './modules/editStatus.js'
+import statusHistoryModule from './modules/statusHistory.js'
+import draftsModule from './modules/drafts.js'
 import chatsModule from './modules/chats.js'
+import announcementsModule from './modules/announcements.js'
+import bookmarkFoldersModule from './modules/bookmark_folders.js'
 
 import { createI18n } from 'vue-i18n'
 
@@ -35,7 +46,7 @@ const i18n = createI18n({
   messages: messages.default
 })
 
-messages.setLanguage(i18n, currentLocale)
+messages.setLanguage(i18n.global, currentLocale)
 
 const persistedStateOptions = {
   paths: [
@@ -47,42 +58,78 @@ const persistedStateOptions = {
 };
 
 (async () => {
-  let storageError = false
-  const plugins = [pushNotifications]
-  const pinia = createPinia()
-  try {
-    const persistedState = await createPersistedState(persistedStateOptions)
-    plugins.push(persistedState)
-  } catch (e) {
-    console.error(e)
-    storageError = true
+  const isFox = Math.floor(Math.random() * 2) > 0 ? '_fox' : ''
+
+  const splashError = (i18n, e) => {
+    const throbber = document.querySelector('#throbber')
+    throbber.addEventListener('animationend', () => {
+      document.querySelector('#mascot').src = `/static/pleromatan_orz${isFox}.png`
+    })
+    throbber.classList.add('dead')
+    document.querySelector('#status').textContent = i18n.global.t('splash.error')
+    console.error('PleromaFE failed to initialize: ', e)
+    document.querySelector('#statusError').textContent = e
+    document.querySelector('#statusStack').textContent = e.stack
+    document.querySelector('#statusError').style = 'display: block'
+    document.querySelector('#statusStack').style = 'display: block'
   }
 
-  // Temporarily storing as a global variable while we migrate to Pinia
-  window.vuex = createStore({
-    modules: {
-      instance: instanceModule,
-      // TODO refactor users/statuses modules, they depend on each other
-      users: usersModule,
-      statuses: statusesModule,
-      api: apiModule,
-      config: configModule,
-      serverSideConfig: serverSideConfigModule,
-      serverSideStorage: serverSideStorageModule,
-      oauth: oauthModule,
-      authFlow: authFlowModule,
-      oauthTokens: oauthTokensModule,
-      chats: chatsModule
-    },
-    plugins,
-    strict: false // Socket modifies itself, let's ignore this for now.
-    // strict: process.env.NODE_ENV !== 'production'
-  })
+  window.splashError = e => splashError(i18n, e)
+  window.splashUpdate = key => {
+    if (document.querySelector('#status')) {
+      document.querySelector('#status').textContent = i18n.global.t(key)
+    }
+  }
 
-  const store = window.vuex
-
-  // Temporarily passing pinia and vuex stores along with storageError result until migration is fully complete.
-  afterStoreSetup({ pinia, store, storageError, i18n })
+  try {
+    let storageError
+    const plugins = [pushNotifications]
+    const pinia = createPinia()
+    try {
+      const persistedState = await createPersistedState(persistedStateOptions)
+      plugins.push(persistedState)
+    } catch (e) {
+      console.error('Storage error', e)
+      storageError = e
+    }
+    document.querySelector('#mascot').src = `/static/pleromatan_apology${isFox}.png`
+    document.querySelector('#status').removeAttribute('class')
+    document.querySelector('#status').textContent = i18n.global.t('splash.loading')
+    document.querySelector('#splash-credit').textContent = i18n.global.t('update.art_by', { linkToArtist: 'pipivovott' })
+    const store = createStore({
+      modules: {
+        instance: instanceModule,
+        // TODO refactor users/statuses modules, they depend on each other
+        users: usersModule,
+        statuses: statusesModule,
+        notifications: notificationsModule,
+        api: apiModule,
+        config: configModule,
+        profileConfig: profileConfigModule,
+        serverSideStorage: serverSideStorageModule,
+        adminSettings: adminSettingsModule,
+        oauth: oauthModule,
+        authFlow: authFlowModule,
+        oauthTokens: oauthTokensModule,
+        drafts: draftsModule,
+        chats: chatsModule,
+        bookmarkFolders: bookmarkFoldersModule
+      },
+      plugins,
+      options: {
+        devtools: process.env.NODE_ENV !== 'production'
+      },
+      strict: false // Socket modifies itself, let's ignore this for now.
+      // strict: process.env.NODE_ENV !== 'production'
+    })
+    if (storageError) {
+      // Temporarily passing pinia and vuex stores along with storageError result until migration is fully complete.
+      store.dispatch('pushGlobalNotice', { messageKey: 'errors.storage_unavailable', level: 'error' })
+    }
+    return await afterStoreSetup({ pinia, store, storageError, i18n })
+  } catch (e) {
+    splashError(i18n, e)
+  }
 })()
 
 // These are inlined by webpack's DefinePlugin