diff --git a/src/components/queue/QueueOverlayExpanded.vue b/src/components/queue/QueueOverlayExpanded.vue
index fad53db111..8e1d5d3e0a 100644
--- a/src/components/queue/QueueOverlayExpanded.vue
+++ b/src/components/queue/QueueOverlayExpanded.vue
@@ -9,23 +9,12 @@
@clear-queued="$emit('clearQueued')"
/>
-
-
-
-
import { ref } from 'vue'
-import { useI18n } from 'vue-i18n'
-import Button from '@/components/ui/button/Button.vue'
import type {
JobGroup,
JobListItem,
@@ -94,8 +81,6 @@ const emit = defineEmits<{
(e: 'viewItem', item: JobListItem): void
}>()
-const { t } = useI18n()
-
const currentMenuItem = ref(null)
const jobContextMenuRef = ref | null>(null)
diff --git a/src/components/queue/job/JobFiltersBar.test.ts b/src/components/queue/job/JobFiltersBar.test.ts
new file mode 100644
index 0000000000..69e3b7901d
--- /dev/null
+++ b/src/components/queue/job/JobFiltersBar.test.ts
@@ -0,0 +1,79 @@
+import { mount } from '@vue/test-utils'
+import { describe, expect, it, vi } from 'vitest'
+import { createI18n } from 'vue-i18n'
+import { defineComponent } from 'vue'
+
+vi.mock('primevue/popover', () => {
+ const PopoverStub = defineComponent({
+ name: 'Popover',
+ setup(_, { slots, expose }) {
+ expose({
+ hide: () => undefined,
+ toggle: (_event: Event) => undefined
+ })
+ return () => slots.default?.()
+ }
+ })
+ return { default: PopoverStub }
+})
+
+vi.mock('@/platform/distribution/types', () => ({
+ isCloud: false
+}))
+
+import JobFiltersBar from '@/components/queue/job/JobFiltersBar.vue'
+
+const i18n = createI18n({
+ legacy: false,
+ locale: 'en',
+ messages: {
+ en: {
+ g: {
+ all: 'All',
+ completed: 'Completed'
+ },
+ queue: {
+ jobList: {
+ sortMostRecent: 'Most recent',
+ sortTotalGenerationTime: 'Total generation time'
+ }
+ },
+ sideToolbar: {
+ queueProgressOverlay: {
+ filterJobs: 'Filter jobs',
+ filterBy: 'Filter by',
+ sortJobs: 'Sort jobs',
+ sortBy: 'Sort by',
+ showAssets: 'Show assets',
+ showAssetsPanel: 'Show assets panel',
+ filterAllWorkflows: 'All workflows',
+ filterCurrentWorkflow: 'Current workflow'
+ }
+ }
+ }
+ }
+})
+
+describe('JobFiltersBar', () => {
+ it('emits showAssets when the assets icon button is clicked', async () => {
+ const wrapper = mount(JobFiltersBar, {
+ props: {
+ selectedJobTab: 'All',
+ selectedWorkflowFilter: 'all',
+ selectedSortMode: 'mostRecent',
+ hasFailedJobs: false
+ },
+ global: {
+ plugins: [i18n],
+ directives: { tooltip: () => undefined }
+ }
+ })
+
+ const showAssetsButton = wrapper.get(
+ 'button[aria-label="Show assets panel"]'
+ )
+ await showAssetsButton.trigger('click')
+
+ expect(wrapper.emitted('showAssets')).toHaveLength(1)
+ })
+})
diff --git a/src/components/queue/job/JobFiltersBar.vue b/src/components/queue/job/JobFiltersBar.vue
index a227c46d97..66b00195ee 100644
--- a/src/components/queue/job/JobFiltersBar.vue
+++ b/src/components/queue/job/JobFiltersBar.vue
@@ -127,6 +127,15 @@
+
@@ -150,6 +159,7 @@ const props = defineProps<{
}>()
const emit = defineEmits<{
+ (e: 'showAssets'): void
(e: 'update:selectedJobTab', value: JobTab): void
(e: 'update:selectedWorkflowFilter', value: 'all' | 'current'): void
(e: 'update:selectedSortMode', value: JobSortMode): void
@@ -165,6 +175,9 @@ const filterTooltipConfig = computed(() =>
const sortTooltipConfig = computed(() =>
buildTooltipConfig(t('sideToolbar.queueProgressOverlay.sortBy'))
)
+const showAssetsTooltipConfig = computed(() =>
+ buildTooltipConfig(t('sideToolbar.queueProgressOverlay.showAssets'))
+)
// This can be removed when cloud implements /jobs and we switch to it.
const showWorkflowFilter = !isCloud