Comfy-Org / Comfy-Org/ComfyUI_frontend

i18n: apps/website has 34+ hardcoded English strings across 20+ files — needs vue-i18n integration

Open
#12,261 0 comments 0 reactions 0 assignees View on GitHub
area:i18n
Dominant language
TypeScript
Stars
2k
Forks
699
Avg merge
1d 7h
Merged PRs (30d)
490

Description

The marketing website at `apps/website/` contains many hardcoded English strings that do not use the vue-i18n translation system.

### Page Titles / Descriptions (Astro files)

All `` and `<meta description>` are hardcoded in English:

- `404.astro` — "404 — Page Not Found — Comfy", "Looks like this node went off-grid.", "Score:", "Best:", "CLICK TO START", "PAUSED", "Press space to resume"
- `about.astro` — "About Us — Comfy"
- `careers.astro` — "Careers — Comfy", "Join the team building..."
- `contact.astro` — "Contact — Comfy"
- `cloud/index.astro` — calls `t(key, "en")` with locale hardcoded to "en"
- `cloud/pricing.astro` — "Pricing — Comfy Cloud"
- `customers.astro` — "Customer Stories — Comfy"
- `demos/index.astro` — "Demos — Comfy", "Interactive demos and tutorials..."
- `download.astro` — calls `t(key, "en")` with locale hardcoded
- `gallery.astro` — "Gallery — Comfy"
- `index.astro` — "Comfy — Professional Control of Visual AI"
- `payment/success.astro` — "Payment Successful — Comfy"
- `payment/failed.astro` — "Payment Failed — Comfy"
- `privacy-policy.astro` — "Privacy Policy" (prop)
- `terms-of-service.astro` — "Terms of Service" (prop)
- `videos.astro` — "Videos — Comfy"
- `case-studies.astro`, `api.astro`, `cloud/enterprise.astro`, `cloud/supported-nodes.astro` same pattern

### Component Hardcoded Strings

- **ComingSoon.astro**: "Coming Soon", "This page is being redesigned. Check back soon." — used on zh-CN pages too so Chinese visitors see English
- **GitHubStarBadge.vue**: Aria label `` `ComfyUI on GitHub — ${stars} stars` `` — not using t()
- **SiteFooter.vue**: `"© ${year} Comfy Org"`
- **SocialProofBarSection.vue**: 12 brand names hardcoded as img alt (Amazon Studios, Apple, Autodesk, EA, etc.)
- **ProductHeroBadge.vue**: default prop `text = "LOCAL"`
- **local/HeroSection.vue**: "LOCAL"
- **cloud/HeroSection.vue**: "CLOUD"
- **api/HeroSection.vue**: "API"
- **ModelHeroSection.vue**: `dirDisplayMap` with 13 model type display names hardcoded ("Diffusion Model", "Checkpoint", "LoRA", "ControlNet", etc.), and `t("models.hero.workflowCount")` called without passing locale
- **FeedbackSection.vue**: Pagination aria-labels use inverted ternary
- **StorySection.vue**: "OUR", "INVESTORS"
- **TeamPhotosSection.vue**: 8 photo alt attributes hardcoded ("Team dinner", "Team working", etc.)

### Architectural Issue: zh-CN Page Duplication Anti-pattern

`apps/website/src/pages/zh-CN/` contains 16+ complete page copies (about.astro, api.astro, careers.astro, etc.). Adding a new locale requires duplicating every page. Additionally, `zh-CN/case-studies.astro` and `zh-CN/videos.astro` still use the ComingSoon component showing English text.

### Suggested Fix

1. Move all page titles/descriptions to i18n keys
2. Replace all hardcoded component text with t() calls
3. Make ProductHeroBadge text prop locale-aware
4. Move ModelHeroSection.dirDisplayMap to i18n
5. Refactor zh-CN page copies to a locale-aware routing pattern (single page + locale prop)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.