From c54b675a48c0cb75a5d0b527bae20761211810fd Mon Sep 17 00:00:00 2001
From: Chenlei Hu <huchenlei@proton.me>
Date: Tue, 26 Nov 2024 10:17:26 -0800
Subject: [PATCH] Revert Filter cached/canceled results (#1586) (#1703)

* Revert "Filter cached/canceled results (#1586)"

This reverts commit 6fbf1248f4a9c8b159f954c45f7296ca2f1717dd.

* nit
---
 .../sidebar/tabs/QueueSidebarTab.vue          | 70 ++-----------------
 .../sidebar/tabs/queue/OutputFilters.vue      | 38 ----------
 .../sidebar/tabs/queue/TaskItem.vue           | 24 ++-----
 src/constants/coreSettings.ts                 | 19 -----
 src/stores/queueStore.ts                      | 12 +---
 src/types/apiTypes.ts                         |  7 --
 src/views/GraphView.vue                       |  5 +-
 7 files changed, 16 insertions(+), 159 deletions(-)
 delete mode 100644 src/components/sidebar/tabs/queue/OutputFilters.vue

diff --git a/src/components/sidebar/tabs/QueueSidebarTab.vue b/src/components/sidebar/tabs/QueueSidebarTab.vue
index 7166b32fa4..71ec514e97 100644
--- a/src/components/sidebar/tabs/QueueSidebarTab.vue
+++ b/src/components/sidebar/tabs/QueueSidebarTab.vue
@@ -1,18 +1,6 @@
 <template>
   <SidebarTabTemplate :title="$t('sideToolbar.queue')">
     <template #tool-buttons>
-      <Popover ref="outputFilterPopup">
-        <OutputFilters />
-      </Popover>
-
-      <Button
-        icon="pi pi-filter"
-        text
-        severity="secondary"
-        @click="outputFilterPopup.toggle($event)"
-        v-tooltip="$t(`sideToolbar.queueTab.filter`)"
-        :class="{ 'text-yellow-500': anyFilter }"
-      />
       <Button
         :icon="
           imageFit === 'cover'
@@ -111,7 +99,6 @@ import Button from 'primevue/button'
 import ConfirmPopup from 'primevue/confirmpopup'
 import ContextMenu from 'primevue/contextmenu'
 import type { MenuItem } from 'primevue/menuitem'
-import Popover from 'primevue/popover'
 import ProgressSpinner from 'primevue/progressspinner'
 import TaskItem from './queue/TaskItem.vue'
 import ResultGallery from './queue/ResultGallery.vue'
@@ -124,9 +111,7 @@ import { useSettingStore } from '@/stores/settingStore'
 import { useCommandStore } from '@/stores/commandStore'
 import { app } from '@/scripts/app'
 
-const SETTING_FIT = 'Comfy.Queue.ImageFit'
-const SETTING_FLAT = 'Comfy.Queue.ShowFlatList'
-const SETTING_FILTER = 'Comfy.Queue.Filter'
+const IMAGE_FIT = 'Comfy.Queue.ImageFit'
 const confirm = useConfirm()
 const toast = useToast()
 const queueStore = useQueueStore()
@@ -135,7 +120,7 @@ const commandStore = useCommandStore()
 const { t } = useI18n()
 
 // Expanded view: show all outputs in a flat list.
-const isExpanded = computed<boolean>(() => settingStore.get(SETTING_FLAT))
+const isExpanded = ref(false)
 const visibleTasks = ref<TaskItemImpl[]>([])
 const scrollContainer = ref<HTMLElement | null>(null)
 const loadMoreTrigger = ref<HTMLElement | null>(null)
@@ -143,23 +128,7 @@ const galleryActiveIndex = ref(-1)
 // Folder view: only show outputs from a single selected task.
 const folderTask = ref<TaskItemImpl | null>(null)
 const isInFolderView = computed(() => folderTask.value !== null)
-const imageFit = computed<string>(() => settingStore.get(SETTING_FIT))
-const hideCached = computed<boolean>(
-  () => settingStore.get(SETTING_FILTER)?.hideCached
-)
-const hideCanceled = computed<boolean>(
-  () => settingStore.get(SETTING_FILTER)?.hideCanceled
-)
-const anyFilter = computed(() => hideCanceled.value || hideCached.value)
-
-watch(hideCached, () => {
-  updateVisibleTasks()
-})
-watch(hideCanceled, () => {
-  updateVisibleTasks()
-})
-
-const outputFilterPopup = ref(null)
+const imageFit = computed<string>(() => settingStore.get(IMAGE_FIT))
 
 const ITEMS_PER_PAGE = 8
 const SCROLL_THRESHOLD = 100 // pixels from bottom to trigger load
@@ -180,31 +149,9 @@ const allGalleryItems = computed(() =>
   })
 )
 
