mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-08 17:10:07 +00:00
69c8c84aef
## Summary
Fix all i18n `no-restricted-imports` lint warnings and upgrade rules
from `warn` to `error`.
## Changes
- **What**: Migrate Vue components from `import { t/d } from '@/i18n'`
to `const { t } = useI18n()`. Migrate non-component `.ts` files from
`useI18n()` to `import { t/d } from '@/i18n'`. Allow `st` import from
`@/i18n` in Vue components (it wraps `te`/`t` for safe fallback
translation). Remove `@deprecated` tag from `i18n.ts` global exports
(still used by `st` and non-component code). Upgrade both lint rules
from `warn` to `error`.
## Review Focus
- The `st` helper is intentionally excluded from the Vue component
restriction since it provides safe fallback translation needed for
custom node definitions.
Fixes #8701
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8704-fix-resolve-i18n-no-restricted-imports-lint-warnings-2ff6d73d365081ae84d8eb0dfef24323)
by [Unito](https://www.unito.io)
---------
Co-authored-by: Amp <amp@ampcode.com>
58 lines
1.6 KiB
Vue
58 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
|
|
import Button from '@/components/ui/button/Button.vue'
|
|
import { useKeybindingStore } from '@/platform/keybindings/keybindingStore'
|
|
import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
|
|
import { useCommandStore } from '@/stores/commandStore'
|
|
|
|
const { t } = useI18n()
|
|
const canvasStore = useCanvasStore()
|
|
const keybindingStore = useKeybindingStore()
|
|
|
|
const keybindingSuffix = computed(() => {
|
|
const shortcut = keybindingStore
|
|
.getKeybindingByCommandId('Comfy.ToggleLinear')
|
|
?.combo.toString()
|
|
return shortcut ? t('g.shortcutSuffix', { shortcut }) : ''
|
|
})
|
|
|
|
function toggleLinearMode() {
|
|
useCommandStore().execute('Comfy.ToggleLinear', {
|
|
metadata: { source: 'button' }
|
|
})
|
|
}
|
|
</script>
|
|
<template>
|
|
<div
|
|
data-testid="mode-toggle"
|
|
class="p-1 bg-secondary-background rounded-lg w-10"
|
|
>
|
|
<Button
|
|
v-tooltip="{
|
|
value: t('linearMode.linearMode') + keybindingSuffix,
|
|
showDelay: 300,
|
|
hideDelay: 300
|
|
}"
|
|
size="icon"
|
|
:variant="canvasStore.linearMode ? 'inverted' : 'secondary'"
|
|
@click="toggleLinearMode"
|
|
>
|
|
<i class="icon-[lucide--panels-top-left]" />
|
|
</Button>
|
|
<Button
|
|
v-tooltip="{
|
|
value: t('linearMode.graphMode') + keybindingSuffix,
|
|
showDelay: 300,
|
|
hideDelay: 300
|
|
}"
|
|
size="icon"
|
|
:variant="canvasStore.linearMode ? 'secondary' : 'inverted'"
|
|
@click="toggleLinearMode"
|
|
>
|
|
<i class="icon-[comfy--workflow]" />
|
|
</Button>
|
|
</div>
|
|
</template>
|