feat: localize YouTube "view all videos" button by DavidKRK · Pull Request #173 · DavidKRK/DavidKRK.github.io

DavidKRK · 2026-04-15T13:52:09Z

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/dcf70b48-1135-44bd-ac4e-03d97467e100

name: Pull Request
about: Proposer un changement au projet
title: ''
labels: ''
assignees: ''

1. Quels sont les changements ?

Résumé des changements :

(Décrivez brièvement les modifications apportées.)

Tickets / Issues liés :

Closes #
Ref #

2. Pourquoi ces changements ?

Contexte métier :

(Expliquez la raison fonctionnelle ou business de ces changements.)

Justification technique :

(Expliquez les choix d'architecture ou d'implémentation retenus.)

3. Tests

Tests unitaires :

Nouveaux tests ajoutés
Tests existants mis à jour
Tous les tests passent (npm test / bundle exec rspec / …)

Tests manuels :

Testé en local
Testé sur un environnement de staging / preview

Performances & Sécurité :

Impact sur les performances évalué
Aucune vulnérabilité introduite (dépendances, injection, XSS, …)

4. Changements majeurs (Breaking Changes)

Cette PR introduit-elle des ruptures d'API ou de comportement ?

Non
Oui — détails ci-dessous :

(Décrivez les ruptures et les impacts pour les consommateurs de l'API / les autres équipes.)

Instructions de migration :

(Si applicable, décrivez les étapes nécessaires pour migrer.)

5. Exigences de déploiement

Migrations de base de données à exécuter
Nouvelles variables d'environnement à configurer (listez-les ci-dessous)
Feature flags à activer / désactiver
Services tiers à configurer ou notifier
Documentation mise à jour

Variables d'environnement :

Variable	Description	Valeur par défaut
`NOM_VAR`	Description	`valeur`

Notes de déploiement supplémentaires :

(Toute information utile pour l'équipe de déploiement.)

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/dcf70b48-1135-44bd-ac4e-03d97467e100 Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>

bolt-new-by-stackblitz · 2026-04-15T13:52:12Z

Run & review this pull request in StackBlitz Codeflow.

gemini-code-assist

Code Review

This pull request implements localization for the YouTube section in music.html by adding translation strings and manual DOM update logic. The review feedback suggests adopting the project's existing declarative localization pattern using the .lang-content class and data-lang attributes. This approach would eliminate the need for the manual JavaScript translation object and DOM manipulation, ensuring consistency with the rest of the codebase and simplifying maintenance.

gemini-code-assist · 2026-04-15T13:54:16Z

      <!-- YOUTUBE-AUTO-START -->
      <section class="youtube-section">
-        <h3><i class="fab fa-youtube" style="color:#ff0000;"></i> Dernières vidéos YouTube</h3>
+        <h3><i class="fab fa-youtube" style="color:#ff0000;"></i> <span id="youtube-section-title">Dernières vidéos YouTube</span></h3>


The project already uses a declarative pattern for localization (see lines 123-128) using the .lang-content class and data-lang attribute. To maintain consistency and reduce redundant JavaScript logic, it is recommended to use the same pattern here. This also allows you to correctly set the dir="rtl" attribute for the Arabic translation directly in the HTML.

<h3> Dernières vidéos YouTube Latest YouTube Videos Últimos vídeos de YouTube Azken YouTube bideoak أحدث مقاطع فيديو يوتيوب Останні відео YouTube </h3>

gemini-code-assist · 2026-04-15T13:54:16Z

          <a href="https://www.youtube.com/@DavidKRKofficial" target="_blank" rel="noopener noreferrer"
             style="display:inline-flex;align-items:center;gap:0.5rem;background:#ff0000;color:#fff;padding:0.6rem 1.4rem;border-radius:6px;font-family:'Russo One',sans-serif;font-size:0.9rem;text-decoration:none;transition:background 0.2s;">
-            <i class="fab fa-youtube"></i> Voir toutes les vidéos
+            <i class="fab fa-youtube"></i> <span id="youtube-btn-text">Voir toutes les vidéos</span>


Similar to the section title, using the declarative pattern for the button text ensures consistency and leverages the existing language switching logic. Note that you may need to ensure your CSS for .lang-content uses display: inline or display: contents when active to avoid breaking the button's layout.

 Voir toutes les vidéos View all videos Ver todos los vídeos Ikusi bideo guztiak عرض جميع مقاطع الفيديو Переглянути всі відео

gemini-code-assist · 2026-04-15T13:54:16Z

+        const langContent = {
+          fr: { youtube_title: 'Dernières vidéos YouTube', youtube_button: 'Voir toutes les vidéos' },
+          en: { youtube_title: 'Latest YouTube Videos', youtube_button: 'View all videos' },
+          es: { youtube_title: 'Últimos vídeos de YouTube', youtube_button: 'Ver todos los vídeos' },
+          eu: { youtube_title: 'Azken YouTube bideoak', youtube_button: 'Ikusi bideo guztiak' },
+          ar: { youtube_title: 'أحدث مقاطع فيديو يوتيوب', youtube_button: 'عرض جميع مقاطع الفيديو' },
+          uk: { youtube_title: 'Останні відео YouTube', youtube_button: 'Переглянути всі відео' }
+        };


This translation object becomes redundant if the declarative approach is used in the HTML. Removing it simplifies the script and improves maintainability by keeping all localized strings in the HTML structure.

gemini-code-assist · 2026-04-15T13:54:16Z

+            const t = langContent[lang] || langContent['fr'];
+            const titleEl = document.getElementById('youtube-section-title');
+            const btnEl = document.getElementById('youtube-btn-text');
+            if (titleEl) titleEl.textContent = t.youtube_title;
+            if (btnEl) btnEl.textContent = t.youtube_button;


These manual DOM updates are unnecessary if the elements use the .lang-content class, as the existing logic in switchLanguage (lines 218-222) already handles toggling their visibility based on the selected language automatically.

DavidKRK · 2026-04-15T13:54:57Z

@copilot fais les dernières modifications

Copilot

Pull request overview

Adds language-aware text for the YouTube section on music.html by targeting the “view all videos” label (and also the section heading) and updating the automation workflow to keep the button text targetable.

Changes:

Wraps the YouTube section heading and “view all videos” text in s with IDs in music.html.
Adds a small per-language translation map and updates switchLanguage() to update those YouTube texts.
Updates the YouTube auto-injection workflow to wrap the channel link text in a ….

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 3 comments.

File	Description
`music.html`	Adds span targets + per-language translations and updates the language switcher to localize YouTube heading/button text.
`.github/workflows/youtube-section-update.yml`	Adjusts generated channel link HTML so the button label can be updated by the page’s language switcher.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/b51d1e6d-60fe-4182-8214-12306892cf61 Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>

Copilot · 2026-04-15T14:00:44Z

@copilot fais les dernières modifications

Fait en commit 7f78e0c :

switchLanguage('fr') est maintenant appelé à l'initialisation (DOMContentLoaded), ce qui assure que le titre "Musique" et le bouton YouTube s'affichent bien en français au chargement de la page.
Les clés youtube_title inutilisées ont été retirées du langContent (suite à la suppression de id="youtube-section-title" sur le <h3>).

feat: localize YouTube "view all videos" button

73a087c

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/dcf70b48-1135-44bd-ac4e-03d97467e100 Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>

Copilot AI review requested due to automatic review settings April 15, 2026 13:52

DavidKRK assigned DavidKRK, Copilot, Claude and Codex Apr 15, 2026

Copilot started reviewing on behalf of DavidKRK April 15, 2026 13:52 View session

gemini-code-assist bot reviewed Apr 15, 2026

View reviewed changes

Copilot started work on behalf of DavidKRK April 15, 2026 13:55 View session

Copilot AI reviewed Apr 15, 2026

View reviewed changes

Comment thread music.html Outdated

Comment thread music.html Outdated

Comment thread .github/workflows/youtube-section-update.yml

DavidKRK and others added 3 commits April 15, 2026 15:56

Update .github/workflows/youtube-section-update.yml

d46067d

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Update music.html

2c47f25

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

fix: call switchLanguage on init and clean up unused langContent keys

7f78e0c

Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/b51d1e6d-60fe-4182-8214-12306892cf61 Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>

Copilot finished work on behalf of DavidKRK April 15, 2026 14:02

DavidKRK merged commit c3298bb into gh-pages Apr 15, 2026
7 of 8 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: localize YouTube "view all videos" button#173

feat: localize YouTube "view all videos" button#173
DavidKRK merged 4 commits intogh-pagesfrom
copilot/feat-localize-youtube-button

DavidKRK commented Apr 15, 2026

Uh oh!

bolt-new-by-stackblitz bot commented Apr 15, 2026

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

gemini-code-assist bot Apr 15, 2026

Uh oh!

gemini-code-assist bot Apr 15, 2026

Uh oh!

gemini-code-assist bot Apr 15, 2026

Uh oh!

gemini-code-assist bot Apr 15, 2026

Uh oh!

DavidKRK commented Apr 15, 2026

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI commented Apr 15, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Conversation

DavidKRK commented Apr 15, 2026

1. Quels sont les changements ?

2. Pourquoi ces changements ?

3. Tests

4. Changements majeurs (Breaking Changes)

5. Exigences de déploiement

Uh oh!

bolt-new-by-stackblitz bot commented Apr 15, 2026

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist bot Apr 15, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Apr 15, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Apr 15, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Apr 15, 2026

Choose a reason for hiding this comment

Uh oh!

DavidKRK commented Apr 15, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI commented Apr 15, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants