better status circular dependency breakup

src/components/quote/quote.js

@@ -1,5 +1,6 @@
 import { defineAsyncComponent } from 'vue'
 
+import Status from '../status/status.vue'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { faCircleNotch } from '@fortawesome/free-solid-svg-icons'
 
@@ -7,10 +8,7 @@ library.add(faCircleNotch)
 
 export default {
   components: {
-    // Quote and Status depend on each other, dynamic import to break this circular dependency
+    Status,
-    Status: defineAsyncComponent(
-      () => import('src/components/status/status.vue'),
-    ),
   },
   name: 'Quote',
   props: {

src/components/status/status.js

@@ -10,16 +10,14 @@ import {
   highlightClass,
   highlightStyle,
 } from '../../services/user_highlighter/user_highlighter.js'
-import AvatarList from '../avatar_list/avatar_list.vue'
+import AvatarList from 'src/components/avatar_list/avatar_list.vue'
-import EmojiReactions from '../emoji_reactions/emoji_reactions.vue'
+import EmojiReactions from 'src/components/emoji_reactions/emoji_reactions.vue'
-import Quote from '../quote/quote.vue'
+import StatusContent from 'src/components/status_content/status_content.vue'
-import StatusContent from '../status_content/status_content.vue'
+import Timeago from 'src/components/timeago/timeago.vue'
-import StatusPopover from '../status_popover/status_popover.vue'
+import UserAvatar from 'src/components/user_avatar/user_avatar.vue'
-import Timeago from '../timeago/timeago.vue'
+import UserLink from 'src/components/user_link/user_link.vue'
-import UserAvatar from '../user_avatar/user_avatar.vue'
+import UserListPopover from 'src/components/user_list_popover/user_list_popover.vue'
-import UserLink from '../user_link/user_link.vue'
+import UserPopover from 'src/components/user_popover/user_popover.vue'
-import UserListPopover from '../user_list_popover/user_list_popover.vue'
-import UserPopover from '../user_popover/user_popover.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
@@ -123,7 +121,9 @@ const Status = {
     UserAvatar,
     AvatarList,
     Timeago,
-    StatusPopover,
+    StatusPopover: defineAsyncComponent(
+      () => import( 'src/components/status_popover/status_popover.vue')
+    ),
     UserListPopover,
     EmojiReactions,
     StatusContent,
@@ -132,7 +132,9 @@ const Status = {
     MentionsLine,
     UserPopover,
     UserLink,
-    Quote,
+    Quote: defineAsyncComponent(
+      () => import('src/components/quote/quote.vue')
+    ),
     StatusActionButtons,
   },
   props: [

src/components/status_popover/status_popover.js

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