[bugfix] Remove placeholder IMAGE widget to restore previous functionality (#5349)

* Remove IMAGE widget

* Remove IMAGE widget test expectations

src/renderer/extensions/vueNodes/widgets/components/WidgetImage.vue

@@ -1,29 +0,0 @@
-<template>
-  <div class="flex flex-col gap-1">
-    <label v-if="widget.name" class="text-sm opacity-80">{{
-      widget.name
-    }}</label>
-    <Image v-bind="filteredProps" :src="widget.value" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import Image from 'primevue/image'
-import { computed } from 'vue'
-
-import type { SimplifiedWidget } from '@/types/simplifiedWidget'
-import {
-  IMAGE_EXCLUDED_PROPS,
-  filterWidgetProps
-} from '@/utils/widgetPropFilter'
-
-// Image widgets typically don't have v-model, they display a source URL/path
-const props = defineProps<{
-  widget: SimplifiedWidget<string>
-  readonly?: boolean
-}>()
-
-const filteredProps = computed(() =>
-  filterWidgetProps(props.widget.options, IMAGE_EXCLUDED_PROPS)
-)
-</script>

src/renderer/extensions/vueNodes/widgets/composables/useImageWidget.ts

@@ -1,20 +0,0 @@
-import type { LGraphNode } from '@/lib/litegraph/src/litegraph'
-import type { IImageWidget } from '@/lib/litegraph/src/types/widgets'
-import type {
-  ImageInputSpec,
-  InputSpec as InputSpecV2
-} from '@/schemas/nodeDef/nodeDefSchemaV2'
-import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets'
-
-export const useImageWidget = (): ComfyWidgetConstructorV2 => {
-  return (node: LGraphNode, inputSpec: InputSpecV2): IImageWidget => {
-    const { name, options = {} } = inputSpec as ImageInputSpec
-
-    const widget = node.addWidget('image', name, '', () => {}, {
-      serialize: true,
-      ...options
-    }) as IImageWidget
-
-    return widget
-  }
-}

src/renderer/extensions/vueNodes/widgets/composables/useWidgetRenderer.ts

@@ -38,8 +38,6 @@ const TYPE_TO_ENUM_MAP: Record<string, string> = {
   // Advanced widgets
   color: WidgetType.COLOR,
   COLOR: WidgetType.COLOR,
-  image: WidgetType.IMAGE,
-  IMAGE: WidgetType.IMAGE,
   imagecompare: WidgetType.IMAGECOMPARE,
   IMAGECOMPARE: WidgetType.IMAGECOMPARE,
   galleria: WidgetType.GALLERIA,

src/renderer/extensions/vueNodes/widgets/registry/widgetRegistry.ts

@@ -9,7 +9,6 @@ import WidgetChart from '../components/WidgetChart.vue'
 import WidgetColorPicker from '../components/WidgetColorPicker.vue'
 import WidgetFileUpload from '../components/WidgetFileUpload.vue'
 import WidgetGalleria from '../components/WidgetGalleria.vue'
-import WidgetImage from '../components/WidgetImage.vue'
 import WidgetImageCompare from '../components/WidgetImageCompare.vue'
 import WidgetInputText from '../components/WidgetInputText.vue'
 import WidgetMarkdown from '../components/WidgetMarkdown.vue'
@@ -67,7 +66,6 @@ export const widgetTypeToComponent: Record<string, Component> = {
   [WidgetType.TEXTAREA]: WidgetTextarea,
   [WidgetType.TOGGLESWITCH]: WidgetToggleSwitch,
   [WidgetType.CHART]: WidgetChart,
-  [WidgetType.IMAGE]: WidgetImage,
   [WidgetType.IMAGECOMPARE]: WidgetImageCompare,
   [WidgetType.GALLERIA]: WidgetGalleria,
   [WidgetType.FILEUPLOAD]: WidgetFileUpload,

src/scripts/widgets.ts

@@ -14,7 +14,6 @@ import { useFloatWidget } from '@/renderer/extensions/vueNodes/widgets/composabl
 import { useGalleriaWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useGalleriaWidget'
 import { useImageCompareWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageCompareWidget'
 import { useImageUploadWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageUploadWidget'
-import { useImageWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useImageWidget'
 import { useIntWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useIntWidget'
 import { useMarkdownWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useMarkdownWidget'
 import { useMultiSelectWidget } from '@/renderer/extensions/vueNodes/widgets/composables/useMultiSelectWidget'
@@ -301,7 +300,6 @@ export const ComfyWidgets: Record<string, ComfyWidgetConstructor> = {
   IMAGEUPLOAD: useImageUploadWidget(),
   FILEUPLOAD: transformWidgetConstructorV2ToV1(useFileUploadWidget()),
   COLOR: transformWidgetConstructorV2ToV1(useColorWidget()),
-  IMAGE: transformWidgetConstructorV2ToV1(useImageWidget()),
   IMAGECOMPARE: transformWidgetConstructorV2ToV1(useImageCompareWidget()),
   TREESELECT: transformWidgetConstructorV2ToV1(useTreeSelectWidget()),
   MULTISELECT: transformWidgetConstructorV2ToV1(useMultiSelectWidget()),

tests-ui/tests/renderer/extensions/vueNodes/widgets/composables/useWidgetRenderer.test.ts

@@ -66,11 +66,6 @@ describe('useWidgetRenderer', () => {
         expect(getWidgetComponent('COLOR')).toBe(WidgetType.COLOR)
       })
 
-      it('should map image types to IMAGE widget', () => {
-        expect(getWidgetComponent('image')).toBe(WidgetType.IMAGE)
-        expect(getWidgetComponent('IMAGE')).toBe(WidgetType.IMAGE)
-      })
-
       it('should map file types to FILEUPLOAD widget', () => {
         expect(getWidgetComponent('file')).toBe(WidgetType.FILEUPLOAD)
         expect(getWidgetComponent('FILEUPLOAD')).toBe(WidgetType.FILEUPLOAD)