From bd8ff4cb1d61dcf70e224b549caf2b3ef3caeba7 Mon Sep 17 00:00:00 2001
From: "Mehdi Outagant (MOU)" <mou@odoo.com>
Date: Fri, 11 Apr 2025 17:18:30 +0200
Subject: [PATCH] [FIX] theme_*: translate paragraph links as a whole.

*: artists, cobalt, enark, graphene, kea, kiddo, loftspace, monglia, nano,
notes, odoo_experts, orchid, paptic, real_estate, vehicle, yes

Steps to reproduce:

1. Enable a second language in the website (e.g., French).

2. Add a "Text" block (in edit mode) > Save the page.

3. Translate a text paragraph to french > Save.

4. In edit mode again, add a link to a word in the paragraph > Save.

5. The translation in French is lost, and sometimes the whole French
    translation is used for the text before or after the link.

This is actually a limitation in the translation implementation. If we
initially have `text_1_en text_2_en text_3_en` translated to French this
way:

terms en_US: `["text_1_en text_2_en text_3_en"]`
terms fr_BE: `["text_1_fr text_2_fr text_3_fr"]`

After adding a link: `text_1_en<a...>text_2_en</a>text_3_en`, and since
the links are not translated as a whole, we should get:

terms en_US: `["text_1_en", "text_2_en", "text_3_en"]`
terms fr_BE: `["text_1_fr text_2_fr text_3_fr"]`

Which means the current translation will be lost, and the result will
depend on the outcome of `get_close_matches()`. Which explains why when
the link is added to the first words of the paragraph, the system still
maps the rest of the paragraph to its "full old translation".

The goal of this commit is to make this behavior less aggressive by
forcing the links added in paragraphs [1] to be translated as a whole.
This way, the `get_close_matches()` will map the new content with a link
to its old translation (without a link), and then, the user can set the
link in the "the most meaningful part of the translation" in the
translate mode.

[1]: We should use the "translate as a whole" feature carefully with
links, since there are already some situations where it's causing
issues (see the fix in [2]). So we only force them inside paragraphs.

[2]: https://github.com/odoo/odoo/commit/9bd60ca93510e410a0136b8b433f596330900593

Remark: This commit also sets the `o_translate_inline` class by default
on paragraph links in website templates.

opw-3984439

closes odoo/design-themes#1055

Related: odoo/odoo#204453
Signed-off-by: Outagant Mehdi (mou) <mou@odoo.com>
---
 theme_artists/views/snippets/s_carousel.xml         | 6 +++---
 theme_artists/views/snippets/s_three_columns.xml    | 6 +++---
 theme_cobalt/views/customizations.xml               | 2 +-
 theme_enark/views/snippets/s_numbers_list.xml       | 2 +-
 theme_graphene/views/customizations.xml             | 2 +-
 theme_kea/views/snippets/s_cover.xml                | 2 +-
 theme_kiddo/views/snippets/s_call_to_action.xml     | 2 +-
 theme_loftspace/views/snippets/s_call_to_action.xml | 2 +-
 theme_monglia/views/customizations.xml              | 4 ++--
 theme_nano/views/snippets/s_discovery.xml           | 2 +-
 theme_notes/views/snippets/s_carousel.xml           | 4 ++--
 theme_notes/views/snippets/s_three_columns.xml      | 6 +++---
 theme_odoo_experts/views/snippets/s_picture.xml     | 2 +-
 theme_orchid/views/snippets/s_framed_intro.xml      | 2 +-
 theme_paptic/views/customizations.xml               | 2 +-
 theme_real_estate/views/snippets/s_image_text.xml   | 2 +-
 theme_vehicle/views/customizations.xml              | 6 +++---
 theme_yes/views/snippets/s_freegrid.xml             | 2 +-
 theme_yes/views/snippets/s_masonry_block.xml        | 8 ++++----
 19 files changed, 32 insertions(+), 32 deletions(-)

