cleanup dynamic/static import warnings

src/boot/routes.js

@@ -10,11 +10,9 @@ import DMs from 'components/dm_timeline/dm_timeline.vue'
 import Drafts from 'components/drafts/drafts.vue'
 import FollowRequests from 'components/follow_requests/follow_requests.vue'
 import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue'
-import Interactions from 'components/interactions/interactions.vue'
 import Lists from 'components/lists/lists.vue'
 import ListsEdit from 'components/lists_edit/lists_edit.vue'
 import ListsTimeline from 'components/lists_timeline/lists_timeline.vue'
-import Notifications from 'components/notifications/notifications.vue'
 import OAuthCallback from 'components/oauth_callback/oauth_callback.vue'
 import PasswordReset from 'components/password_reset/password_reset.vue'
 import PublicAndExternalTimeline from 'components/public_and_external_timeline/public_and_external_timeline.vue'
@@ -24,8 +22,8 @@ import RemoteUserResolver from 'components/remote_user_resolver/remote_user_reso
 import Search from 'components/search/search.vue'
 import ShoutPanel from 'components/shout_panel/shout_panel.vue'
 import TagTimeline from 'components/tag_timeline/tag_timeline.vue'
-import UserProfile from 'components/user_profile/user_profile.vue'
 import WhoToFollow from 'components/who_to_follow/who_to_follow.vue'
+import { defineAsyncComponent } from 'vue'
 
 import NavPanel from 'src/components/nav_panel/nav_panel.vue'
 import BookmarkFolderEdit from '../components/bookmark_folder_edit/bookmark_folder_edit.vue'
