Allow for null depending on how the backend sends assets.

src/components/sidebar/tabs/AssetsSidebarListView.vue

@@ -80,7 +80,7 @@
               })
             "
             :class="getAssetCardClass(isSelected(item.asset.id))"
-            :preview-url="item.asset.preview_url"
+            :preview-url="item.asset.preview_url ?? undefined"
             :preview-alt="item.asset.name"
             :icon-name="
               iconForMediaType(getMediaTypeFromFilename(item.asset.name))

src/platform/assets/components/AssetCard.vue

@@ -24,7 +24,7 @@
       />
       <img
         v-else
-        :src="asset.preview_url"
+        :src="asset.preview_url ?? undefined"
         :alt="displayName"
         class="size-full object-cover cursor-pointer"
       />

src/platform/assets/components/MediaVideoTop.vue

@@ -10,7 +10,7 @@
       muted
       loop
       playsinline
-      :poster="asset.preview_url"
+      :poster="asset.preview_url ?? undefined"
       class="relative size-full object-contain transition-transform duration-300 group-hover:scale-105 group-data-[selected=true]:scale-105"
       @click.stop
       @play="onVideoPlay"

src/platform/assets/composables/useAssetBrowser.ts

@@ -156,8 +156,8 @@ export function useAssetBrowser(
 
   const typeCategories = computed<NavItemData[]>(() => {
     const categories = assets.value
-      .filter((asset) => asset.tags[0] === 'models')
-      .map((asset) => asset.tags[1])
+      .filter((asset) => asset.tags.includes('models'))
+      .map((asset) => asset.tags.find((tag) => tag !== 'models'))
       .filter((tag): tag is string => typeof tag === 'string' && tag.length > 0)
       .map((tag) => tag.split('/')[0])
 

src/platform/assets/schemas/assetSchema.ts

@@ -8,8 +8,8 @@ const zAsset = z.object({
   size: z.number().optional(), // TBD: Will be provided by history API in the future
   mime_type: z.string().nullish(),
   tags: z.array(z.string()).optional().default([]),
-  preview_id: z.string().nullable().optional(),
-  preview_url: z.string().optional(),
+  preview_id: z.string().nullish(),
+  preview_url: z.string().nullish(),
   created_at: z.string().optional(),
   updated_at: z.string().optional(),
   is_immutable: z.boolean().optional(),

src/platform/settings/constants/coreSettings.ts

@@ -1152,7 +1152,7 @@ export const CORE_SETTINGS: SettingParams[] = [
   {
     id: 'Comfy.Assets.UseAssetAPI',
     name: 'Use Asset API for model library',
-    type: 'hidden',
+    type: 'boolean',
     tooltip: 'Use new Asset API for model browsing',
     defaultValue: isCloud ? true : false,
     experimental: true

src/stores/assetsStore.ts

@@ -136,7 +136,7 @@ export const useAssetsStore = defineStore('assets', () => {
    * Fetch history assets with pagination support
    * @param loadMore - true for pagination (append), false for initial load (replace)
    */
-  const fetchHistoryAssets = async (loadMore = false): Promise<AssetItem[]> => {
+  async function fetchHistoryAssets(loadMore = false): Promise<AssetItem[]> {
     // Reset state for initial load
     if (!loadMore) {
       historyOffset.value = 0
@@ -203,7 +203,7 @@ export const useAssetsStore = defineStore('assets', () => {
   /**
    * Initial load of history assets
    */
-  const updateHistory = async () => {
+  async function updateHistory() {
     historyLoading.value = true
     historyError.value = null
     try {
@@ -224,7 +224,7 @@ export const useAssetsStore = defineStore('assets', () => {
   /**
    * Load more history items (infinite scroll)
    */
-  const loadMoreHistory = async () => {
+  async function loadMoreHistory() {
     // Guard: prevent concurrent loads and check if more items available
     if (!hasMoreHistory.value || isLoadingMore.value) return
 
@@ -283,8 +283,7 @@ export const useAssetsStore = defineStore('assets', () => {
    * Used by multiple loader nodes to avoid duplicate fetches
    * Cloud-only feature - empty Maps in desktop builds
    */
-  const getModelState = () => {
-    if (isCloud) {
+  function getModelState() {
     const modelStateByKey = ref(new Map<string, ModelPaginationState>())
 
     const assetsArrayCache = new Map<
@@ -559,20 +558,6 @@ export const useAssetsStore = defineStore('assets', () => {
     }
   }
 
-    const emptyAssets: AssetItem[] = []
-    return {
-      getAssets: () => emptyAssets,
-      isLoading: () => false,
-      getError: () => undefined,
-      hasMore: () => false,
-      hasAssetKey: () => false,
-      updateModelsForNodeType: async () => {},
-      updateModelsForTag: async () => {},
-      updateAssetMetadata: async () => {},
-      updateAssetTags: async () => {}
-    }
-  }
-
   const {
     getAssets,
     isLoading: isModelLoading,