ui: rename VOD card "Clip" button to Trim/Zuschneiden + live re-render

Follow-up to 4.5.13. The dialog title was renamed but the VOD-card
button that opens it still read "Clip", which kept the same
overloaded-with-Twitch-Clips ambiguity it was meant to fix.

- DE: "Zuschneiden", EN: "Trim" (kept short for the small card button;
  the dialog itself still reads "Trim VOD" / "VOD zuschneiden")
- buildVodCardHtml now uses UI_TEXT.vods.trimButton instead of a
  hardcoded "Clip"
- changeLanguage now also calls renderVodGridFromCurrentState +
  refreshVodSortSelectLabels so the button label and sort-select
  options update live on language switch (the existing addQueue label
  was suffering the same staleness)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
xRangerDE 2026-05-10 11:55:59 +02:00
parent 3c0af2765e
commit 138c81eb8c
4 changed files with 7 additions and 1 deletions

View File

@ -163,6 +163,7 @@ const UI_TEXT_DE = {
untitled: 'Unbenanntes VOD',
views: 'Aufrufe',
addQueue: '+ Warteschlange',
trimButton: 'Zuschneiden',
filterPlaceholder: 'Nach Titel filtern... (Strg+F)',
filterClearTitle: 'Filter loeschen (Esc)',
filterNoMatchTitle: 'Keine Treffer',

View File

@ -163,6 +163,7 @@ const UI_TEXT_EN = {
untitled: 'Untitled VOD',
views: 'views',
addQueue: '+ Queue',
trimButton: 'Trim',
filterPlaceholder: 'Filter by title... (Ctrl+F)',
filterClearTitle: 'Clear filter (Esc)',
filterNoMatchTitle: 'No matches',

View File

@ -185,6 +185,10 @@ function changeLanguage(lang: string): void {
renderQueue();
renderStreamers();
// Re-render the VOD grid so the dynamically built button labels
// (trim / queue) and the filter empty-state pick up the new locale.
renderVodGridFromCurrentState();
refreshVodSortSelectLabels();
const activeTabId = document.querySelector('.tab-content.active')?.id || 'vodsTab';
const activeTab = activeTabId.replace('Tab', '');

View File

@ -182,7 +182,7 @@ function buildVodCardHtml(vod: VOD, streamer: string): string {
</div>
</div>
<div class="vod-actions">
<button class="vod-btn secondary" onclick="openClipDialog('${vod.url}', '${escapedTitle}', '${vod.created_at}', '${streamer}', '${vod.duration}')">Clip</button>
<button class="vod-btn secondary" onclick="openClipDialog('${vod.url}', '${escapedTitle}', '${vod.created_at}', '${streamer}', '${vod.duration}')">${UI_TEXT.vods.trimButton}</button>
<button class="vod-btn primary" onclick="addToQueue('${vod.url}', '${escapedTitle}', '${vod.created_at}', '${streamer}', '${vod.duration}')">${UI_TEXT.vods.addQueue}</button>
</div>
</div>