refactor dialogs to use more chunks

routes/_components/compose/ComposeBox.html

@@ -113,7 +113,7 @@
   import { store } from '../../_store/store'
   import { slide } from 'svelte-transitions'
   import { postStatus, insertHandleForReply, setReplySpoiler, setReplyVisibility } from '../../_actions/compose'
-  import { importDialogs } from '../../_utils/asyncModules'
+  import { importShowComposeDialog } from '../dialog/dialogs'
   import { classname } from '../../_utils/classname'
 
   export default {
@@ -192,8 +192,8 @@
         if (this.get('sticky')) {
           // when the button is sticky, we're scrolled down the home timeline,
           // so we should launch a new compose dialog
-          let dialogs = await importDialogs()
-          dialogs.showComposeDialog()
+          let showComposeDialog = await importShowComposeDialog()
+          showComposeDialog()
         } else {
           // else we're actually posting a new toot
           this.doPostStatus();

routes/_components/compose/ComposeToolbar.html

@@ -46,10 +46,10 @@
 <script>
   import IconButton from '../IconButton.html'
   import { store } from '../../_store/store'
-  import { importDialogs } from '../../_utils/asyncModules'
   import { doMediaUpload } from '../../_actions/media'
   import { toggleContentWarningShown } from '../../_actions/contentWarnings'
   import ComposeAutosuggest from './ComposeAutosuggest.html'
+  import { importShowPostPrivacyDialog, importShowEmojiDialog } from '../dialog/dialogs'
 
   export default {
     oncreate() {
@@ -70,8 +70,8 @@
     store: () => store,
     methods: {
       async onEmojiClick() {
-        let dialogs = await importDialogs()
-        dialogs.showEmojiDialog(this.get('realm'))
+        let showEmojiDialog = await importShowEmojiDialog()
+        showEmojiDialog(this.get('realm'))
       },
       onMediaClick() {
         this.refs.input.click()
@@ -82,8 +82,8 @@
         doMediaUpload(realm, file)
       },
       async onPostPrivacyClick() {
-        let dialogs = await importDialogs()
-        dialogs.showPostPrivacyDialog(this.get('realm'))
+        let showPostPrivacyDialog = await importShowPostPrivacyDialog()
+        showPostPrivacyDialog(this.get('realm'))
       },
       onContentWarningClick() {
         toggleContentWarningShown(this.get('realm'))

routes/_components/dialog/components/AccountProfileOptionsDialog.html

@@ -10,11 +10,11 @@
 import ModalDialog from './ModalDialog.html'
 import { store } from '../../../_store/store'
 import GenericDialogList from './GenericDialogList.html'
-import { importDialogs } from '../../../_utils/asyncModules'
 import { createDialogId } from '../helpers/createDialogId'
 import { show } from '../helpers/showDialog'
 import { close } from '../helpers/closeDialog'
 import { oncreate } from '../helpers/onCreateDialog'
+import { importShowComposeDialog } from '../dialogs'
 
 export default {
   oncreate,
@@ -41,8 +41,8 @@ export default {
       this.store.setComposeData('dialog', {
         text: `@${account.acct} `
       })
-      let dialogs = await importDialogs()
-      dialogs.showComposeDialog()
+      let showComposeDialog = await importShowComposeDialog()
+      showComposeDialog()
       this.close()
     }
   },

routes/_components/dialog/creators/showAccountProfileOptionsDialog.js

@@ -2,7 +2,7 @@ import AccountProfileOptionsDialog from '../components/AccountProfileOptionsDial
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showAccountProfileOptionsDialog (account) {
+export default function showAccountProfileOptionsDialog (account) {
   let dialog = new AccountProfileOptionsDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showComposeDialog.js

@@ -2,7 +2,7 @@ import ComposeDialog from '../components/ComposeDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showComposeDialog () {
+export default function showComposeDialog () {
   let dialog = new ComposeDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showConfirmationDialog.js

@@ -2,7 +2,7 @@ import ConfirmationDialog from '../components/ConfirmationDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showConfirmationDialog (options) {
+export default function showConfirmationDialog (options) {
   let dialog = new ConfirmationDialog({
     target: createDialogElement(),
     data: Object.assign({

routes/_components/dialog/creators/showEmojiDialog.js

@@ -2,7 +2,7 @@ import EmojiDialog from '../components/EmojiDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showEmojiDialog (realm) {
+export default function showEmojiDialog (realm) {
   let emojiDialog = new EmojiDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showImageDialog.js

@@ -2,7 +2,7 @@ import ImageDialog from '../components/ImageDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showImageDialog (poster, src, type, width, height, description) {
+export default function showImageDialog (poster, src, type, width, height, description) {
   let imageDialog = new ImageDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showPostPrivacyDialog.js

@@ -2,7 +2,7 @@ import PostPrivacyDialog from '../components/PostPrivacyDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showPostPrivacyDialog (realm) {
+export default function showPostPrivacyDialog (realm) {
   let dialog = new PostPrivacyDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showStatusOptionsDialog.js

@@ -2,7 +2,7 @@ import StatusOptionsDialog from '../components/StatusOptionsDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showStatusOptionsDialog (statusId) {
+export default function showStatusOptionsDialog (statusId) {
   let dialog = new StatusOptionsDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/creators/showVideoDialog.js

@@ -2,7 +2,7 @@ import VideoDialog from '../components/VideoDialog.html'
 import { createDialogElement } from '../helpers/createDialogElement'
 import { createDialogId } from '../helpers/createDialogId'
 
-export function showVideoDialog (poster, src, width, height, description) {
+export default function showVideoDialog (poster, src, width, height, description) {
   let videoDialog = new VideoDialog({
     target: createDialogElement(),
     data: {

routes/_components/dialog/dialogs.js

@@ -1,8 +1,55 @@
-export * from './creators/showConfirmationDialog'
-export * from './creators/showImageDialog'
-export * from './creators/showVideoDialog'
-export * from './creators/showEmojiDialog'
-export * from './creators/showPostPrivacyDialog'
-export * from './creators/showStatusOptionsDialog'
-export * from './creators/showComposeDialog'
-export * from './creators/showAccountProfileOptionsDialog'
+export async function importShowAccountProfileOptionsDialog () {
+  return (await import(
+    /* webpackChunkName: 'showAccountProfileOptionsDialog.js' */
+    './creators/showAccountProfileOptionsDialog.js'
+  )).default
+}
+
+export async function importShowComposeDialog () {
+  return (await import(
+    /* webpackChunkName: 'showComposeDialog.js' */
+    './creators/showComposeDialog.js'
+  )).default
+}
+
+export async function importShowConfirmationDialog () {
+  return (await import(
+    /* webpackChunkName: 'showConfirmationDialog.js' */
+    './creators/showConfirmationDialog.js'
+  )).default
+}
+
+export async function importShowEmojiDialog () {
+  return (await import(
+    /* webpackChunkName: 'showEmojiDialog.js' */
+    './creators/showEmojiDialog.js'
+  )).default
+}
+
+export async function importShowImageDialog () {
+  return (await import(
+    /* webpackChunkName: 'showImageDialog.js' */
+    './creators/showImageDialog.js'
+  )).default
+}
+
+export async function importShowPostPrivacyDialog () {
+  return (await import(
+    /* webpackChunkName: 'showPostPrivacyDialog.js' */
+    './creators/showPostPrivacyDialog.js'
+  )).default
+}
+
+export async function importShowStatusOptionsDialog () {
+  return (await import(
+    /* webpackChunkName: 'showStatusOptionsDialog.js' */
+    './creators/showStatusOptionsDialog.js'
+  )).default
+}
+
+export async function importShowVideoDialog () {
+  return (await import(
+    /* webpackChunkName: 'showVideoDialog.js' */
+    './creators/showVideoDialog.js'
+  )).default
+}

routes/_components/profile/AccountProfileDetails.html

@@ -103,7 +103,7 @@
 </style>
 <script>
   import IconButton from '../IconButton.html'
-  import { importDialogs } from '../../_utils/asyncModules'
+  import { importShowAccountProfileOptionsDialog } from '../dialog/dialogs'
 
   const numberFormat = new Intl.NumberFormat('en-US')
 
@@ -119,8 +119,8 @@
     methods: {
       async onMoreOptionsClick() {
         let account = this.get('account')
-        let dialogs = await importDialogs()
-        dialogs.showAccountProfileOptionsDialog(account)
+        let showAccountProfileOptionsDialog = await importShowAccountProfileOptionsDialog()
+        showAccountProfileOptionsDialog(account)
       }
     },
     components: {

routes/_components/status/Media.html

@@ -99,7 +99,6 @@
 </style>
 <script>
   import { DEFAULT_MEDIA_WIDTH, DEFAULT_MEDIA_HEIGHT } from '../../_static/media'
-  import { importDialogs } from '../../_utils/asyncModules'
   import { mouseover } from '../../_utils/events'
   import NonAutoplayGifv from '../NonAutoplayGifv.html'
   import PlayVideoIcon from '../PlayVideoIcon.html'
@@ -108,6 +107,7 @@
   import LazyImage from '../LazyImage.html'
   import AutoplayVideo from '../AutoplayVideo.html'
   import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate'
+  import { importShowImageDialog, importShowVideoDialog } from '../dialog/dialogs'
 
   export default {
     oncreate() {
@@ -144,15 +144,15 @@
         let media = this.get('media')
         let width = this.get('modalWidth')
         let height = this.get('modalHeight')
-        let dialogs = await importDialogs()
-        dialogs.showVideoDialog(media.preview_url, media.url, width, height, media.description)
+        let showVideoDialog = await importShowVideoDialog()
+        showVideoDialog(media.preview_url, media.url, width, height, media.description)
       },
       async onClickShowImageButton() {
         let media = this.get('media')
         let width = this.get('modalWidth')
         let height = this.get('modalHeight')
-        let dialogs = await importDialogs()
-        dialogs.showImageDialog(media.preview_url, media.url, media.type, width, height, media.description)
+        let showImageDialog = await importShowImageDialog()
+        showImageDialog(media.preview_url, media.url, media.type, width, height, media.description)
       }
     },
     data: () => ({

routes/_components/status/StatusToolbar.html

@@ -47,10 +47,10 @@
   import { registerClickDelegate, unregisterClickDelegate } from '../../_utils/delegate'
   import { setFavorited } from '../../_actions/favorite'
   import { setReblogged } from '../../_actions/reblog'
-  import { importDialogs } from '../../_utils/asyncModules'
   import { updateProfileAndRelationship } from '../../_actions/accounts'
   import { FAVORITE_ANIMATION, REBLOG_ANIMATION } from '../../_static/animations'
   import { on } from '../../_utils/eventBus'
+  import { importShowStatusOptionsDialog } from '../dialog/dialogs'
 
   export default {
     oncreate() {
@@ -104,9 +104,10 @@
         let originalStatusId = this.get('originalStatusId')
         let originalAccountId = this.get('originalAccountId')
         let updateRelationshipPromise = updateProfileAndRelationship(originalAccountId)
-        let dialogs = await importDialogs()
+        let dialogPromise = importShowStatusOptionsDialog()
         await updateRelationshipPromise
-        dialogs.showStatusOptionsDialog(originalStatusId)
+        let showStatusOptionsDialog = await dialogPromise
+        showStatusOptionsDialog(originalStatusId)
       },
       onPostedStatus(realm, inReplyToUuid) {
         if (realm !== this.get('originalStatusId') ||

routes/_pages/settings/instances/[instanceName].html

@@ -95,7 +95,6 @@
   import SettingsLayout from '../../../_components/settings/SettingsLayout.html'
   import ExternalLink from '../../../_components/ExternalLink.html'
   import Avatar from '../../../_components/Avatar.html'
-  import { importDialogs } from '../../../_utils/asyncModules'
   import {
     changeTheme,
     switchToInstance,
@@ -103,6 +102,7 @@
     updateVerifyCredentialsForInstance
   } from '../../../_actions/instances'
   import { themes } from '../../../_static/themes'
+  import { importShowConfirmationDialog } from '../../../_components/dialog/dialogs'
 
   export default {
     components: {
@@ -138,8 +138,8 @@
         e.preventDefault()
         let instanceName = this.get('instanceName')
 
-        let dialogs = await importDialogs()
-        dialogs.showConfirmationDialog({
+        let showConfirmationDialog = await importShowConfirmationDialog()
+        showConfirmationDialog({
           text: `Log out of ${instanceName}?`,
           onPositive() {
             logOutOfInstance(instanceName)

routes/_utils/asyncModules.js

@@ -24,8 +24,4 @@ export const importWebSocketClient = () => import(
 
 export const importPseudoVirtualList = () => import(
   /* webpackChunkName: 'PseudoVirtualList' */ '../_components/pseudoVirtualList/PseudoVirtualList.html'
-  ).then(mod => mod.default)
-
-export const importDialogs = () => import(
-  /* webpackChunkName: 'dialogs' */ '../_components/dialog/dialogs.js'
-  )
+  ).then(mod => mod.default)