When translating content, I want to confirm/discard changes to the active languages in a single step

• Type: Epic
• Status: Closed
• Priority: Minor
• Resolution: Completed
• Affects Version/s: None
• Fix Version/s: 7.4.3.5 CE GA5
• Component/s: DXP Components Web > Translation Manager
• Labels:
  • 7.4-portal-ga5
  • fc_21_10
  • fi-s-dxp
  • fi-s-new-team
  • team_fi_epic_category_frontend_components
• Epic/Theme:
  • FI_Platform_Evolution
• Main Core Job: Orchestrate - Centralize Content
• Epic Status: To Do
• Sprint: S04E30 - Sea Change

Once our first iteration of the translation manager (LPS-133329) is in the process of being integrated in the Web Content Structure management page, we received some feedback concerning user interaction with the Translation Admin.

This piece allows user to define the active locales that will be available for selection when it comes to localize any translatable entity (web content structures in this case)

As a result of analyzing and discussing that feedback we came up with a new proposal which:

• should be straightforward to implement
• improves user interaction and clarity while managing languages
• does not require any extra work in the apps integrating with the component

Goal of this epic is to implement 2 UX improvements in the Translation Admin modal (add cancel/save buttons and remove the undo/success message) as well as fix some UX issues found during the review. Please refer to the proposal and epic tasks for details

Acceptance criteria:

• Translation admin modal allows user to cancel any change made to the list of active locales
• Translation admin modal allows user to confirm the changes made to the list of active locales
• Translation manager component fixes the issues and visual glitches we detected in the analysis review

 
Test Scenarios:

Requirement	Test Scenarios	Covered by frontend/backend Unit Test?	Test Priority (business impact)	Chrome Pass/Fail
Translation admin modal allows user to cancel any change made to the list of active locales	Given: Manage Translations modal is open When: Add a language from the dropdown list And When: Click Cancel button Then: Assert Manage Translations modal is closed And Then: Click the language selector, assert the language is not active	no	5-critical
	Given: Manage Translations modal is open When: Add a language from the dropdown list And When: Click somewhere outside the modal Then: Assert Manage Translations modal is closed And Then: Click the language selector, assert the language is not active	no	4-major
Translation admin modal allows user to confirm the changes made to the list of active locales	Given: Manage Translations modal is open When: Add a language from the dropdown list And When: Click Done button Then: Assert Manage Translations modal is closed And Then: Click the language selector, assert the language is active	no	5-critical
	Given: Manage Translations modal is open When: Add a language from the dropdown list Then: Assert no success message and undo option	no	5-critical
Translation manager component fixes the issues and visual glitches we detected in the analysis review	Given: A non-default translation has been added When: Open Manage Translations modal And When: Delete the language from the manage translation list And When: Add the language back from the dropdown list Then: Assert the language is still translated	no	4-major
	Given: A non-default translation has been added When: Open Manage Translations modal And When: Delete the language from the manage translation list, and click Done And When: Open Manage Translations modal again, add the language back from the dropdown list Then: Assert the language is changed back to Not Translated status	no	4-major

Exploratory testing to consider:

Requirement	Test Case	Test Priority (business impact)	Chrome Pass/Fail	Safari Pass/Fail	Firefox Pass/Fail	Edge Pass/Fail	Comments
	Exploratory Test for the Manage Translations modal on Chrome / FF / EDGE / SAFARI	2-low
	Exploratory Test for the Manage Translations modal in the mobile device (smart phone, tablet)	2-low			n/a	n/a
Accessibility	Given: Manage Translations modal When: Use keyboard only Then: Able to access all interactible elements on page	2-low		n/a	n/a	n/a
	Given: Manage Translations modal When: using a screenreader Then: identifies all aspects of actions and sections and user can navigate the page	2-low		n/a	n/a	n/a
	Given: Manage Translations modal When: Use AXE chrome extension Then: No issues related to WCAG AA and A	2-low		n/a	n/a	n/a