diff --git a/theme_artists/views/snippets/s_carousel.xml b/theme_artists/views/snippets/s_carousel.xml
index be0b63cbe..f491551b7 100644
--- a/theme_artists/views/snippets/s_carousel.xml
+++ b/theme_artists/views/snippets/s_carousel.xml
@@ -8,7 +8,7 @@
             <h2 style="text-align: center;">Aquitani</h2>
             <p class="lead" style="text-align: center;"><b>Photoshoot / June 2021</b></p>
             <p style="text-align: center;">
-                <a href="#" class="btn btn-primary btn-lg">Discover</a>
+                <a href="#" class="btn btn-primary btn-lg o_translate_inline">Discover</a>
             </p>
         </div>
     </xpath>
@@ -27,7 +27,7 @@
             <h2 style="text-align: center;">Immemorabili</h2>
             <p class="lead" style="text-align: center;"><b>Painting concept / April 2021</b></p>
             <p style="text-align: center;">
-                <a href="#" class="btn btn-primary btn-lg">Discover</a>
+                <a href="#" class="btn btn-primary btn-lg o_translate_inline">Discover</a>
             </p>
         </div>
     </xpath>
@@ -46,7 +46,7 @@
             <h2 style="text-align: center;">Vincam</h2>
             <p class="lead" style="text-align: center;"><b>Typographic collection / March 2021</b></p>
             <p style="text-align: center;">
-                <a href="#" class="btn btn-primary btn-lg">Discover</a>
+                <a href="#" class="btn btn-primary btn-lg o_translate_inline">Discover</a>
             </p>
         </div>
     </xpath>
diff --git a/theme_artists/views/snippets/s_three_columns.xml b/theme_artists/views/snippets/s_three_columns.xml
index de0310727..63cbb4710 100644
--- a/theme_artists/views/snippets/s_three_columns.xml
+++ b/theme_artists/views/snippets/s_three_columns.xml
@@ -24,7 +24,7 @@
     </xpath>
     <!-- Column #1 - Add a button -->
     <xpath expr="//div[hasclass('card-body')]//p" position="after">
-        <p><a href="#" class="btn btn-primary">More details</a></p>
+        <p><a href="#" class="btn btn-primary o_translate_inline">More details</a></p>
     </xpath>
     <!-- Column #2 -->
     <xpath expr="(//div[hasclass('card')])[2]" position="attributes">
@@ -44,7 +44,7 @@
     </xpath>
     <!-- Column #2 - Add a button -->
     <xpath expr="(//div[hasclass('card-body')])[2]//p" position="after">
-        <p><a href="#" class="btn btn-primary">Discover</a></p>
+        <p><a href="#" class="btn btn-primary o_translate_inline">Discover</a></p>
     </xpath>
     <!-- Column #3 -->
     <xpath expr="(//div[hasclass('card')])[3]" position="attributes">
@@ -64,7 +64,7 @@
     </xpath>
     <!-- Column #3 - Add a button -->
     <xpath expr="(//div[hasclass('card-body')])[3]//p" position="after">
-        <p><a href="/contactus" class="btn btn-primary">Contact me</a></p>
+        <p><a href="/contactus" class="btn btn-primary o_translate_inline">Contact me</a></p>
     </xpath>
 </template>
 
diff --git a/theme_cobalt/views/customizations.xml b/theme_cobalt/views/customizations.xml
index 88531a8ae..bbbaba186 100644
--- a/theme_cobalt/views/customizations.xml
+++ b/theme_cobalt/views/customizations.xml
@@ -91,7 +91,7 @@
         <h5>Web &amp; App Development</h5>
         <p>We have collected solid experience in building native and cross-platform mobile applications and websites. Check our portfolio from clients around the world.</p>
         <br/>
-        <p><a href="#" class="btn btn-secondary">Learn more</a></p>
+        <p><a href="#" class="btn btn-secondary o_translate_inline">Learn more</a></p>
     </xpath>
     <xpath expr="//a[hasclass('btn')]" position="replace"/>
 </template>