@@ -100,12 +98,16 @@ export default (store) => {
     {
       name: 'external-user-profile',
       path: '/users/$:id',
-      component: UserProfile,
+      component: defineAsyncComponent(
+        () => import('src/components/user_profile/user_profile.vue'),
+      ),
     },
     {
       name: 'interactions',
       path: '/users/:username/interactions',
-      component: Interactions,
+      component: defineAsyncComponent(
+        () => import('src/components/interactions/interactions.vue'),
+      ),
       beforeEnter: validateAuthenticatedRoute,
     },
     {
@@ -135,7 +137,9 @@ export default (store) => {
     {
       name: 'notifications',
       path: '/:username/notifications',
-      component: Notifications,
+      component: defineAsyncComponent(
+        () => import('src/components/notifications/notifications.vue'),
+      ),
       props: () => ({ disableTeleport: true }),
       beforeEnter: validateAuthenticatedRoute,
     },
@@ -171,8 +175,20 @@ export default (store) => {
       component: AnnouncementsPage,
     },
     { name: 'drafts', path: '/drafts', component: Drafts },
-    { name: 'user-profile', path: '/users/:name', component: UserProfile },
-    { name: 'legacy-user-profile', path: '/:name', component: UserProfile },
+    {
+      name: 'user-profile',
+      path: '/users/:name',
+      component: defineAsyncComponent(
+        () => import('src/components/user_profile/user_profile.vue'),
+      ),
+    },
+    {
+      name: 'legacy-user-profile',
+      path: '/:name',
+      component: defineAsyncComponent(
+        () => import('src/components/user_profile/user_profile.vue'),
+      ),
+    },
     { name: 'lists', path: '/lists', component: Lists },
     { name: 'lists-timeline', path: '/lists/:id', component: ListsTimeline },
     { name: 'lists-edit', path: '/lists/:id/edit', component: ListsEdit },

src/components/chat_message/chat_message.js

@@ -1,14 +1,14 @@
 import { mapState as mapPiniaState } from 'pinia'
-import { defineAsyncComponent } from 'vue'
 import { mapGetters, mapState } from 'vuex'
 
-import Attachment from '../attachment/attachment.vue'
-import ChatMessageDate from '../chat_message_date/chat_message_date.vue'
-import Gallery from '../gallery/gallery.vue'
-import LinkPreview from '../link-preview/link-preview.vue'
-import Popover from '../popover/popover.vue'
-import StatusContent from '../status_content/status_content.vue'
-import UserAvatar from '../user_avatar/user_avatar.vue'
+import Attachment from 'src/components/attachment/attachment.vue'
+import ChatMessageDate from 'src/components/chat_message_date/chat_message_date.vue'
+import Gallery from 'src/components/gallery/gallery.vue'
+import LinkPreview from 'src/components/link-preview/link-preview.vue'
+import Popover from 'src/components/popover/popover.vue'
+import StatusContent from 'src/components/status_content/status_content.vue'
+import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
+import UserPopover from 'src/components/user_popover/user_popover.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface'
@@ -37,9 +37,7 @@ const ChatMessage = {
     Gallery,
     LinkPreview,
     ChatMessageDate,
-    UserPopover: defineAsyncComponent(
-      () => import('../user_popover/user_popover.vue'),
-    ),
+    UserPopover,
   },
   computed: {
     // Returns HH:MM (hours and minutes) in local time.

src/components/chat_title/chat_title.js

@@ -1,7 +1,8 @@
 import { defineAsyncComponent } from 'vue'
 
 import RichContent from 'src/components/rich_content/rich_content.jsx'
-import UserAvatar from '../user_avatar/user_avatar.vue'
+import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
+import UserPopover from 'src/components/user_popover/user_popover.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 
@@ -10,9 +11,7 @@ export default {
   components: {
     UserAvatar,
     RichContent,
-    UserPopover: defineAsyncComponent(
-      () => import('../user_popover/user_popover.vue'),
-    ),
+    UserPopover,
   },
   props: ['user', 'withAvatar'],
   computed: {

src/components/mention_link/mention_link.js

@@ -2,12 +2,13 @@ import { mapState as mapPiniaState } from 'pinia'
 import { defineAsyncComponent } from 'vue'
 import { mapGetters, mapState } from 'vuex'
 
+import UnicodeDomainIndicator from 'src/components/unicode_domain_indicator/unicode_domain_indicator.vue'
+import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
+import UserPopover from 'src/components/user_popover/user_popover.vue'
 import {
   highlightClass,
   highlightStyle,
 } from '../../services/user_highlighter/user_highlighter.js'
-import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
-import UserAvatar from '../user_avatar/user_avatar.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
@@ -24,9 +25,7 @@ const MentionLink = {
   components: {
     UserAvatar,
     UnicodeDomainIndicator,
-    UserPopover: defineAsyncComponent(
-      () => import('../user_popover/user_popover.vue'),
-    ),
+    UserPopover,
   },
   props: {
     url: {

src/components/mobile_nav/mobile_nav.js

@@ -1,15 +1,15 @@
 import { mapState } from 'pinia'
+import { defineAsyncComponent } from 'vue'
 import { mapGetters } from 'vuex'
 
+import ConfirmModal from 'src/components/confirm_modal/confirm_modal.vue'
 import NavigationPins from 'src/components/navigation/navigation_pins.vue'
+import SideDrawer from 'src/components/side_drawer/side_drawer.vue'
 import GestureService from '../../services/gesture_service/gesture_service'
 import {
   countExtraNotifications,
   unseenNotificationsFromStore,
 } from '../../services/notification_utils/notification_utils'
-import ConfirmModal from '../confirm_modal/confirm_modal.vue'
-import Notifications from '../notifications/notifications.vue'
-import SideDrawer from '../side_drawer/side_drawer.vue'
 
 import { useAnnouncementsStore } from 'src/stores/announcements.js'
 import { useInstanceStore } from 'src/stores/instance.js'
@@ -30,7 +30,9 @@ library.add(faTimes, faBell, faBars, faArrowUp, faMinus, faCheckDouble)
 const MobileNav = {
   components: {
     SideDrawer,
-    Notifications,
+    Notifications: defineAsyncComponent(
+      () => import('src/components/notifications/notifications.vue'),
+    ),
     NavigationPins,
     ConfirmModal,
   },

src/components/notification/notification.js

@@ -12,7 +12,6 @@ import Status from '../status/status.vue'
 import StatusContent from '../status_content/status_content.vue'
 import Timeago from '../timeago/timeago.vue'
 import UserAvatar from '../user_avatar/user_avatar.vue'
-import UserCard from '../user_card/user_card.vue'
 import UserLink from '../user_link/user_link.vue'
 import UserPopover from '../user_popover/user_popover.vue'
 
@@ -64,7 +63,6 @@ const Notification = {
   components: {
     StatusContent,
     UserAvatar,
-    UserCard,
     Timeago,
     Status,
     Report,

src/components/post_status_form/post_status_form.js

@@ -2,23 +2,23 @@ import { debounce, map, reject, uniqBy } from 'lodash'
 import { mapActions, mapState } from 'pinia'
 import { mapGetters } from 'vuex'
 
+import Attachment from 'src/components/attachment/attachment.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
 import DraftCloser from 'src/components/draft_closer/draft_closer.vue'
+import EmojiInput from 'src/components/emoji_input/emoji_input.vue'
+import suggestor from 'src/components/emoji_input/suggestor.js'
 import Gallery from 'src/components/gallery/gallery.vue'
+import MediaUpload from 'src/components/media_upload/media_upload.vue'
+import PollForm from 'src/components/poll/poll_form.vue'
 import Popover from 'src/components/popover/popover.vue'
+import QuoteForm from 'src/components/quote/quote_form.vue'
+import ScopeSelector from 'src/components/scope_selector/scope_selector.vue'
+import Select from 'src/components/select/select.vue'
+import StatusContent from 'src/components/status_content/status_content.vue'
 import { propsToNative } from '../../services/attributes_helper/attributes_helper.service.js'
 import { findOffset } from '../../services/offset_finder/offset_finder.service.js'
 import genRandomSeed from '../../services/random_seed/random_seed.service.js'
 import statusPoster from '../../services/status_poster/status_poster.service.js'
-import Attachment from '../attachment/attachment.vue'
-import Checkbox from '../checkbox/checkbox.vue'
-import EmojiInput from '../emoji_input/emoji_input.vue'
-import suggestor from '../emoji_input/suggestor.js'
-import MediaUpload from '../media_upload/media_upload.vue'
-import PollForm from '../poll/poll_form.vue'
-import QuoteForm from '../quote/quote_form.vue'
-import ScopeSelector from '../scope_selector/scope_selector.vue'
-import Select from '../select/select.vue'
-import StatusContent from '../status_content/status_content.vue'
 
 import { useEmojiStore } from 'src/stores/emoji.js'
 import { useInstanceStore } from 'src/stores/instance.js'

src/components/quote/quote.js

@@ -7,7 +7,10 @@ library.add(faCircleNotch)
 
 export default {
   components: {
-    Status: defineAsyncComponent(() => import('../status/status.vue')),
+    // Quote and Status depend on each other, dynamic import to break this circular dependency
+    Status: defineAsyncComponent(
+      () => import('src/components/status/status.vue'),
+    ),
   },
   name: 'Quote',
   props: {

src/components/side_drawer/side_drawer.js

@@ -1,10 +1,10 @@
 import { mapActions, mapState } from 'pinia'
+import { defineAsyncComponent } from 'vue'
 import { mapGetters } from 'vuex'
 
 import { USERNAME_ROUTES } from 'src/components/navigation/navigation.js'
 import GestureService from '../../services/gesture_service/gesture_service'
 import { unseenNotificationsFromStore } from '../../services/notification_utils/notification_utils'
-import UserCard from '../user_card/user_card.vue'
 
 import { useAnnouncementsStore } from 'src/stores/announcements'
 import { useInstanceStore } from 'src/stores/instance.js'
@@ -64,7 +64,11 @@ const SideDrawer = {
       this.$store.dispatch('startFetchingFollowRequests')
     }
   },
-  components: { UserCard },
+  components: {
+    UserCard: defineAsyncComponent(
+      () => import('src/components/user_card/user_card.vue'),
+    ),
+  },
   computed: {
     currentUser() {
       return this.$store.state.users.currentUser

src/components/status_popover/status_popover.js

@@ -1,6 +1,8 @@
 import { find } from 'lodash'
 import { defineAsyncComponent } from 'vue'
 
+import Popover from 'src/components/popover/popover.vue'
+
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
 
@@ -20,8 +22,10 @@ const StatusPopover = {
     },
   },
   components: {
-    Status: defineAsyncComponent(() => import('../status/status.vue')),
-    Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
+    Status: defineAsyncComponent(
+      () => import('src/components/status/status.vue'),
+    ),
+    Popover,
   },
   methods: {
     enter() {

src/components/user_list_popover/user_list_popover.js

@@ -1,6 +1,8 @@
 import { defineAsyncComponent } from 'vue'
 
+import Popover from 'src/components/popover/popover.vue'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
+import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
 import UnicodeDomainIndicator from '../unicode_domain_indicator/unicode_domain_indicator.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
@@ -19,10 +21,8 @@ const UserListPopover = {
   components: {
     RichContent,
     UnicodeDomainIndicator,
-    Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
-    UserAvatar: defineAsyncComponent(
-      () => import('../user_avatar/user_avatar.vue'),
-    ),
+    Popover,
+    UserAvatar,
   },
   computed: {
     usersCapped() {

src/components/user_panel/user_panel.js

@@ -1,8 +1,8 @@
+import { defineAsyncComponent } from 'vue'
 import { mapState } from 'vuex'
 
-import AuthForm from '../auth_form/auth_form.js'
-import PostStatusForm from '../post_status_form/post_status_form.vue'
-import UserCard from '../user_card/user_card.vue'
+import AuthForm from 'src/components/auth_form/auth_form.js'
+import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'
 
 const UserPanel = {
   computed: {
@@ -14,7 +14,9 @@ const UserPanel = {
   components: {
     AuthForm,
     PostStatusForm,
-    UserCard,
+    UserCard: defineAsyncComponent(
+      () => import('src/components/user_card/user_card.vue'),
+    ),
   },
 }
 

src/components/user_popover/user_popover.js

@@ -1,7 +1,7 @@
 import { mapState } from 'pinia'
 import { defineAsyncComponent } from 'vue'
 
-import UserCard from '../user_card/user_card.vue'
+import Popover from 'src/components/popover/popover.vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 
@@ -9,8 +9,10 @@ const UserPopover = {
   name: 'UserPopover',
   props: ['userId', 'overlayCenters', 'disabled', 'overlayCentersSelector'],
   components: {
-    UserCard,
-    Popover: defineAsyncComponent(() => import('../popover/popover.vue')),
+    UserCard: defineAsyncComponent(
+      () => import('src/components/user_card/user_card.vue'),
+    ),
+    Popover,
   },
   computed: mapState(useMergedConfigStore, {
     userPopoverAvatarAction: (state) =>

src/i18n/messages.js

@@ -16,7 +16,7 @@ const ULTIMATE_FALLBACK_LOCALE = 'en'
 
 const hasLanguageFile = (code) => languages.includes(code)
 
-const languageFileMap = import.meta.glob('./*.json')
+const languageFileMap = import.meta.glob(['./*.json', '!./en.json'])
 
 const loadLanguageFile = (code) => {
   const jsonName = langCodeToJsonName(code)