mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
278d491030
## Summary
Move ellipsis and punctuation characters into i18n translation strings
for proper internationalization support.
## Changes
- Add 12 new translation keys with punctuation included:
- Placeholder keys with trailing ellipsis (e.g.,
`searchNodesPlaceholder: "Search Nodes..."`)
- `downloadWithSize` with interpolation: `"Download ({size})"`
- `completedWithCheckmark`: `"Completed ✓"`
- Prompt keys with colons (e.g., `enterNewNamePrompt: "Enter new
name:"`)
- Update 20 files to use new translation keys instead of string
concatenation
## Review Focus
This eliminates string concatenation patterns like `$t('key') + '...'`
that break proper internationalization, since different languages may
use different punctuation or may not need ellipsis/colons in the same
contexts.
Fixes #7333
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
* **Chores**
* Standardized localization across the app: unified search placeholders
and input hints; updated dialog prompt texts for renaming,
saving/exporting, and related prompts.
* **New Features**
* Download buttons now show file size via localized text.
* Completed status displays a localized label with a checkmark.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8573-refactor-move-ellipsis-and-punctuation-into-i18n-translation-strings-2fc6d73d365081828ad3f257bcac7799)
by [Unito](https://www.unito.io)
70 lines
1.8 KiB
Vue
70 lines
1.8 KiB
Vue
<!-- A file download button with a label and a size hint -->
|
|
<template>
|
|
<div class="flex flex-row items-center gap-2">
|
|
<div>
|
|
<div>
|
|
<span :title="hint">{{ label }}</span>
|
|
</div>
|
|
<Message
|
|
v-if="props.error"
|
|
severity="error"
|
|
icon="pi pi-exclamation-triangle"
|
|
size="small"
|
|
variant="outlined"
|
|
class="my-2 h-min max-w-xs px-1"
|
|
:title="props.error"
|
|
:pt="{
|
|
text: { class: 'overflow-hidden text-ellipsis' }
|
|
}"
|
|
>
|
|
{{ props.error }}
|
|
</Message>
|
|
</div>
|
|
<div>
|
|
<Button
|
|
variant="secondary"
|
|
:disabled="!!props.error"
|
|
:title="props.url"
|
|
@click="download.triggerBrowserDownload"
|
|
>
|
|
{{ $t('g.downloadWithSize', { size: fileSize }) }}
|
|
</Button>
|
|
</div>
|
|
<div>
|
|
<Button variant="secondary" :disabled="!!props.error" @click="copyURL">
|
|
{{ $t('g.copyURL') }}
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Message from 'primevue/message'
|
|
import { computed } from 'vue'
|
|
|
|
import Button from '@/components/ui/button/Button.vue'
|
|
import { useCopyToClipboard } from '@/composables/useCopyToClipboard'
|
|
import { useDownload } from '@/composables/useDownload'
|
|
import { formatSize } from '@/utils/formatUtil'
|
|
|
|
const props = defineProps<{
|
|
url: string
|
|
hint?: string
|
|
label?: string
|
|
error?: string
|
|
}>()
|
|
|
|
const label = computed(() => props.label || props.url.split('/').pop())
|
|
|
|
const hint = computed(() => props.hint || props.url)
|
|
const download = useDownload(props.url)
|
|
const fileSize = computed(() =>
|
|
download.fileSize.value ? formatSize(download.fileSize.value) : '?'
|
|
)
|
|
const copyURL = async () => {
|
|
await copyToClipboard(props.url)
|
|
}
|
|
|
|
const { copyToClipboard } = useCopyToClipboard()
|
|
</script>
|