diff --git a/theme_enark/views/snippets/s_numbers_list.xml b/theme_enark/views/snippets/s_numbers_list.xml
index 4df2e3a77..43fb9dfb7 100644
--- a/theme_enark/views/snippets/s_numbers_list.xml
+++ b/theme_enark/views/snippets/s_numbers_list.xml
@@ -4,7 +4,7 @@
 <template id="s_numbers_list" inherit_id="website.s_numbers_list">
     <xpath expr="//div[hasclass('col-lg-5')]//p" position="after">
         <p><br/></p>
-        <p><a href="#" class="btn btn-secondary">More details</a></p>
+        <p><a href="#" class="btn btn-secondary o_translate_inline">More details</a></p>
     </xpath>
 </template>
 
diff --git a/theme_graphene/views/customizations.xml b/theme_graphene/views/customizations.xml
index d0da54d88..55f13075f 100644
--- a/theme_graphene/views/customizations.xml
+++ b/theme_graphene/views/customizations.xml
@@ -22,7 +22,7 @@
                     Our mission is to give customers the best experience.<br/>Extensive documentation &amp; guides, an active community,<br/>24/7 support make it a pleasure to work with us.
                 </p>
                 <p>
-                    <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg"><t t-esc="cta_btn_text">Contact us</t></a>
+                    <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg o_translate_inline"><t t-esc="cta_btn_text">Contact us</t></a>
                 </p>
             </div>
         </div>
diff --git a/theme_kea/views/snippets/s_cover.xml b/theme_kea/views/snippets/s_cover.xml
index 987e9935c..b5757b740 100644
--- a/theme_kea/views/snippets/s_cover.xml
+++ b/theme_kea/views/snippets/s_cover.xml
@@ -25,7 +25,7 @@
     <!-- Button -->
     <xpath expr="//a[hasclass('btn')]" position="replace"/>
     <xpath expr="//a[hasclass('btn')]" position="replace">
-        <a href="#0" class="btn btn-primary btn-lg">Discover more</a>
+        <a href="#0" class="btn btn-primary btn-lg o_translate_inline">Discover more</a>
     </xpath>
 </template>
 
diff --git a/theme_kiddo/views/snippets/s_call_to_action.xml b/theme_kiddo/views/snippets/s_call_to_action.xml
index e656651b5..3b6630c55 100644
--- a/theme_kiddo/views/snippets/s_call_to_action.xml
+++ b/theme_kiddo/views/snippets/s_call_to_action.xml
@@ -19,7 +19,7 @@
             <h3 style="text-align: center;">2,000 parents<br/> brought their kid to our nursery.</h3>
             <p style="text-align: center;">Entrust us with your children and go to work with peace of mind</p>
             <p><br/></p>
-            <p style="text-align: center;"><a t-att-href="cta_btn_href" class="btn btn-primary btn-lg"><t t-esc="cta_btn_text">Contact us</t></a></p>
+            <p style="text-align: center;"><a t-att-href="cta_btn_href" class="btn btn-primary btn-lg o_translate_inline"><t t-esc="cta_btn_text">Contact us</t></a></p>
         </div>
     </xpath>
 
diff --git a/theme_loftspace/views/snippets/s_call_to_action.xml b/theme_loftspace/views/snippets/s_call_to_action.xml
index 98b27f60e..5cd062008 100644
--- a/theme_loftspace/views/snippets/s_call_to_action.xml
+++ b/theme_loftspace/views/snippets/s_call_to_action.xml
@@ -27,7 +27,7 @@
     </xpath>
     <!-- Add secondary button -->
     <xpath expr="//a[hasclass('btn')]" position="before">
-        <a href="#" class="btn btn-secondary btn-lg me-2 mb-2">Our services</a>
+        <a href="#" class="btn btn-secondary btn-lg me-2 mb-2 o_translate_inline">Our services</a>
     </xpath>
 </template>
 
