From ae454af1e8ad14ca8ec346f2f55fcb93ab141987 Mon Sep 17 00:00:00 2001
From: Phan An <me@phanan.net>
Date: Tue, 29 Oct 2024 18:02:17 +0700
Subject: [PATCH] chore: use defineAsyncComponent helper for more components
 (#1868)

---
 resources/assets/js/components/album/AlbumInfo.vue            | 3 ++-
 resources/assets/js/components/layout/ModalWrapper.vue        | 4 ++--
 resources/assets/js/components/layout/main-wrapper/index.vue  | 2 +-
 .../components/layout/main-wrapper/side-sheet/SideSheet.vue   | 4 ++--
 resources/assets/js/components/screens/ProfileScreen.vue      | 3 ++-
 5 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/resources/assets/js/components/album/AlbumInfo.vue b/resources/assets/js/components/album/AlbumInfo.vue
index 6204dd90..ecd74697 100644
--- a/resources/assets/js/components/album/AlbumInfo.vue
+++ b/resources/assets/js/components/album/AlbumInfo.vue
@@ -32,9 +32,10 @@
 </template>
 
 <script lang="ts" setup>
-import { defineAsyncComponent, ref, toRefs, watch } from 'vue'
+import { ref, toRefs, watch } from 'vue'
 import { mediaInfoService } from '@/services/mediaInfoService'
 import { useThirdPartyServices } from '@/composables/useThirdPartyServices'
+import { defineAsyncComponent } from '@/utils/helpers'
 
 import AlbumThumbnail from '@/components/ui/album-artist/AlbumOrArtistThumbnail.vue'
 import AlbumArtistInfo from '@/components/ui/album-artist/AlbumOrArtistInfo.vue'
diff --git a/resources/assets/js/components/layout/ModalWrapper.vue b/resources/assets/js/components/layout/ModalWrapper.vue
index a72ae4e1..796faa1e 100644
--- a/resources/assets/js/components/layout/ModalWrapper.vue
+++ b/resources/assets/js/components/layout/ModalWrapper.vue
@@ -9,8 +9,8 @@
 </template>
 
 <script lang="ts" setup>
-import { defineAsyncComponent, ref, watch } from 'vue'
-import { arrayify, provideReadonly } from '@/utils/helpers'
+import { ref, watch } from 'vue'
+import { arrayify, defineAsyncComponent, provideReadonly } from '@/utils/helpers'
 import { eventBus } from '@/utils/eventBus'
 import { ModalContextKey } from '@/symbols'
 
diff --git a/resources/assets/js/components/layout/main-wrapper/index.vue b/resources/assets/js/components/layout/main-wrapper/index.vue
index f6cc2adb..443f1a58 100644
--- a/resources/assets/js/components/layout/main-wrapper/index.vue
+++ b/resources/assets/js/components/layout/main-wrapper/index.vue
@@ -8,7 +8,7 @@
 </template>
 
 <script lang="ts" setup>
-import { defineAsyncComponent } from 'vue'
+import { defineAsyncComponent } from '@/utils/helpers'
 
 import MainContent from '@/components/layout/main-wrapper/MainContent.vue'
 import SideBar from '@/components/layout/main-wrapper/sidebar/Sidebar.vue'
diff --git a/resources/assets/js/components/layout/main-wrapper/side-sheet/SideSheet.vue b/resources/assets/js/components/layout/main-wrapper/side-sheet/SideSheet.vue
index 597152a5..e4f2d642 100644
--- a/resources/assets/js/components/layout/main-wrapper/side-sheet/SideSheet.vue
+++ b/resources/assets/js/components/layout/main-wrapper/side-sheet/SideSheet.vue
@@ -74,7 +74,7 @@
 import isMobile from 'ismobilejs'
 import { faBars } from '@fortawesome/free-solid-svg-icons'
 import type { Ref } from 'vue'
-import { computed, defineAsyncComponent, onMounted, ref, watch } from 'vue'
+import { computed, onMounted, ref, watch } from 'vue'
 import { albumStore } from '@/stores/albumStore'
 import { artistStore } from '@/stores/artistStore'
 import { preferenceStore } from '@/stores/preferenceStore'
@@ -82,7 +82,7 @@ import { useErrorHandler } from '@/composables/useErrorHandler'
 import { useThirdPartyServices } from '@/composables/useThirdPartyServices'
 import { eventBus } from '@/utils/eventBus'
 import { isSong } from '@/utils/typeGuards'
-import { requireInjection } from '@/utils/helpers'
+import { defineAsyncComponent, requireInjection } from '@/utils/helpers'
 import { CurrentPlayableKey } from '@/symbols'
 
 import ProfileAvatar from '@/components/ui/ProfileAvatar.vue'
diff --git a/resources/assets/js/components/screens/ProfileScreen.vue b/resources/assets/js/components/screens/ProfileScreen.vue
index f09c2497..52f067a1 100644
--- a/resources/assets/js/components/screens/ProfileScreen.vue
+++ b/resources/assets/js/components/screens/ProfileScreen.vue
@@ -78,8 +78,9 @@
 
 <script lang="ts" setup>
 import { QrCodeIcon } from 'lucide-vue-next'
-import { defineAsyncComponent, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 import { useLocalStorage } from '@/composables/useLocalStorage'
+import { defineAsyncComponent } from '@/utils/helpers'
 
 import ScreenHeader from '@/components/ui/ScreenHeader.vue'
 import ScreenBase from '@/components/screens/ScreenBase.vue'