-const filterTasks = (tasks: TaskItemImpl[]) =>
-  tasks
-    .filter((t) => {
-      if (
-        hideCanceled.value &&
-        t.status?.messages?.at(-1)?.[0] === 'execution_interrupted'
-      ) {
-        return false
-      }
-
-      if (
-        hideCached.value &&
-        t.flatOutputs?.length &&
-        t.flatOutputs.every((o) => o.cached)
-      ) {
-        return false
-      }
-
-      return true
-    })
-    .slice(0, ITEMS_PER_PAGE)
-
 const loadMoreItems = () => {
   const currentLength = visibleTasks.value.length
-  const newTasks = filterTasks(allTasks.value).slice(
+  const newTasks = allTasks.value.slice(
     currentLength,
     currentLength + ITEMS_PER_PAGE
   )
@@ -239,11 +186,11 @@ useResizeObserver(scrollContainer, () => {
 })
 
 const updateVisibleTasks = () => {
-  visibleTasks.value = filterTasks(allTasks.value)
+  visibleTasks.value = allTasks.value.slice(0, ITEMS_PER_PAGE)
 }
 
 const toggleExpanded = () => {
-  settingStore.set(SETTING_FLAT, !isExpanded.value)
+  isExpanded.value = !isExpanded.value
   updateVisibleTasks()
 }
 
@@ -344,10 +291,7 @@ const exitFolderView = () => {
 }
 
 const toggleImageFit = () => {
-  settingStore.set(
-    SETTING_FIT,
-    imageFit.value === 'cover' ? 'contain' : 'cover'
-  )
+  settingStore.set(IMAGE_FIT, imageFit.value === 'cover' ? 'contain' : 'cover')
 }
 
 onMounted(() => {
diff --git a/src/components/sidebar/tabs/queue/OutputFilters.vue b/src/components/sidebar/tabs/queue/OutputFilters.vue
deleted file mode 100644
index 3cac3a81f6..0000000000
--- a/src/components/sidebar/tabs/queue/OutputFilters.vue
+++ /dev/null
@@ -1,38 +0,0 @@
-<template>
-  <div class="flex flex-col gap-2">
-    <label class="flex items-center gap-2">
-      {{ $t('sideToolbar.queueTab.filters.hideCached') }}
-      <ToggleSwitch v-model="hideCached" />
-    </label>
-    <label class="flex items-center gap-2">
-      {{ $t('sideToolbar.queueTab.filters.hideCanceled') }}
-      <ToggleSwitch v-model="hideCanceled" />
-    </label>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
-import ToggleSwitch from 'primevue/toggleswitch'
-import { useSettingStore } from '@/stores/settingStore'
-const SETTING_FILTER = 'Comfy.Queue.Filter'
-
-const { t } = useI18n()
-const settingStore = useSettingStore()
-const filter = settingStore.get(SETTING_FILTER) ?? {}
-
-const createCompute = (k: string) =>
-  computed({
-    get() {
-      return filter[k]
-    },
-    set(value) {
-      filter[k] = value
-      settingStore.set(SETTING_FILTER, filter)
-    }
-  })
-
-const hideCached = createCompute('hideCached')
-const hideCanceled = createCompute('hideCanceled')
-</script>
diff --git a/src/components/sidebar/tabs/queue/TaskItem.vue b/src/components/sidebar/tabs/queue/TaskItem.vue
index 8b0baf3a7b..07e98edb86 100644
--- a/src/components/sidebar/tabs/queue/TaskItem.vue
+++ b/src/components/sidebar/tabs/queue/TaskItem.vue
@@ -31,20 +31,16 @@
 
     <div class="task-item-details">
       <div class="tag-wrapper status-tag-group">
-        <Tag v-if="isFlatTask && task.isHistory && node" class="node-name-tag">
+        <Tag v-if="isFlatTask && task.isHistory" class="node-name-tag">
           <Button
             class="task-node-link"
-            :label="`${node.type} (#${node.id})`"
+            :label="`${node?.type} (#${node?.id})`"
             link
             size="small"
             @click="app.goToNode(node?.id)"
           />
         </Tag>
-        <Tag
-          :severity="taskTagSeverity(task.displayStatus)"
-          class="task-duration relative"
-        >
-          <i v-if="isCachedResult" class="pi pi-server task-cached-icon"></i>
+        <Tag :severity="taskTagSeverity(task.displayStatus)">
           <span v-html="taskStatusText(task.displayStatus)"></span>
           <span v-if="task.isHistory" class="task-time">
             {{ formatTime(task.executionTimeInSeconds) }}
@@ -94,7 +90,6 @@ const node: ComfyNode | null =
       ) ?? null
     : null
 const progressPreviewBlobUrl = ref('')
-const isCachedResult = props.isFlatTask && coverResult?.cached
 
 const emit = defineEmits<{
   (
@@ -147,7 +142,7 @@ const taskStatusText = (status: TaskItemDisplayStatus) => {
     case TaskItemDisplayStatus.Running:
       return '<i class="pi pi-spin pi-spinner" style="font-weight: bold"></i> Running'
     case TaskItemDisplayStatus.Completed:
-      return `<i class="pi pi-check${isCachedResult ? ' cached' : ''}" style="font-weight: bold"></i>`
+      return '<i class="pi pi-check" style="font-weight: bold"></i>'
     case TaskItemDisplayStatus.Failed:
       return 'Failed'
     case TaskItemDisplayStatus.Cancelled:
@@ -231,15 +226,4 @@ are floating on top of images. */
   object-fit: cover;
   object-position: center;
 }
-
-.task-cached-icon {
-  color: #fff;
-}
-
-:deep(.pi-check.cached) {
-  font-size: 12px;
-  position: absolute;
-  left: 16px;
-  top: 12px;
-}
 </style>
diff --git a/src/constants/coreSettings.ts b/src/constants/coreSettings.ts
index 12f1bc1461..d6e8647734 100644
--- a/src/constants/coreSettings.ts
+++ b/src/constants/coreSettings.ts
@@ -198,25 +198,6 @@ export const CORE_SETTINGS: SettingParams[] = [
     type: 'hidden',
     defaultValue: 'cover'
   },
-  // Hidden setting used by the queue for if the results should be grouped by prompt
-  {
-    id: 'Comfy.Queue.ShowFlatList',
-    name: 'Queue show flat list',
-    type: 'hidden',
-    defaultValue: false
-  },
-
-  // Hidden setting used by the queue to filter certain results
-  {
-    id: 'Comfy.Queue.Filter',
-    name: 'Queue output filters',
-    type: 'hidden',
-    defaultValue: {
-      hideCanceled: false,
-      hideCached: false
-    },
-    versionAdded: '1.4.3'
-  },
   {
     id: 'Comfy.GroupSelectedNodes.Padding',
     category: ['LiteGraph', 'Group', 'Padding'],
diff --git a/src/stores/queueStore.ts b/src/stores/queueStore.ts
index 2c7f9240fe..414100d982 100644
--- a/src/stores/queueStore.ts
+++ b/src/stores/queueStore.ts
@@ -30,7 +30,6 @@ export class ResultItemImpl {
   filename: string
   subfolder: string
   type: string
-  cached: boolean
 
   nodeId: NodeId
   // 'audio' | 'images' | ...
@@ -44,7 +43,6 @@ export class ResultItemImpl {
     this.filename = obj.filename ?? ''
     this.subfolder = obj.subfolder ?? ''
     this.type = obj.type ?? ''
-    this.cached = obj.cached
 
     this.nodeId = obj.nodeId
     this.mediaType = obj.mediaType
@@ -151,13 +149,6 @@ export class TaskItemImpl {
     if (!this.outputs) {
       return []
     }
-
-    const cachedEntries = new Set(
-      this.status?.messages?.find((message) => {
-        return message[0] === 'execution_cached'
-      })?.[1].nodes
-    )
-
     return Object.entries(this.outputs).flatMap(([nodeId, nodeOutputs]) =>
       Object.entries(nodeOutputs).flatMap(([mediaType, items]) =>
         (items as ResultItem[]).map(
@@ -165,8 +156,7 @@ export class TaskItemImpl {
             new ResultItemImpl({
               ...item,
               nodeId,
-              mediaType,
-              cached: cachedEntries.has(nodeId)
+              mediaType
             })
         )
       )
diff --git a/src/types/apiTypes.ts b/src/types/apiTypes.ts
index 411bbe8527..3081e994ed 100644
--- a/src/types/apiTypes.ts
+++ b/src/types/apiTypes.ts
@@ -454,11 +454,6 @@ const zNodeBadgeMode = z.enum(
   Object.values(NodeBadgeMode) as [string, ...string[]]
 )
 
-const zQueueFilter = z.object({
-  hideCached: z.boolean(),
-  hideCanceled: z.boolean()
-})
-
 const zSettings = z.record(z.any()).and(
   z
     .object({
@@ -511,8 +506,6 @@ const zSettings = z.record(z.any()).and(
       'Comfy.Validation.Workflows': z.boolean(),
       'Comfy.Workflow.SortNodeIdOnSave': z.boolean(),
       'Comfy.Queue.ImageFit': z.enum(['contain', 'cover']),
-      'Comfy.Queue.ShowFlatList': z.boolean(),
-      'Comfy.Queue.Filter': zQueueFilter.passthrough(),
       'Comfy.Workflow.WorkflowTabsPosition': z.enum(['Sidebar', 'Topbar']),
       'Comfy.Node.DoubleClickTitleToEdit': z.boolean(),
       'Comfy.Window.UnloadConfirmation': z.boolean(),
diff --git a/src/views/GraphView.vue b/src/views/GraphView.vue
index bd98de2d12..2b23844786 100644
--- a/src/views/GraphView.vue
+++ b/src/views/GraphView.vue
@@ -19,7 +19,10 @@ import { useI18n } from 'vue-i18n'
 import { useWorkspaceStore } from '@/stores/workspaceStore'
 import { api } from '@/scripts/api'
 import { StatusWsMessageStatus } from '@/types/apiTypes'
-import { useQueuePendingTaskCountStore } from '@/stores/queueStore'
+import {
+  useQueuePendingTaskCountStore,
+  useQueueStore
+} from '@/stores/queueStore'
 import type { ToastMessageOptions } from 'primevue/toast'
 import { useToast } from 'primevue/usetoast'
 import { i18n } from '@/i18n'