diff --git a/theme_monglia/views/customizations.xml b/theme_monglia/views/customizations.xml
index c04b64d78..84842357f 100644
--- a/theme_monglia/views/customizations.xml
+++ b/theme_monglia/views/customizations.xml
@@ -181,7 +181,7 @@
     </xpath>
     <xpath expr="//p[2]" position="replace"/>
     <xpath expr="//a" position="replace">
-        <a href="/contactus" class="btn btn-primary">Learn more</a>
+        <a href="/contactus" class="btn btn-primary o_translate_inline">Learn more</a>
     </xpath>
 </template>
 
@@ -227,7 +227,7 @@
         <p class="lead">This is the first full-length studio release in seven years for the British singer-songwriter.</p>
     </xpath>
     <xpath expr="//a" position="replace">
-        <a href="/contactus" class="btn btn-primary">Discover</a>
+        <a href="/contactus" class="btn btn-primary o_translate_inline">Discover</a>
     </xpath>
     <xpath expr="(//div[hasclass('carousel-item')])[2]" position="attributes">
         <attribute name="class" add="o_cc o_cc5" separator=" "/>
diff --git a/theme_nano/views/snippets/s_discovery.xml b/theme_nano/views/snippets/s_discovery.xml
index 8d7187003..7a4cf96e9 100644
--- a/theme_nano/views/snippets/s_discovery.xml
+++ b/theme_nano/views/snippets/s_discovery.xml
@@ -21,7 +21,7 @@
     </xpath>
 
     <xpath expr="//p[2]" position="replace" mode="inner">
-        <a t-att-href="cta_btn_href" class="btn btn-lg btn-primary"><t t-out="cta_btn_text">Get Started</t></a>
+        <a t-att-href="cta_btn_href" class="btn btn-lg btn-primary o_translate_inline"><t t-out="cta_btn_text">Get Started</t></a>
     </xpath>
 
 </template>
diff --git a/theme_notes/views/snippets/s_carousel.xml b/theme_notes/views/snippets/s_carousel.xml
index 8afc2a13b..b8b5b2fb4 100644
--- a/theme_notes/views/snippets/s_carousel.xml
+++ b/theme_notes/views/snippets/s_carousel.xml
@@ -26,7 +26,7 @@
             <h2 class="display-3-fs">6 Days Pass</h2>
             <p class="lead">Tickets will be on sale soon. Do not miss our 6 Days Pass. Free camping!</p>
             <p><br/></p>
-            <p><a href="/" class="btn btn-primary btn-lg">More Info</a></p>
+            <p><a href="/" class="btn btn-primary btn-lg o_translate_inline">More Info</a></p>
         </div>
     </xpath>
     <!-- Slide #3 -->
@@ -38,7 +38,7 @@
             <h2 class="display-3-fs">Recent Editions</h2>
             <p class="lead">Discover what makes the reputation of the Miraillet festival through these after-movies.</p>
             <p><br/></p>
-            <p><a href="/" class="btn btn-primary btn-lg">More Info</a></p>
+            <p><a href="/" class="btn btn-primary btn-lg o_translate_inline">More Info</a></p>
         </div>
     </xpath>
 </template>
diff --git a/theme_notes/views/snippets/s_three_columns.xml b/theme_notes/views/snippets/s_three_columns.xml
index b66bffe38..97b5fe8e1 100644
--- a/theme_notes/views/snippets/s_three_columns.xml
+++ b/theme_notes/views/snippets/s_three_columns.xml
@@ -31,7 +31,7 @@
             <br/>
         </p>
         <p>
-            <a class="btn btn-primary" href="#">Get your tickets</a>
+            <a class="btn btn-primary o_translate_inline" href="#">Get your tickets</a>
         </p>
     </xpath>
     <!-- Card 2 -->
@@ -51,7 +51,7 @@
             <br/>
         </p>
         <p>
-            <a class="btn btn-primary" href="#">Get your tickets</a>
+            <a class="btn btn-primary o_translate_inline" href="#">Get your tickets</a>
         </p>
     </xpath>
     <!-- Card 3 -->
