load assets browser before fetch completes and show loading state (#6189)

## Summary

Moves the fetch and post-fetch logic associated with the asset browser
into the component and shows a loading state while fetching.

To test, use this branch:
https://github.com/comfyanonymous/ComfyUI/pull/10045



https://github.com/user-attachments/assets/718974d5-efc7-46a0-bcd6-e82596d4c389

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6189-load-assets-browser-before-fetch-completes-and-show-loading-state-2946d73d365081879d1bd05d86e8c036)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>

src/platform/assets/composables/useAssetBrowserDialog.ts

@@ -1,7 +1,5 @@
-import { t } from '@/i18n'
 import AssetBrowserModal from '@/platform/assets/components/AssetBrowserModal.vue'
 import type { AssetItem } from '@/platform/assets/schemas/assetSchema'
-import { assetService } from '@/platform/assets/services/assetService'
 import { useDialogStore } from '@/stores/dialogStore'
 import type { DialogComponentProps } from '@/stores/dialogStore'
 
@@ -51,33 +49,6 @@ export const useAssetBrowserDialog = () => {
       dialogStore.closeDialog({ key: dialogKey })
     }
 
-    const assets: AssetItem[] = await assetService
-      .getAssetsForNodeType(props.nodeType)
-      .catch((error) => {
-        console.error(
-          'Failed to fetch assets for node type:',
-          props.nodeType,
-          error
-        )
-        return []
-      })
-
-    // Extract node type category from first asset's tags (e.g., "loras", "checkpoints")
-    // Tags are ordered: ["models", "loras"] so take the second tag
-    const nodeTypeCategory =
-      assets[0]?.tags?.find((tag) => tag !== 'models') ?? 'models'
-
-    const acronyms = new Set(['VAE', 'CLIP', 'GLIGEN'])
-    const categoryLabel = nodeTypeCategory
-      .split('_')
-      .map((word) => {
-        const uc = word.toUpperCase()
-        return acronyms.has(uc) ? uc : word
-      })
-      .join(' ')
-
-    const title = t('assetBrowser.allCategory', { category: categoryLabel })
-
     dialogStore.showDialog({
       key: dialogKey,
       component: AssetBrowserModal,
@@ -85,8 +56,6 @@ export const useAssetBrowserDialog = () => {
         nodeType: props.nodeType,
         inputName: props.inputName,
         currentValue: props.currentValue,
-        assets,
-        title,
         onSelect: handleAssetSelected,
         onClose: () => dialogStore.closeDialog({ key: dialogKey })
       },
@@ -100,25 +69,12 @@ export const useAssetBrowserDialog = () => {
       dialogStore.closeDialog({ key: dialogKey })
     }
 
-    const assets = await assetService
-      .getAssetsByTag(options.assetType)
-      .catch((error) => {
-        console.error(
-          'Failed to fetch assets for tag:',
-          options.assetType,
-          error
-        )
-        return []
-      })
-
     dialogStore.showDialog({
       key: dialogKey,
       component: AssetBrowserModal,
       props: {
-        nodeType: undefined,
-        inputName: undefined,
-        assets,
         showLeftPanel: true,
+        assetType: options.assetType,
         title: options.title,
         onSelect: handleAssetSelected,
         onClose: () => dialogStore.closeDialog({ key: dialogKey })