spx-gui: delay input URL processing in RemoveBackground component

spx-gui/src/components/asset/preprocessing/remove-background/RemoveBackground.vue

@@ -17,24 +17,24 @@
 import { ref } from 'vue'
 import { loadImg } from '@/utils/dom'
 import { stripExt } from '@/utils/path'
-import { untilNotNull, useAsyncComputed, memoizeAsync } from '@/utils/utils'
+import { memoizeAsync } from '@/utils/utils'
 import { getMimeFromExt } from '@/utils/file'
 import { toJpeg } from '@/utils/img'
 import { matting } from '@/apis/aigc'
 import { fromBlob, toNativeFile, File } from '@/models/common/file'
-import { createFileWithWebUrl, getWebUrl } from '@/models/common/cloud'
+import { createFileWithWebUrl, saveFileForWebUrl } from '@/models/common/cloud'
 import type { MethodComponentEmits, MethodComponentProps } from '../common/types'
 import ProcessDetail from '../common/ProcessDetail.vue'
 import ImgPreview from '../common/ImgPreview.vue'
 
 const props = defineProps<MethodComponentProps>()
 const emit = defineEmits<MethodComponentEmits>()
 
-const inputUrlsComputed = useAsyncComputed(() =>
+const getUrls = memoizeAsync((files: File[]) =>
  Promise.all(
- props.input.map(async (file) => {
+ files.map(async (file) => {
  file = await adaptImg(file)
- return getWebUrl(file)
+ return saveFileForWebUrl(file)
  })
  )
 )
@@ -48,15 +48,15 @@ const batchRemoveBackground = memoizeAsync(
 )
 
 async function apply() {
- const inputUrls = await untilNotNull(inputUrlsComputed)
+ const inputUrls = await getUrls(props.input)
  const outputUrls = await batchRemoveBackground(inputUrls)
  await drawTransitions(outputUrls)
  const outputFiles = outputUrls.map((url) => createFileWithWebUrl(url))
  emit('applied', outputFiles)
 }
 
 async function cancel() {
- const inputUrls = await untilNotNull(inputUrlsComputed)
+ const inputUrls = await getUrls(props.input)
  await drawTransitions(inputUrls, true)
  emit('cancel')
 }

spx-gui/src/models/common/cloud.ts

@@ -93,7 +93,7 @@ export function createFileWithWebUrl(url: WebUrl, name = filename(url)) {
  })
 }
 
-export async function getWebUrl(file: File) {
+export async function saveFileForWebUrl(file: File) {
  const universalUrl = await saveFile(file)
  return universalUrlToWebUrl(universalUrl)
 }