@@ -66,7 +66,7 @@
         <p>Tour Grand Final.</p>
         <p><br/></p>
         <p>
-            <a class="btn btn-primary" href="#">Get your tickets</a>
+            <a class="btn btn-primary o_translate_inline" href="#">Get your tickets</a>
         </p>
     </xpath>
 </template>
diff --git a/theme_odoo_experts/views/snippets/s_picture.xml b/theme_odoo_experts/views/snippets/s_picture.xml
index c906e1106..a353205c8 100644
--- a/theme_odoo_experts/views/snippets/s_picture.xml
+++ b/theme_odoo_experts/views/snippets/s_picture.xml
@@ -28,7 +28,7 @@
     <!-- Add a button -->
     <xpath expr="//p[1]" position="after">
         <p style="text-align: center;">
-            <a t-att-href="cta_btn_href" class="btn btn-primary rounded-circle btn-lg"><t t-esc="cta_btn_text">Contact Us</t></a>
+            <a t-att-href="cta_btn_href" class="btn btn-primary rounded-circle btn-lg o_translate_inline"><t t-esc="cta_btn_text">Contact Us</t></a>
         </p>
     </xpath>
     <!-- Image -->
diff --git a/theme_orchid/views/snippets/s_framed_intro.xml b/theme_orchid/views/snippets/s_framed_intro.xml
index 8383f5989..e73dddd45 100644
--- a/theme_orchid/views/snippets/s_framed_intro.xml
+++ b/theme_orchid/views/snippets/s_framed_intro.xml
@@ -24,7 +24,7 @@
     </xpath>
     <!-- CTA -->
     <xpath expr="//a" position="before">
-        <a href="#" class="btn btn-lg btn-secondary">See the Full Bloom</a>
+        <a href="#" class="btn btn-lg btn-secondary o_translate_inline">See the Full Bloom</a>
     </xpath>
     <xpath expr="//a" position="replace" mode="inner">
         About Us
diff --git a/theme_paptic/views/customizations.xml b/theme_paptic/views/customizations.xml
index ff6742471..11703e1dd 100644
--- a/theme_paptic/views/customizations.xml
+++ b/theme_paptic/views/customizations.xml
@@ -35,7 +35,7 @@
     <xpath expr="//p[2]" position="replace">
         <p>
             <br/>
-            <a href="#" class="btn btn-lg btn-primary">Our solutions</a>
+            <a href="#" class="btn btn-lg btn-primary o_translate_inline">Our solutions</a>
         </p>
     </xpath>
 
diff --git a/theme_real_estate/views/snippets/s_image_text.xml b/theme_real_estate/views/snippets/s_image_text.xml
index 657568e7b..8520b3c7f 100644
--- a/theme_real_estate/views/snippets/s_image_text.xml
+++ b/theme_real_estate/views/snippets/s_image_text.xml
@@ -15,7 +15,7 @@
         Discover our tailor-made services to embellish the decoration of your home.
     </xpath>
     <xpath expr="//p[3]" position="replace">
-        <p><a href="#" class="btn btn-secondary">Explore our services</a></p>
+        <p><a href="#" class="btn btn-secondary o_translate_inline">Explore our services</a></p>
     </xpath>
 
     <!-- Image -->
diff --git a/theme_vehicle/views/customizations.xml b/theme_vehicle/views/customizations.xml
index 8b82a36f9..c8153de45 100644
--- a/theme_vehicle/views/customizations.xml
+++ b/theme_vehicle/views/customizations.xml
@@ -300,21 +300,21 @@
     </xpath>
     <!-- Column 1 -->
     <xpath expr="//p[hasclass('card-text')]" position="after">
-        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4">Configure</a></p>
+        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4 o_translate_inline">Configure</a></p>
     </xpath>
     <xpath expr="//p[hasclass('card-text')]" position="after">
         <span class="d-inline-block mb-4"><b>From $14,000</b></span>
     </xpath>
     <!-- Column 2 -->
     <xpath expr="(//p[hasclass('card-text')])[2]" position="after">
