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