## User Story:
As a user, I want to be able to read any wish or other text on the page in my own language so that I understand the full context of the wish or easily find my way around.
This does not cover translating talk pages; that's being handled in: {T371006}
To be discussed is which pieces need translation, we already know:
* Dashboard and all-wishes page: wish titles in tables
* Individual wish pages: title, description, and audience
* Focus area pages (although not the comments people leave on votes; those are more like talk page content and will be handled alongside talk pages)
## Acceptance criteria:
- [ ] Show translate button at the top of the page if there is any text that is not in the current UI language
- [ ] On clicking translate button, replace the original text with translated text and toggle the state of the translate button
- [ ] Show automatic translation disclaimer
- [ ] ~~Show the source and target language as a link. Clicking the link will show the language selector~~ Only required for talk pages; tracked in T371101
- [ ] Clicking the translate button again switches back to seeing the original language
- [ ] When showing original language, the translated text will be replaced by the original text and translate button will be toggled to its initial state
## Details for QA:
Aside from all the items in the acceptance criteria please also check:
- That the translation of the source text is fully shown without any truncation
- Wishes that have not yet been marked for translation should work as well (they'll have translate buttons everywhere other than when being viewed in a page that's already in their base language). This is the same as after a wish has been marked for translation but has not yet been translated.
- It should also be possible to translate to any valid language //from// any translation of a page (e.g. if you're on the `/es` translation, it can still have automatic translation applied)
## Designs:
https://www.figma.com/design/JcTMFwbEJPpCKBiZ16Jkel/Future-of-the-Wishlist?node-id=3070-70687&t=33MJMSFMIW415rDy-1
==Derived Requirement
Allow users to translate any wish or text on the page into their preferred language, excluding talk page comments, by providing a "translate" button that toggles between the original and translated text while displaying relevant language information.
==BDD
Feature: Translation of Wishes and Page Text
Scenario: Display translate button for content that is not in the current UI language
Given the user is on a wish or other related page
And there is content not in the current UI language
When the page loads
Then a translate button should be shown at the top of the page
Scenario: Translate page content on clicking the translate button
Given the user is on a wish or related page with a translate button
When the user clicks the translate button
Then the original text should be replaced with translated text
And a translation disclaimer should be shown
And the button should toggle to its translated state
Scenario: Switch back to original language by clicking translate button again
Given the user has translated a page's content
When the user clicks the translate button again
Then the translated text should be replaced by the original text
And the button should toggle to its initial state
====Test Steps
Test Case 1: Display Translate Button for Non-UI Language Content
Navigate to the all-wishes page with content not in the current UI language.
✅❓❌⬜ AC1: Confirm the translate button is displayed at the top of the page.
Test Case 2: Replace Original Text with Translated Text
On the all-wishes page, click the translate button.
✅❓❌⬜ AC2: Confirm the original text is replaced with translated text.
✅❓❌⬜ AC3: Confirm a translation disclaimer is shown.
Test Case 3: Toggle Back to Original Language
After translating the page, click the translate button again.
✅❓❌⬜ AC4: Confirm the translated text is replaced with the original text.
✅❓❌⬜ AC5: Confirm the translate button is toggled back to its initial state.
Test Case 4: Validate Translation of Different Pages (ex. Talk)
1. Click on a specific wish and go to the Discussion tab
2. ❌ AC5: Confirm the translate icon, and the original text is replaced with translated text
Ensure that no truncation occurs when translating content by observing translated text on multiple wishes.
✅❓❌⬜ AC6: Confirm the full text is visible and not cut off after translation.
Test Case 6: Check Translation for Wishes Not Marked for Translation
Verify that translation works for wishes that have not yet been marked for translation.
✅❓❌⬜ AC7: Confirm that translation occurs and buttons behave correctly even when the wish isn't marked for translation.
Test Case 7: Translation from an Already Translated Page
Navigate to a page in a non-UI language, such as /es, and verify the translation button still works.
✅❓❌⬜ AC8: Ensure that translation can still be applied, even if the page is already in a non-UI language.
== QA Results - Wishlist-test.toolforge
| **AC** | **Status** | **Details** |
| ----- | ----- | ----- |
| 1 | ✅ | T371098#10142696 |
| 2 | ✅ | T371098#10142696 |
| 3 | ❌ | T371098#10142696 |
| 4 | ✅ | T371098#10142696 |
| 5 | ❌ | T371098#10142696 |
| 6 | ✅ | T371098#10142696 |
| 7 | ❓ | T371098#10142696 |
| 8 | ✅ | T371098#10142696 |