Show the "Design your own" banner when editing a theme which is not TT4

[albarin]

Submission Review Guidelines:

• I have followed the WooCommerce Contributing Guidelines and the WordPress Coding Standards.
• I have checked to ensure there aren't other open Pull Requests for the same update/change.
• I have reviewed my code for security best practices.
• Following the above guidelines will result in quick merges and clear and detailed feedback when appropriate.

Changes proposed in this Pull Request:

This PR adds the "switch theme warning modal" to the Edit your custom theme Intro page. The modal will only show when the active theme is NOT Twenty Twenty Four.

Closes #44725

How to test the changes in this Pull Request:

Using the WooCommerce Testing Instructions Guide, include your detailed testing instructions:

1. Ensure the WooCommerce Beta Tester plugin is installed and activated (available on this monorepo).
2. Head over to /wp-admin/tools.php?page=woocommerce-admin-test-helper and enable customize-store feature flag.
3. Click on Tools and run the Reset Customize Your Store and the Delete all products commands.
4. Enable the TT4 theme.
5. Switch to another block theme.
6. Visit the wp-admin/admin.php?page=wc-admin&path=/customize-store.
7. Make sure you see the Design your own banner.
8. Click on the Start designing button.
9. Make sure you see this modal.

11. Check that clicking Cancel closes the modal.
12. Check that clicking on Design a new theme goes through the flow to the assembler.
13. Make sure the theme is switched to TT4.

Changelog entry

• Automatically create a changelog entry from the details below.

Significance

• Patch
• Minor
• Major

Type

• Fix - Fixes an existing bug
• Add - Adds functionality
• Update - Update existing functionality
• Dev - Development related task
• Tweak - A minor adjustment to the codebase
• Performance - Address performance issues
• Enhancement - Improvement to existing functionality

Message

CYS - Show the "Design your own" banner when editing a different theme than TT4 in the CYS flow.

Comment

[github-actions]

Test Results Summary

Commit SHA: 6fa3e81

Test 🧪	Passed ✅	Failed 🚨	Broken 🚧	Skipped ⏭️	Unknown ❔	Total 📊	Duration ⏱️
API Tests	259	0	0	2	0	261	0m 39s
E2E Tests	319	0	0	32	0	351	7m 36s

---

To view the full API test report, click here.
To view the full E2E test report, click here.
To view all test reports, visit the WooCommerce Test Reports Dashboard.

[github-actions]

Hi @gigitux, @nefeline,

Apart from reviewing the code changes, please make sure to review the testing instructions as well.

You can follow this guide to find out what good testing instructions should look like:
https://github.com/woocommerce/woocommerce/wiki/Writing-high-quality-testing-instructions

[nefeline]

Thanks for your work here @albarin !

I can confirm everything is working as expected, the only oddity observed was this one:

Screen.Recording.2024-03-12.at.13.39.41.mov

There's a slight delay in switching the banner whenever the current active theme is an already customized version of TT4: do you think its worth fixing this on this PR or on a separate one?

[albarin]

@nefeline thanks for the catch, I've changed the fetching of the current theme to get it from context, to avoid that flickering.
Can you have another look? 🙏

[nefeline]

Great work! Confirmed things are working as expected now.