mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-03-14 01:20:03 +00:00
2542449d45
This PR - adds missing locale keys for 3D viewer toast strings, assets sidebar labels, and node error keys - cleans up the selection toolbox, media previews, node components, and widget uploader to rely on `$t`/`st` (exposed to template scope at compile time) instead of importing from `useI18n`. - updates `eslint.config.ts` to teach the Intlify rule about the locale layout ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6622-chore-add-missing-i18n-keys-in-sidebar-assets-toolbox-dropdowns-2a36d73d365081ae8694eb4f8ebb822a) by [Unito](https://www.unito.io) --------- Co-authored-by: Alexander Brown <drjkl@comfy.org>
59 lines
1.5 KiB
Vue
59 lines
1.5 KiB
Vue
<template>
|
|
<div v-if="renderError" class="node-error p-2 text-sm text-red-500">
|
|
{{ st('nodeErrors.content', 'Node Content Error') }}
|
|
</div>
|
|
<div v-else class="lg-node-content flex grow flex-col">
|
|
<!-- Default slot for custom content -->
|
|
<slot>
|
|
<VideoPreview
|
|
v-if="hasMedia && media?.type === 'video'"
|
|
:image-urls="media.urls"
|
|
:node-id="nodeId"
|
|
class="mt-2"
|
|
/>
|
|
<ImagePreview
|
|
v-else-if="hasMedia && media?.type === 'image'"
|
|
:image-urls="media.urls"
|
|
:node-id="nodeId"
|
|
class="mt-2"
|
|
/>
|
|
</slot>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed, onErrorCaptured, ref } from 'vue'
|
|
|
|
import type { VueNodeData } from '@/composables/graph/useGraphNodeManager'
|
|
import { useErrorHandling } from '@/composables/useErrorHandling'
|
|
import { st } from '@/i18n'
|
|
|
|
import VideoPreview from '../VideoPreview.vue'
|
|
import ImagePreview from './ImagePreview.vue'
|
|
|
|
interface NodeContentProps {
|
|
nodeData?: VueNodeData
|
|
media?: {
|
|
type: 'image' | 'video'
|
|
urls: string[]
|
|
}
|
|
}
|
|
|
|
const props = defineProps<NodeContentProps>()
|
|
|
|
const hasMedia = computed(() => props.media && props.media.urls.length > 0)
|
|
|
|
// Get node ID from nodeData
|
|
const nodeId = computed(() => props.nodeData?.id?.toString())
|
|
|
|
// Error boundary implementation
|
|
const renderError = ref<string | null>(null)
|
|
const { toastErrorHandler } = useErrorHandling()
|
|
|
|
onErrorCaptured((error) => {
|
|
renderError.value = error.message
|
|
toastErrorHandler(error)
|
|
return false
|
|
})
|
|
</script>
|