Backup: flip the folder chevrons and back arrows in right-to-left languages

[CGastrell]

Fixes JETPACK-2977

Proposed changes

• In right-to-left languages, the modernized Backup dashboard now flips its directional icons:
  • "Back" links on the Restore screen, the Download screen and the invalid-backup screen show arrowRight instead of arrowLeft.
  • Closed folders in the file browser show chevronLeft instead of chevronRight. Open folders keep chevronDown.
• The icon is picked with isRTL() from @wordpress/i18n. wp-build route CSS gets no RTL pass, so CSS mirroring is not an option here. Other Jetpack packages (Boost, js-packages/components) use the same inline isRTL() check.
• The "Restore to this point" button keeps its rotateLeft icon. It is a counter-clockwise restore arrow, not a direction, and Gutenberg does not mirror it either.
• The modernized dashboard is behind the rsm_jetpack_ui_modernization_backup filter, so the changelog entry has no body.

Related product discussion/links

• JETPACK-2977. Found in the pre-flip audit.
• Project: Backup dashboard: the design pass.

Does this pull request change what data or activity we track or use?

No.

Testing instructions

Unit tests: tests/file-browser-icons.test.tsx and tests/invalid-rewind-id.test.tsx cover each icon in LTR and RTL. Five of them fail without this change.

In a browser, you need a site that is connected to WordPress.com and has a Backup plan with at least one backup, running this branch of packages/backup. Log in as the connection owner.

1. Turn on the modernized dashboard, for example with a mu-plugin (in the monorepo Docker environment, put it in tools/docker/mu-plugins/):

   <?php
   add_filter( 'rsm_jetpack_ui_modernization_backup', '__return_true' );

2. In Users › Profile, set your language to Hebrew or Arabic (install the language pack first if needed), and go to Jetpack › VaultPress Backup.

3. In the backup detail pane, find the file browser (it is open already). Expect: closed folders show a left-pointing chevron.

4. Open the Download screen for a backup. Do not generate a download. Expect: the "Back" link's arrow points right.

5. Open the Restore screen for a backup. Do not confirm a restore. Expect: the "Back" link's arrow points right.

6. On the Restore or Download screen, replace the backup id in the URL with abc (for example, admin.php?page=jetpack-backup&p=/restore/abc) and reload. Expect: the invalid-backup screen's "Back" arrow points right.

7. Set your language back to English. Expect: every icon points as on trunk.

I ran these steps on a local Docker site (connected, with a Backup plan), as a user with the Hebrew language.

State	Before (trunk)	After (this branch)
File browser, closed folders
Download screen, Back link

Restore screen, Back link, after

Invalid-backup screen, Back link, after

🤖 Generated with Claude Code

[github-actions]

Are you an Automattician? Please test your changes on all WordPress.com environments to help mitigate accidental explosions.

• To test on WoA, go to the Plugins menu on a WoA dev site. Click on the "Upload" button and follow the upgrade flow to be able to upload, install, and activate the Jetpack Beta plugin. Once the plugin is active, go to Jetpack > Jetpack Beta, select your plugin (Jetpack), and enable the fix/jetpack-2977-backup-rtl-icons branch.
• To test on Simple, run the following command on your sandbox:

bin/jetpack-downloader test jetpack fix/jetpack-2977-backup-rtl-icons

Interested in more tips and information?

• In your local development environment, use the jetpack rsync command to sync your changes to a WoA dev blog.
• Read more about our development workflow here: PCYsg-eg0-p2
• Figure out when your changes will be shipped to customers here: PCYsg-eg5-p2

[github-actions]

Thank you for your PR!

When contributing to Jetpack, we have a few suggestions that can help us test and review your patch:

• ✅ Include a description of your PR changes.
  
• ✅ Add a "[Status]" label (In Progress, Needs Review, ...).
  
• ✅ Add testing instructions.
  
• ✅ Specify whether this PR includes any changes to data or privacy.
  
• ✅ Add changelog entries to affected projects
  

This comment will be updated as you work on your PR and make changes. If you think that some of those checks are not needed for your PR, please explain why you think so. Thanks for cooperation 🤖

---

Follow this PR Review Process:

1. Ensure all required checks appearing at the bottom of this PR are passing.
2. Make sure to test your changes on all platforms that it applies to. You're responsible for the quality of the code you ship.
3. You can use GitHub's Reviewers functionality to request a review.
4. When it's reviewed and merged, you will be pinged in Slack to deploy the changes to WordPress.com simple once the build is done.

If you have questions about anything, reach out in #jetpack-developers for guidance!

[jp-launch-control]

Code Coverage Summary

Coverage changed in 1 file.

File	Coverage	Δ%	Δ Uncovered
projects/packages/backup/src/dashboard/components/file-browser/index.tsx	140/181 (77.35%)	0.13%	0 💚

Full summary · PHP report · JS report

[dhasilva]

Looks good. The isRTL() choice matches the fix the issue suggested, and I found no other directional icons in the dashboard that need the same treatment. CI is green. One non-blocking nit on a test, inline.

Generated by Claude.

[dhasilva]

Nit: a back arrow points toward the inline start (left in LTR, right in RTL). "Toward the inline end" is true of the folder chevron, so this name looks copied from that test.

This case also runs only in RTL, though the PR body says each icon is covered in LTR and RTL. An LTR row, like the chevron test has, would catch a regression to an always-arrowRight arrow, which this RTL-only row can't see.

Generated by Claude.

[CGastrell]

Fixed in 136759b. The test now says "inline start" and has LTR and RTL rows for both a valid and an invalid rewind id. With the arrow forced to always arrowRight, the LTR rows fail.