-        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4">Configure</a></p>
+        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4 o_translate_inline">Configure</a></p>
     </xpath>
     <xpath expr="(//p[hasclass('card-text')])[2]" position="after">
         <span class="d-inline-block mb-4"><b>From $19,000</b></span>
     </xpath>
     <!-- Column 3 -->
     <xpath expr="(//p[hasclass('card-text')])[3]" position="after">
-        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4">Configure</a></p>
+        <p><a href="#" class="btn btn-primary btn-block mb-0 o_cc o_cc4 o_translate_inline">Configure</a></p>
     </xpath>
     <xpath expr="(//p[hasclass('card-text')])[3]" position="after">
         <span class="d-inline-block mb-4"><b>From $25,000</b></span>
diff --git a/theme_yes/views/snippets/s_freegrid.xml b/theme_yes/views/snippets/s_freegrid.xml
index a94e9a43d..c6556cdfd 100644
--- a/theme_yes/views/snippets/s_freegrid.xml
+++ b/theme_yes/views/snippets/s_freegrid.xml
@@ -37,7 +37,7 @@
             <h2 style="text-align: center;">Discover some of the latest<br/>moments we helped to create</h2>
             <p><br/></p>
             <p style="text-align: center;">
-                <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg"><t t-esc="cta_btn_text">View all the pictures</t></a>
+                <a t-att-href="cta_btn_href" class="btn btn-primary btn-lg o_translate_inline"><t t-esc="cta_btn_text">View all the pictures</t></a>
             </p>
         </div>
     </xpath>
diff --git a/theme_yes/views/snippets/s_masonry_block.xml b/theme_yes/views/snippets/s_masonry_block.xml
index e2fac5f0c..a38395974 100644
--- a/theme_yes/views/snippets/s_masonry_block.xml
+++ b/theme_yes/views/snippets/s_masonry_block.xml
@@ -10,7 +10,7 @@
     <!-- Little block #01 - Text -->
     <xpath expr="//*[hasclass('col-lg-3')]//p" position="replace">
         <p>Check out our list of favorite caterers.</p>
-        <p><a href="#" class="btn btn-secondary rounded-circle">Find a Caterer</a></p>
+        <p><a href="#" class="btn btn-secondary rounded-circle o_translate_inline">Find a Caterer</a></p>
     </xpath>
 
     <!-- Bigger block #02 - Title -->
@@ -20,7 +20,7 @@
     <!-- Bigger block #02 - Text -->
     <xpath expr="//*[hasclass('col-lg-4')]//p" position="replace">
         <p>Check out our carefully curated list of favorite venues.</p>
-        <p><a href="#" class="btn btn-secondary">Find a venue</a></p>
+        <p><a href="#" class="btn btn-secondary o_translate_inline">Find a venue</a></p>
     </xpath>
 
     <!-- Bigger block #03 - Title -->
@@ -30,7 +30,7 @@
     <!-- Bigger block #03 - Text -->
     <xpath expr="//*[hasclass('col-lg-4')][2]//p" position="replace">
         <p>Find the perfect outfit for before, during and after the main event.</p>
-        <p><a href="#" class="btn btn-primary">Shop</a></p>
+        <p><a href="#" class="btn btn-primary o_translate_inline">Shop</a></p>
     </xpath>
 
     <!-- Little block #04 - Title -->
@@ -40,7 +40,7 @@
     <!-- Little block #04 - Text -->
     <xpath expr="//*[hasclass('col-lg-3')][2]//p" position="replace">
         <p>Find the answers to all your questions in our FAQ.</p>
-        <p><a href="#" class="btn btn-primary">Go to FAQ</a></p>
+        <p><a href="#" class="btn btn-primary o_translate_inline">Go to FAQ</a></p>
     </xpath>
 </template>